@meta2d/core 1.0.88 → 1.0.90

package/src/core.d.ts

@@ -30,6 +30,7 @@ export declare class Meta2d {
         topic?: string;
         url?: string;
         method?: string;
+        net?: any;
     }) => boolean | string;
     events: Record<number, (pen: Pen, e: Event, params?: any) => void>;
     map: ViewMap;

package/src/core.js

@@ -18,6 +18,7 @@ import { HotkeyType } from './data';
 import { Message, messageList } from './message';
 import { closeJetLinks, connectJetLinks, getSendData, sendJetLinksData } from './utils/jetLinks';
 import { le5leTheme } from './theme';
+const echartReg = /^echarts/;
 export class Meta2d {
     store;
     canvas;
@@ -555,7 +556,7 @@ export class Meta2d {
             if (item.prop) {
                 if (item.id && item.id !== '固定值') {
                     const pen = this.findOne(item.id);
-                    value[item.prop] = pen[item.key];
+                    value[item.prop] = getter(pen, item.key); // pen[item.key];
                 }
                 else {
                     if (typeof item.value === 'string' && item.value.includes('${')) {
@@ -666,6 +667,7 @@ export class Meta2d {
             else {
                 this.fitView(true, 10);
             }
+            document.title = data.name + "-" + window.name;
         }
     }
     doSendDataEvent(value, topics) {
@@ -1281,8 +1283,9 @@ export class Meta2d {
         const initJs = this.store.data.initJs;
         if (initJs && initJs.trim()) {
             try {
-                const fn = new Function('context', initJs);
+                let fn = new Function('context', initJs);
                 fn({ meta2d: this });
+                fn = null;
             }
             catch (e) {
                 console.warn('initJs error', e);
@@ -1617,10 +1620,12 @@ export class Meta2d {
             this.store.animateMap.delete(pen);
         });
         this.initImageCanvas(pens);
-        setTimeout(() => {
-            this.canvas?.calcActiveRect();
-            this.render();
-        }, 20);
+        if (this.store.data.locked === LockState.None) {
+            setTimeout(() => {
+                this.canvas?.calcActiveRect();
+                this.render();
+            }, 20);
+        }
     }
     startVideo(idOrTagOrPens) {
         let pens;
@@ -2506,6 +2511,20 @@ export class Meta2d {
                 });
             }
         }
+        // 稳定连接配置
+        if (!options.hasOwnProperty("keepalive")) {
+            Object.assign(options, { keepallive: 30 });
+        }
+        //  clean为false 时，clientId 是必填项 
+        if (options.clientId && !options.hasOwnProperty("clean")) {
+            Object.assign(options, { clean: false });
+        }
+        if (!options.hasOwnProperty("reconnectPeriod")) {
+            Object.assign(options, { reconnectPeriod: 0 });
+        }
+        if (!options.hasOwnProperty("connectTimeout")) {
+            Object.assign(options, { connectTimeout: 10 * 1000 });
+        }
         this.mqttClients[net.index] = mqtt.connect(url, options);
         this.mqttClients[net.index].on('message', (topic, message) => {
             this.socketCallback(message.toString(), {
@@ -2519,6 +2538,7 @@ export class Meta2d {
         this.mqttClients[net.index].on('error', (error) => {
             this.store.emitter.emit('error', { type: 'mqtt', error });
         });
+        let reconnectDelay = 1000;
         this.mqttClients[net.index].on('close', () => {
             if (this.store.options.reconnetTimes) {
                 net.times++;
@@ -2526,20 +2546,39 @@ export class Meta2d {
                     net.times = 0;
                     this.mqttClients && this.mqttClients[net.index]?.end();
                 }
+                setTimeout(() => {
+                    if (net.times < this.store.options.reconnetTimes) {
+                        this.mqttClients[net.index].reconnect(options);
+                        reconnectDelay = Math.min(reconnectDelay * 2, 10 * 1000);
+                    }
+                }, reconnectDelay);
             }
         });
-        if (net.topics) {
-            let topics = net.topics;
-            if (topics.indexOf('${') > -1) {
-                let keys = topics.match(/\$\{([^}]+)\}/g)?.map(m => m.slice(2, -1));
-                if (keys) {
-                    keys.forEach((key) => {
-                        topics = topics.replace(`\${${key}}`, this.getDynamicParam(key));
+        this.mqttClients[net.index].on('connect', (connack) => {
+            reconnectDelay = 1000;
+            if (!connack.sessionPresent) {
+                // 创建了新会话或没有找到旧会话，需要重新订阅主题
+                if (net.topics) {
+                    let topics = net.topics;
+                    if (topics.indexOf('${') > -1) {
+                        let keys = topics.match(/\$\{([^}]+)\}/g)?.map(m => m.slice(2, -1));
+                        if (keys) {
+                            keys.forEach((key) => {
+                                topics = topics.replace(`\${${key}}`, this.getDynamicParam(key));
+                            });
+                        }
+                    }
+                    // QoS=1 是 MQTT 中最常用的级别，它能在保证大部分消息可靠传递
+                    this.mqttClients[net.index].subscribe(topics.split(','), { qos: 1 }, (err) => {
+                        if (err)
+                            console.error("订阅失败：", err);
                     });
                 }
             }
-            this.mqttClients[net.index].subscribe(topics.split(','));
-        }
+            else {
+                //已恢复之前的会话，可以接收离线消息，不需要重新订阅，之前的订阅已恢复
+            }
+        });
     }
     connectNetWebSocket(net) {
         if (this.websockets[net.index]) {
@@ -3022,7 +3061,7 @@ export class Meta2d {
             if (res.ok) {
                 const data = await res.text();
                 const net = this.store.data.networks.filter(item => item.protocol === 'http')[req.index];
-                this.socketCallback(data, { type: 'http', url: req.url, name: req.name, net });
+                this.socketCallback(data, { type: 'http', method: req.method, url: req.url, name: req.name, net });
             }
             else {
                 _req.times++;
@@ -3102,6 +3141,7 @@ export class Meta2d {
                 topic: context.topic,
                 url: context.url,
                 method: context.method,
+                net: context.net
             });
             if (!_message) {
                 return;
@@ -3293,6 +3333,11 @@ export class Meta2d {
             initPens = deepClone(pens);
         }
         pens.forEach((pen) => {
+            if (pen.name === 'echarts' && !pen.onBeforeValue) {
+                const hasEchartsStartKey = Object.keys(data).some(key => echartReg.test(key));
+                if (hasEchartsStartKey)
+                    return;
+            }
             const afterData = pen.onBeforeValue
                 ? pen.onBeforeValue(pen, data)
                 : data;
@@ -4592,12 +4637,23 @@ export class Meta2d {
         const { offsetWidth: width, offsetHeight: height } = canvas;
         this.resize(width, height);
         const padding = formatPadding(viewPadding);
-        const rect = this.getRect();
+        let rect = null;
+        const w = this.store.data.width || this.store.options.width;
+        const h = this.store.data.height || this.store.options.height;
+        if (w && h) {
+            rect = {
+                width: w * this.store.data.scale,
+                height: h * this.store.data.scale,
+            };
+        }
+        else {
+            rect = this.getRect();
+        }
         const ratio = (width - padding[1] - padding[3]) / rect.width;
         this.scale(ratio * this.store.data.scale);
         this.topView(padding[0]);
         if (pageMode) {
-            this.canvas.scroll.changeMode();
+            this.canvas.scroll.changeMode(padding[0]);
         }
     }
     screenView(viewPadding = 10, WorH = true) {
@@ -4622,7 +4678,20 @@ export class Meta2d {
             return;
         const rect = this.getRect();
         const viewCenter = this.getViewCenter();
-        const pensRect = this.getPenRect(rect);
+        const w = this.store.data.width || this.store.options.width;
+        const h = this.store.data.height || this.store.options.height;
+        let pensRect = null;
+        if (w && h) {
+            pensRect = {
+                x: 0,
+                y: 0,
+                width: w,
+                height: h,
+            };
+        }
+        else {
+            pensRect = this.getPenRect(rect);
+        }
         calcCenter(pensRect);
         const { center } = pensRect;
         const { scale, origin, x: dataX, y: dataY } = this.store.data;