dcim-topology2d 2.1.0 → 2.2.0

package/core/src/middles/nodes/formDatePicker.js

@@ -1,11 +1,12 @@
-import {Store} from 'le5le-store';
+import {Store} from "le5le-store";
 import {rectangle} from './rectangle';
 import { createDatePickerElement, loadJS, setDataPickerElementStyle } from '../../element';
-import { s8 } from '../../utils';
+import { s8, datePickerValueFormatting } from '../../utils';
 import {commonStore} from "../../store";
+import {datePickerType} from "../../../../store";
 
 export async function fromDatePicker(ctx, node) {
-    // 绘制一个底图，类似于占位符。 
+    // 绘制一个底图，类似于占位符。
     rectangle(ctx, node);
 
     if (!window.datePickerRegister) {
@@ -21,12 +22,35 @@ export async function fromDatePicker(ctx, node) {
     if (!currentStore.pickerDataPool[node.id]) {
         // 未创建该元件
         node.elementId = s8();
+
+        if(currentStore.mqttParams.dataConfig.picker){
+            // 日期元件关联绑定的元件数据
+            const pickerConfig = currentStore.mqttParams.dataConfig.picker;
+            for (let [key, config] of pickerConfig.entries()){
+                if(config.dateId === node.id) {
+                    node.formData.realIds = node.formData.realIds ? `${node.formData.realIds},${key}` : key;
+                    node.formData.selected = config.dateStr;
+                }
+            }
+        }
+
+        const format = node.pickerOptions.format;
+        const valueType = node.formData.valueType;
+        const dateType = node.pickerOptions.type;
+        node.pickerOptions.value = node.formData.selected || datePickerValueFormatting({
+            formatType: format,
+            valueType
+        }).dateStr;
         const datePicker = createDatePickerElement(node);
         currentStore.pickerDataPool[node.id] = {
+            format,
+            valueType,
+            dateType,
             dom: {
                 container: datePicker
             }
-        }
+        };
+
         document.body.appendChild(datePicker);
         // 添加当前节点到div层
         node.addToDiv();
@@ -38,27 +62,44 @@ export async function fromDatePicker(ctx, node) {
             if(pickerOptions.min && isValidInteger(pickerOptions.min)) pickerOptions.min = Number(pickerOptions.min);
             if(pickerOptions.max && isValidInteger(pickerOptions.max)) pickerOptions.max = Number(pickerOptions.max);
         }
+        let layDatePicker = null;
         pickerOptions.elem = `#picker${node.id}`;
         pickerOptions.done = function (val, date) {
-            node.formData.selected = val
-            date.value = val;
+            const { year, month, hours, minutes, seconds } = date;
+            const map = {
+                yyyy: year,
+                MM: String(month).padStart(2, '0'),
+                dd: String(date.date).padStart(2, '0'),
+                HH: String(hours).padStart(2, '0'),
+                mm: String(minutes).padStart(2, '0'),
+                ss: String(seconds).padStart(2, '0')
+            };
+            node.formData.selected = val;
+            date.valueStr = val;
+            date.value = datePickerType[layDatePicker.config.type].replace(/yyyy|MM|dd|HH|mm|ss/g, match => map[match]);
             Store.set(`${node.TID}-EVENT:change`, {node, date});
         }
         setTimeout(() => {
 
-            laydate.render(pickerOptions);
+            layDatePicker = laydate.render(pickerOptions);
 
         }, 100)
     }else {
         if(node.formData.resetStyle) {
+            // 重置样式
             setDataPickerElementStyle(node);
             node.formData.resetStyle = false;
         }
-        // if(!node.formData.render) return;
-        // node.formData.render = false;
-        // const pickerOptions = Object.keys(node.pickerOptions).reduce((a,k) => (node.pickerOptions[k] && (a[k]=node.pickerOptions[k]), a), {}); // 过滤空数据
-        // Object.assign(node.formData.datePicker.config, pickerOptions);
-        //resetDatePicker(node);
+        if(node.formData.render) {
+            // 重置数据
+            node.formData.render = false;
+            const params = {
+                format: node.pickerOptions.format,
+                valueType: node.formData.valueType,
+                dateType: node.pickerOptions.type
+            };
+            Object.assign(currentStore.pickerDataPool[node.id], params);
+        }
     }
 }
 function isValidInteger(str) {

package/core/src/middles/nodes/formselect.js

@@ -15,8 +15,13 @@ export function formSelect(ctx, node) {
         const currentStore = commonStore[node.TID];
         node.elementId = s8();
         node.dash = 4;
+        // 下拉切换类型
+        const selectedType = node.events && node.events.find((item) => {
+            return !!item.dcimStaticForType
+        });
         currentStore.selectDataPool[node.id] = {
             slideState: node.selectDropdown,
+            staticType: selectedType,
             node: {
                 id: node.id,
                 color: node.font.color,
@@ -35,26 +40,30 @@ export function formSelect(ctx, node) {
             // 去空格重新赋值
             node.formData.bindBlockTag = node.formData.bindBlockTag.trim();
         }
+
         let selectRealData = bindBlockId && currentStore.selectRealDataPool[bindBlockId];
-        if(bindBlockId && selectRealData) {
-            // select与echarts互相关联
+        if(selectRealData) {
+            // 数据统计之 select与echarts互相关联
             if(node.formData.ids) {
+                // 显示隐藏类型下的数据统计，下拉节点数据处理
                 const optionIds = node.formData.ids.split(',');
                 for (let i = 0; i < optionIds.length; i++) {
                     if(selectRealData[i]) selectRealData[i].optionId = optionIds[i];
                 }
             }
-            currentStore.selectDataPool[node.id].data = selectRealData;
-            currentStore.selectDataPool[node.id].node.selected.id = selectRealData[0].id;
+            const selectData = currentStore.selectDataPool[node.id];
+            selectData.data = selectRealData;
+            selectData.node.selected ? selectData.node.selected.id = selectRealData[0].id : selectData.node.selected = { id: selectRealData[0].id };
             const echartsData = currentStore.echartsDataPool[bindBlockId];
             echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
                 bindId: node.id
             };
-            // select与Tab关联
+            // select与Tab关联，主要用于下拉切换时当前画面绑定了tab切换的情况
             const bindBlockTagData = currentStore.switchTabDataPool[`${node.formData.bindBlockTag}Data`];
             if(bindBlockTagData) currentStore.echartsDataPool[bindBlockId].tabCorrelationType = 'select';
         }else {
             if(node.formData.ids) {
+                // 下拉显示隐藏
                 const optionIds = node.formData.ids.split(',');
                 const optionNames = node.formData.names.split(',');
                 const optionsData = [];

package/core/src/middles/nodes/index.d.ts

@@ -47,4 +47,5 @@ export * from './triangle.anchor';
 export * from './triangle.rect';
 export * from './formoverflow';
 export * from './time';
-export * from './formDatePicker';
+export * from './formDatePicker';
+export * from './switchs';

package/core/src/middles/nodes/index.js

@@ -48,5 +48,6 @@ export * from './triangle.rect';
 export * from './formoverflow';
 export * from './time';
 export * from './formDatePicker';
+export * from './switchs';
 
 //# sourceMappingURL=index.js.map

package/core/src/middles/nodes/switchs.d.ts

@@ -0,0 +1,2 @@
+import { Node } from 'dcim-topology2d/core/src/models';
+export declare function switchs(ctx: CanvasRenderingContext2D, node: Node): void;

package/core/src/middles/nodes/switchs.js

@@ -0,0 +1,46 @@
+export function switchs(ctx, node) {
+
+    let x = node.rect.x;
+    let y = node.rect.y;
+    let width = node.rect.width;
+    let height = node.rect.height;
+    // 绘制圆角
+    var wr = node.borderRadius;
+    var hr = node.borderRadius;
+    if (node.borderRadius < 1) {
+        wr = node.rect.width * node.borderRadius;
+        hr = node.rect.height * node.borderRadius;
+    }
+    var r = wr < hr ? wr : hr;
+    if (node.rect.width < 2 * r) {
+        r = node.rect.width / 2;
+    }
+    if (node.rect.height < 2 * r) {
+        r = node.rect.height / 2;
+    }
+    //绘制椭圆
+    ctx.fillStyle = node.fillStyle;
+    ctx.beginPath();
+    ctx.moveTo(x + r, y);
+    ctx.lineTo(x + width - r, y);
+    ctx.quadraticCurveTo(x + width, y, x + width, y + r);
+    ctx.lineTo(x + width, y + height - r);
+    ctx.quadraticCurveTo(x + width, y + height, x + width - r, y + height);
+    ctx.lineTo(x + r, y + height);
+    ctx.quadraticCurveTo(x, y + height, x, y + height - r);
+    ctx.lineTo(x, y + r);
+    ctx.quadraticCurveTo(x, y, x + r, y);
+    ctx.lineTo(x + width - r, y);
+    ctx.closePath();
+    node.fillStyle && ctx.fill();
+    ctx.stroke();
+
+    //绘制左侧 小圆 默认在右侧 isOpen:true
+    ctx.beginPath();
+    let cx = node.isOpen ? x + width - height * 0.5 : x + height * 0.5;
+    ctx.ellipse(cx, y + height * 0.5, height / 2 * 0.8, height / 2 * 0.8, 0, 0, Math.PI * 2);
+    ctx.fillStyle = '#ffffff';
+    ctx.closePath();
+    ctx.fill();
+    ctx.stroke();
+}

package/core/src/models/line.js

@@ -417,19 +417,19 @@ var Line = /** @class */ (function (_super) {
         }
         Store.set(this.generateStoreKey('pts-') + this.id, null);
     };
-    Line.prototype.scale = function (scale, center) {
-        this.from.x = center.x - (center.x - this.from.x) * scale;
-        this.from.y = center.y - (center.y - this.from.y) * scale;
-        this.to.x = center.x - (center.x - this.to.x) * scale;
-        this.to.y = center.y - (center.y - this.to.y) * scale;
+    Line.prototype.scale = function (scale, center, w, h) {
+        this.from.x = center.x - (center.x - this.from.x) * w;
+        this.from.y = center.y - (center.y - this.from.y) * h;
+        this.to.x = center.x - (center.x - this.to.x) * w;
+        this.to.y = center.y - (center.y - this.to.y) * h;
         if (this.text && this.font && this.font.fontSize) {
             this.font.fontSize *= scale;
             this.textRect = null;
         }
         for (var _i = 0, _a = this.controlPoints; _i < _a.length; _i++) {
             var pt = _a[_i];
-            pt.x = center.x - (center.x - pt.x) * scale;
-            pt.y = center.y - (center.y - pt.y) * scale;
+            pt.x = center.x - (center.x - pt.x) * w;
+            pt.y = center.y - (center.y - pt.y) * h;
         }
         Store.set(this.generateStoreKey('pts-') + this.id, null);
     };

package/core/src/models/node.js

@@ -1,8 +1,8 @@
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
-                ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-                function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
@@ -35,6 +35,7 @@ var Node = /** @class */ (function (_super) {
         _this.rotatedAnchors = [];
         _this.animateDuration = 0;
         _this.animateFrames = [];
+        _this.attribute = json.attribute || 'default';
         _this.type = PenType.Node;
         _this.TID = json.TID;
         _this.selectDropdown = json.selectDropdown || false;
@@ -133,10 +134,10 @@ var Node = /** @class */ (function (_super) {
             _this.animateDuration = json.animateDuration;
         }
         _this.animateType = json.animateType
-                ? json.animateType
-                : json.animateDuration
-                        ? 'custom'
-                        : '';
+            ? json.animateType
+            : json.animateDuration
+                ? 'custom'
+                : '';
         _this.animateAlone = json.animateAlone;
         _this.iframe = json.iframe;
         _this.iframePageAuto = json.iframePageAuto || false;
@@ -146,17 +147,18 @@ var Node = /** @class */ (function (_super) {
         _this.play = json.play;
         _this.nextPlay = json.nextPlay;
         _this.time = json.time;
+        _this.isOpen = json.isOpen;
         if (json.elementLoaded !== undefined) {
             _this.elementId = null;
             _this.elementLoaded = false;
         }
-        if(this.name == 'arbitraryGraph') {
+        if (this.name == 'arbitraryGraph') {
             this.rect.circles = json.rect.circles;
             //let {x, y} = this.centroid(json.rect.circles);
-            let minX =  Math.min.apply(Math, json.rect.circles.map((item)=>{ return item.x}));
-            let minY = Math.min.apply(Math, json.rect.circles.map((item)=>{ return item.y}));
-            this.rect.x =  minX;
-            this.rect.y =  minY;
+            let minX = Math.min.apply(Math, json.rect.circles.map((item) => { return item.x }));
+            let minY = Math.min.apply(Math, json.rect.circles.map((item) => { return item.y }));
+            this.rect.x = minX;
+            this.rect.y = minY;
             this.rect.ex = this.rect.x + this.rect.width;
             this.rect.ey = this.rect.y + this.rect.height;
             // this.rect.center.x = x;
@@ -164,8 +166,8 @@ var Node = /** @class */ (function (_super) {
             // console.log('this.rect', this.rect);
             // console.log('this---node---', this);
         }
-        if(json.name === 'formTable') _this.setFormTableData(json);
-        if(json.name === 'tablePagination') _this.setTablePagination(json);
+        if (json.name === 'formTable') _this.setFormTableData(json);
+        if (json.name === 'tablePagination') _this.setTablePagination(json);
         _this.init();
         if (!noChild) {
             _this.setChild(json.children);
@@ -174,13 +176,13 @@ var Node = /** @class */ (function (_super) {
             _this.children = null;
         }
 
-        if(json.name === 'time') {
-            _this.animateFn = function() {
-                    let date = new Date();
-                    var hour = date.getHours() < 10 ?  "0" + date.getHours() : date.getHours();
-                    var minute = date.getMinutes() < 10 ?  "0" + date.getMinutes() : date.getMinutes();
-                    var second = date.getSeconds() < 10 ?  "0" + date.getSeconds() : date.getSeconds();
-                    _this.time = {h: hour, m:minute, s:second}
+        if (json.name === 'time') {
+            _this.animateFn = function () {
+                let date = new Date();
+                var hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
+                var minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
+                var second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
+                _this.time = { h: hour, m: minute, s: second }
             }
         }
 
@@ -212,7 +214,7 @@ var Node = /** @class */ (function (_super) {
         this.addToDiv();
     };
     Node.prototype.setFormTableData = function (json) {
-        if(!Store.get('FORM:tableData')){
+        if (!Store.get('FORM:tableData')) {
             Store.set('FORM:tableData', {
                 data: {
                     tableNodes: {},
@@ -227,18 +229,18 @@ var Node = /** @class */ (function (_super) {
             data: tableData
         })
         const fromData = Store.get('SYNC:tableData');
-        if(fromData) {
-            if(!fromData[json.id].loading){
+        if (fromData) {
+            if (!fromData[json.id].loading) {
                 this.formData.tableBody = fromData[json.id].tableBody;
                 this.formData.total = fromData[json.id].total;
-            }else {
+            } else {
                 this.formData.tableBody = null;
                 this.formData.total = 0;
             }
         }
     };
     Node.prototype.setTablePagination = function (json) {
-        if(!Store.get('FORM:tableData')){
+        if (!Store.get('FORM:tableData')) {
             Store.set('FORM:tableData', {
                 data: {
                     tableNodes: {},
@@ -250,7 +252,7 @@ var Node = /** @class */ (function (_super) {
         const tableData = Store.get('FORM:tableData').data;
         const fromData = Store.get('SYNC:tableData');
         const tnode = fromData ? fromData[json.paginationData.bindFromTableId] : null;
-        if(tnode) json.paginationData.total = tnode.total;
+        if (tnode) json.paginationData.total = tnode.total;
         tableData.paginationNodes[json.id] = json;
         Store.set('FORM:tableData', {
             data: tableData
@@ -258,8 +260,8 @@ var Node = /** @class */ (function (_super) {
     };
     Node.prototype.addToDiv = function () {
         if (this.iframe ||
-                this.elementId ||
-                this.hasGif()) {
+            this.elementId ||
+            this.hasGif()) {
             Store.set(this.generateStoreKey('LT:addDiv'), this);
         }
     };
@@ -335,13 +337,13 @@ var Node = /** @class */ (function (_super) {
                 this.drawBkRadialGradient(ctx);
                 break;
         }
-        if(this.name === 'tablePagination') defaultText(ctx, this);
+        if (this.name === 'tablePagination') defaultText(ctx, this);
         // Draw shape.
         drawNodeFns[this.name](ctx, this);
         // Draw text.
-        if(this.name === 'formTable') {
+        if (this.name === 'formTable') {
             tableText(ctx, this);
-        }else {
+        } else {
             if (this.name !== 'text' && this.text && !(this.image && this.floorImageIndex === true)) {
                 text(ctx, this);
             }
@@ -436,14 +438,14 @@ var Node = /** @class */ (function (_super) {
                 img: img,
                 cnt: 1,
             };
-            if(defaultImageNode) delete defaultImages[_this.id];
+            if (defaultImageNode) delete defaultImages[_this.id];
             Store.set(_this.generateStoreKey('LT:imageLoaded'), true);
             if (!_this.gif && gif) {
                 _this.gif = true;
                 Store.set(_this.generateStoreKey('LT:addDiv'), _this);
             }
         };
-        img.onerror = function(e){
+        img.onerror = function (e) {
             // 图片加载失败时预留默认图为空
             defaultImages[_this.id] = {
                 img: '',
@@ -451,7 +453,7 @@ var Node = /** @class */ (function (_super) {
             };
         };
     };
-    Node.prototype.initDrawImg = function (ctx){
+    Node.prototype.initDrawImg = function (ctx) {
         var _this = this;
         ctx.save();
         ctx.shadowColor = '';
@@ -509,7 +511,7 @@ var Node = /** @class */ (function (_super) {
                 y = rect.ey - h;
                 break;
         }
-        if(!_this.activeImgeIndex) ctx.drawImage(this.img, x, y, w, h);
+        if (!_this.activeImgeIndex) ctx.drawImage(this.img, x, y, w, h);
         ctx.restore();
     };
     Node.prototype.calcAnchors = function () {
@@ -554,21 +556,21 @@ var Node = /** @class */ (function (_super) {
         var parentW = parent.rect.width - parent.paddingLeftNum - parent.paddingRightNum;
         var parentH = parent.rect.height - parent.paddingTopNum - parent.paddingBottomNum;
         var x = parent.rect.x +
-                parent.paddingLeftNum +
-                abs(parentW, this.rectInParent.x) +
-                abs(parentW, this.rectInParent.marginLeft);
+            parent.paddingLeftNum +
+            abs(parentW, this.rectInParent.x) +
+            abs(parentW, this.rectInParent.marginLeft);
         var y = parent.rect.y +
-                parent.paddingTopNum +
-                abs(parentH, this.rectInParent.y) +
-                abs(parentW, this.rectInParent.marginTop);
+            parent.paddingTopNum +
+            abs(parentH, this.rectInParent.y) +
+            abs(parentW, this.rectInParent.marginTop);
         var w = abs(parentW, this.rectInParent.width);
         var h = abs(parentH, this.rectInParent.height);
         if (this.rectInParent.marginLeft === undefined &&
-                this.rectInParent.marginRight) {
+            this.rectInParent.marginRight) {
             x -= abs(parentW, this.rectInParent.marginRight);
         }
         if (this.rectInParent.marginTop === undefined &&
-                this.rectInParent.marginBottom) {
+            this.rectInParent.marginBottom) {
             y -= abs(parentW, this.rectInParent.marginBottom);
         }
         this.rect = new Rect(x, y, w, h);
@@ -599,15 +601,15 @@ var Node = /** @class */ (function (_super) {
         var parentH = parent.rect.height - parent.paddingTopNum - parent.paddingBottomNum;
         this.rectInParent = {
             x: ((this.rect.x - parent.rect.x - parent.paddingLeftNum) * 100) /
-                    parentW +
-                    '%',
+                parentW +
+                '%',
             y: ((this.rect.y - parent.rect.y - parent.paddingTopNum) * 100) / parentH +
-                    '%',
+                '%',
             width: (this.rect.width * 100) / parentW + '%',
             height: (this.rect.height * 100) / parentH + '%',
             rotate: this.rectInParent
-                    ? this.rectInParent.rotate || 0
-                    : this.rotate || 0,
+                ? this.rectInParent.rotate || 0
+                : this.rotate || 0,
             rect: this.rect.clone(),
         };
     };
@@ -628,7 +630,7 @@ var Node = /** @class */ (function (_super) {
         var timeline = now - this.animateStart;
         if (timeline > this.animateDuration) {
             if (++this.animateCycleIndex >= this.animateCycle &&
-                    this.animateCycle > 0) {
+                this.animateCycle > 0) {
                 this.animateStart = 0;
                 this.animateCycleIndex = 0;
                 var item = this.animateFrames[this.animateFrames.length - 1];
@@ -668,78 +670,78 @@ var Node = /** @class */ (function (_super) {
                 var rate = (timeline - item.start) / item.duration;
                 if (item.linear) {
                     // 线条左右流动动画
-                    if([animateType.LeftFlow, animateType.RightFlow].includes(this.animateType) && item.state.lineDashOffset){
+                    if ([animateType.LeftFlow, animateType.RightFlow].includes(this.animateType) && item.state.lineDashOffset) {
                         let o = item.state.lineDashOffset;
                         switch (this.animateType) {
                             case animateType.LeftFlow:
                                 o = Math.abs(o)
                                 if (o > 100) o = 1;
-                                o++ 
-                                
+                                o++
+
                                 break;
                             case animateType.RightFlow:
-                                o = Math.abs(o)*-1
+                                o = Math.abs(o) * -1
                                 if (o < -100) o = -1;
                                 o--
                                 break;
                         }
                         item.state.lineDashOffset = o
                         this.lineDashOffset = item.state.lineDashOffset;
-                    }else if(([animateType.Show, animateType.Rotate].includes(this.animateType) || this.name === 'electricFan') && item.state.rotate !== item.initState.rotate) {
+                    } else if (([animateType.Show, animateType.Rotate].includes(this.animateType) || this.name === 'electricFan') && item.state.rotate !== item.initState.rotate) {
                         // 旋转动画，判断逻辑先这么写，日后将所有动画统一在编辑器中配置，再做优化
                         this.rotate =
-                                item.initState.rotate +
-                                (item.state.rotate - item.initState.rotate) * rate;
+                            item.initState.rotate +
+                            (item.state.rotate - item.initState.rotate) * rate;
                         rectChanged = true;
-                    }else {
+                    } else {
 
                         if (item.state.rect.x !== item.initState.rect.x) {
                             this.rect.x =
-                                    item.initState.rect.x +
-                                    (item.state.rect.x - item.initState.rect.x) * rate;
+                                item.initState.rect.x +
+                                (item.state.rect.x - item.initState.rect.x) * rate;
                             rectChanged = true;
                         }
                         if (item.state.rect.y !== item.initState.rect.y) {
                             this.rect.y =
-                                    item.initState.rect.y +
-                                    (item.state.rect.y - item.initState.rect.y) * rate;
+                                item.initState.rect.y +
+                                (item.state.rect.y - item.initState.rect.y) * rate;
                             rectChanged = true;
                         }
                         if (item.state.rect.width !== item.initState.rect.width) {
                             this.rect.width =
-                                    item.initState.rect.width +
-                                    (item.state.rect.width - item.initState.rect.width) * rate;
+                                item.initState.rect.width +
+                                (item.state.rect.width - item.initState.rect.width) * rate;
                             rectChanged = true;
                         }
                         if (item.state.rect.height !== item.initState.rect.height) {
                             this.rect.height =
-                                    item.initState.rect.height +
-                                    (item.state.rect.height - item.initState.rect.height) * rate;
+                                item.initState.rect.height +
+                                (item.state.rect.height - item.initState.rect.height) * rate;
                             rectChanged = true;
                         }
                         this.rect.ex = this.rect.x + this.rect.width;
                         this.rect.ey = this.rect.y + this.rect.height;
                         this.rect.calcCenter();
                         if (item.initState.z !== undefined &&
-                                item.state.z !== item.initState.z) {
+                            item.state.z !== item.initState.z) {
                             this.z =
-                                    item.initState.z + (item.state.z - item.initState.z) * rate;
+                                item.initState.z + (item.state.z - item.initState.z) * rate;
                             rectChanged = true;
                         }
                         if (item.state.borderRadius !== item.initState.borderRadius) {
                             this.borderRadius =
-                                    item.initState.borderRadius +
-                                    (item.state.borderRadius - item.initState.borderRadius) * rate;
+                                item.initState.borderRadius +
+                                (item.state.borderRadius - item.initState.borderRadius) * rate;
                         }
                         if (item.state.lineWidth !== item.initState.lineWidth) {
                             this.lineWidth =
-                                    item.initState.lineWidth +
-                                    (item.state.lineWidth - item.initState.lineWidth) * rate;
+                                item.initState.lineWidth +
+                                (item.state.lineWidth - item.initState.lineWidth) * rate;
                         }
                         if (item.state.globalAlpha !== item.initState.globalAlpha) {
                             this.globalAlpha =
-                                    item.initState.globalAlpha +
-                                    (item.state.globalAlpha - item.initState.globalAlpha) * rate;
+                                item.initState.globalAlpha +
+                                (item.state.globalAlpha - item.initState.globalAlpha) * rate;
                         }
                     }
                 }
@@ -770,14 +772,14 @@ var Node = /** @class */ (function (_super) {
             h = scale;
         }
         this['oldRect'] = this.rect.clone();
-        if(this.rect.circles) {
-            for(let c=0, circles= this.rect.circles; c<circles.length; c++) {
+        if (this.rect.circles) {
+            for (let c = 0, circles = this.rect.circles; c < circles.length; c++) {
                 circles[c].x = center.x - (center.x - circles[c].x) * w;
                 circles[c].y = center.y - (center.y - circles[c].y) * h;
             }
         }
         this.rect.x = center.x - (center.x - this.rect.x) * w;
-        if(this.rotate % 180) {
+        if (this.rotate % 180) {
             this.rect.x = this.rect.x + (this.rect.width * w - this.rect.width * h) / 2;
         }
         this.rect.y = center.y - (center.y - this.rect.y) * h;
@@ -786,7 +788,7 @@ var Node = /** @class */ (function (_super) {
         this.rect.ex = this.rect.x + this.rect.width;
         this.rect.ey = this.rect.y + this.rect.height;
         this.z *= scale;
-        if(!(center.type && center.type === 'bottLogo')) {
+        if (!(center.type && center.type === 'bottLogo')) {
             if (this.imageWidth) {
                 this.imageWidth *= w;
             }
@@ -890,8 +892,8 @@ var Node = /** @class */ (function (_super) {
         }
     };
     Node.prototype.translate = function (x, y) {
-        if(this.rect.circles) {
-            for(let c=0, circles= this.rect.circles; c<circles.length; c++) {
+        if (this.rect.circles) {
+            for (let c = 0, circles = this.rect.circles; c < circles.length; c++) {
                 circles[c].x += x;
                 circles[c].y += y;
             }
@@ -948,7 +950,7 @@ var Node = /** @class */ (function (_super) {
         return n;
     };
     //新增属性
-    Node.prototype.area = function(pts) {
+    Node.prototype.area = function (pts) {
         var area = 0;
         var pts = pts;
         var nPts = pts.length;
@@ -964,7 +966,7 @@ var Node = /** @class */ (function (_super) {
         area /= 2;
         return area;
     };
-    Node.prototype.centroid = function(pts) {
+    Node.prototype.centroid = function (pts) {
         var pts = pts;
         var nPts = pts.length;
         var x = 0;