dcim-topology2d 2.0.5 → 2.0.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,12 +7,14 @@ import {
7
7
  setMap3dBarOptions,
8
8
  setMapTopOptions,
9
9
  setMapGlobalOptions,
10
- setMapDataOptions
10
+ setMapDataOptions,
11
+ initBindTabSetting
11
12
  } from '../utils';
12
13
  import {echartsTypeMap} from '../../../static';
13
14
 
14
15
  export function echarts(ctx, node) {
15
- if (!(commonStore[node.TID] && commonStore[node.TID].data.dataResize)) return;
16
+ const currentStore = commonStore[node.TID];
17
+ if (!(currentStore && currentStore.data.dataResize)) return;
16
18
  //console.log('echarts绘制-----node', node);
17
19
  // if(currentElement) currentElement.style.display = !node.visible ? 'none': 'block';
18
20
  // if(!node.visible) return;
@@ -32,7 +34,7 @@ export function echarts(ctx, node) {
32
34
  if (!node.elementId) {
33
35
  node.elementId = s8()
34
36
  }
35
- let echartsData = commonStore[node.TID].echartsDataPool[node.id];
37
+ let echartsData = currentStore.echartsDataPool[node.id];
36
38
  if (!node.elementLoaded && !(echartsData && echartsData.div)) {
37
39
  if(!echartsData) {
38
40
  echartsData = {
@@ -51,7 +53,7 @@ export function echarts(ctx, node) {
51
53
  setTimeout(function () {
52
54
  echartsData.chart.resize()
53
55
  });
54
- commonStore[node.TID].echartsDataPool[node.id] = echartsData;
56
+ currentStore.echartsDataPool[node.id] = echartsData;
55
57
  }
56
58
  if (!node.elementRendered) {
57
59
  const appearance = node.appearance;
@@ -59,8 +61,10 @@ export function echarts(ctx, node) {
59
61
  setTimeout(function () {
60
62
  let option = node.data.echarts.option;
61
63
  if(!(echartsData && echartsData.chart)) return;
62
- const isLocked = commonStore[node.TID] && commonStore[node.TID].data.locked;
63
- if (!isLocked || !commonStore[node.TID].echartsOptionsPool[node.id]) {
64
+ if(node.data.params) node.data.params.tabCorrelationType = echartsData.tabCorrelationType || ''; // 统计图与Tab关联
65
+ const isLocked = currentStore.data.locked;
66
+ if (!isLocked || !currentStore.echartsOptionsPool[node.id]) {
67
+ const tabData = initBindTabSetting(node); // 初始化Tabs数据配置
64
68
  // 【未锁定(编辑)状态, options未初始化的状态】
65
69
  if (!appearance.type) appearance.type = echartsTypeMap[`type_${option.displayMode}`]; // 兼容旧数据配置
66
70
  // 公共配置 Top排行榜跳过公共属性配置
@@ -77,18 +81,20 @@ export function echarts(ctx, node) {
77
81
  if (appearance.type === 'TOP') setMapTopOptions(option, node);
78
82
  //option.title = appearance.title;
79
83
  option.backgroundColor = appearance.backgroundColor;
80
- commonStore[node.TID].echartsOptionsPool[node.id] = {
84
+ currentStore.echartsOptionsPool[node.id] = {
81
85
  option: JSON.parse(JSON.stringify(option)),
82
86
  data: {
87
+ TID: node.TID,
83
88
  appearance,
84
89
  id: node.id,
85
- params: node.data.params
90
+ params: node.data.params,
91
+ tabData
86
92
  }
87
93
  };
88
94
  if (!isLocked) echartsData.chart.clear();
89
95
  }
90
96
  // echarts 数据渲染更新
91
- setMapDataOptions(option, node);
97
+ setMapDataOptions(option, currentStore.echartsOptionsPool[node.id].data);
92
98
 
93
99
  node.elementRendered = true;
94
100
  })
@@ -82,7 +82,11 @@ export function setChartXAxisData(xAxis, appearance) {
82
82
  //return xAxis;
83
83
  }
84
84
 
85
- // 图表Y轴数据
85
+ /**
86
+ * 图表Y轴数据
87
+ * @param yAxis Y轴配置数据
88
+ * @param appearance 图表自定义配置
89
+ */
86
90
  export function setChartYAxisData(yAxis, appearance) {
87
91
  if (typeof appearance.ySplitLineShow !== 'boolean') {
88
92
  appearance.ySplitLineShow = yAxis[0].splitLine.show;
@@ -6,6 +6,7 @@ interface echartsOptions {
6
6
  tooltip: null
7
7
  }
8
8
  export declare function getXYAxisLabelVal(index: number, intervalNum: number, value: any): string;
9
+ export declare function initBindTabSetting(node: any): string;
9
10
  export declare function setMapLineBarOptions(option: echartsOptions, node: any): void;
10
11
  export declare function setMapGaugeOptions(option: echartsOptions, node: any): void;
11
12
  export declare function setMapRingOptions(option: echartsOptions, node: any): void;
@@ -17,7 +17,7 @@ import {
17
17
  pieRingNormalAuto,
18
18
  topRankingListAuto
19
19
  } from './render';
20
- import {commonStore} from "../../../core";
20
+ import {commonStore, echartsStaticType} from "../../../core";
21
21
 
22
22
  export function getXYAxisLabelVal(index, intervalNum, value) {
23
23
  if (index === 0 || index % intervalNum === 0) {
@@ -27,6 +27,26 @@ export function getXYAxisLabelVal(index, intervalNum, value) {
27
27
  }
28
28
  }
29
29
 
30
+ /**
31
+ * 初始化图表与tabs关联的配置数据
32
+ * @param node 元件节点
33
+ */
34
+ export function initBindTabSetting(node) {
35
+ const tabStaticKey = node.tags && node.tags.find((tag) => {return tag.includes('switchTabType')});
36
+ const switchTabData = tabStaticKey && commonStore[node.TID].switchTabDataPool[`${tabStaticKey}Data`];
37
+ if(switchTabData) {
38
+ const tabNode = Object.values(switchTabData)[0];
39
+ const tabEventNode = tabNode.events.find((ev) => {return ev.action === 8});
40
+ const tabStaticType = tabEventNode && tabEventNode.dcimStaticForType || '';
41
+ node.data.params.staticForType = tabStaticType;
42
+ return {
43
+ type: tabStaticType,
44
+ data: tabNode.tabData
45
+ };
46
+ }
47
+ return null;
48
+ }
49
+
30
50
  // 自动滑动展示数据
31
51
  export function setMapAutoMoveOptions(option, chartNode, node, callback) {
32
52
  option.dataZoom = echartsDataRoom;
@@ -181,7 +201,11 @@ export function setMapTopOptions(option, node) {
181
201
  Object.assign(option.grid, appearance.grid);
182
202
  }
183
203
 
184
- // 公共配置
204
+ /**
205
+ * 公共配置
206
+ * @param option 图表配置数据
207
+ * @param node 元件数据
208
+ */
185
209
  export function setMapGlobalOptions(option, node) {
186
210
  // const chartOption = JSON.parse(JSON.stringify(option));
187
211
  const appearance = node.appearance;
@@ -205,18 +229,31 @@ export function setMapGlobalOptions(option, node) {
205
229
  export function setMapDataOptions(option, node) {
206
230
  const optionNode = commonStore[node.TID].echartsOptionsPool[node.id].option;
207
231
  const appearance = node.appearance;
208
- const params = node.data ? node.data.params : node.params;
232
+ const params = node.params;
209
233
  // 3d 柱状图
210
234
  if (appearance.type === '3dBar') renderMap3dBarSeriesItem(optionNode.series[0], appearance);
211
235
  const displayMode = parseInt(option.displayMode); // 图表类型
212
- const staticForType = params && params.staticForType || ''; //统计类型:日,周,月,年,实时
236
+ const staticForType = params && params.staticForType || ''; //统计类型:日,周,月,年,实时,其他
213
237
  const syncEchartsData = commonStore[node.TID].echartsRealDataPool[node.id]; // 统计图实时数据
214
- const staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData; // 统计类型数据
238
+ let staticTypeData = null; // 统计类型数据
239
+ if(staticForType === 'OTHER'){
240
+ // 其他类型,类型中的数据通常统计的都是历史数据,日、周、月、年、实时中的某一类,通常搭配分组统计使用。
241
+ // 类型中绑定一个测点为一个类型,绑定多个测点为多个类型。比如:有电功率和功率因数为两个分类,图表分组中分类数据绑定时就要同时绑定有电功率和功率因数两个测点,否则无法实现切换
242
+ for (let i = 0 ; i < echartsStaticType.length; i++) {
243
+ const chartData = syncEchartsData && syncEchartsData[`${echartsStaticType[i]}_Data`];
244
+ if(chartData) staticTypeData = chartData;
245
+ }
246
+ }else {
247
+ // 日,周,月,年,实时类型,不与分组统计一起使用
248
+ staticTypeData = staticForType ? syncEchartsData && syncEchartsData[`${staticForType}_Data`] : syncEchartsData;
249
+ }
215
250
  // 实时数据加载
216
251
  if(staticTypeData) {
217
252
 
218
253
  if (displayMode === 1 || displayMode === 2) { // 折线图,柱状图
219
254
 
255
+ if(node.tabData && node.tabData.data.state && optionNode.yAxis[0].max) Object.assign(optionNode.yAxis[0], node.tabData.data); //若Tabs切换配置了数据,则修改Y轴原有配置
256
+
220
257
  lineBarDataAuto(optionNode, params, staticTypeData);
221
258
 
222
259
  }
@@ -10,6 +10,13 @@ export function lineBarDataAuto(option, params, data) {
10
10
  const seriesNodes = option.series;
11
11
  if(data && data.XData) option.xAxis[0].data = data.XData;
12
12
  if(!(data && data.seriesData && data.seriesData.length)) return;
13
+ if(params.tabCorrelationType) {
14
+ // 如果操作类型是select下拉分组下的tab切换,执行下面的逻辑
15
+ const realSeriesNode = data.seriesData[params.tabVisitOrder || 0];
16
+ seriesNodes[0].data = realSeriesNode.data;
17
+ if(realSeriesNode.name) seriesNodes[0].name = realSeriesNode.name;
18
+ return;
19
+ }
13
20
  if(seriesNodes.length > 1 || params && params.curveNum > 1){
14
21
  // 双曲线|柱状
15
22
  const legendData = [];
@@ -13,6 +13,9 @@ import {
13
13
  setConnectionTagForConf,
14
14
  setInitConfData,
15
15
  getParams,
16
+ tabHideShowOperation,
17
+ tabStaticOperation,
18
+ echartsStaticType
16
19
  } from './utils';
17
20
  import {useStore, clearStore, commonStore} from './store'
18
21
  import * as mqtt from './mqtt.min';
@@ -233,7 +236,7 @@ var Common = /** @class */ (function () {
233
236
  })
234
237
  }
235
238
  if (node.children && node.children.length) {
236
- renderForAssetPoperties(asset, node.children);
239
+ this.renderForAssetPoperties(asset, node.children);
237
240
  }
238
241
  });
239
242
  };
@@ -475,29 +478,24 @@ var Common = /** @class */ (function () {
475
478
  if(!changeNode[node.id]) return;
476
479
  // 如果存在按钮组节点数据
477
480
  const tabAreaData = topologyChangeData[`${switchTabData}AreaData`];
481
+ let tabIndex = 0;
482
+ const visitParams = {
483
+ order: 0
484
+ };
478
485
  for (let switchNode of Object.values(changeNode)) {
479
486
  const penNode = this.store.data.pens[switchNode.order];
480
487
  if(!penNode) return;
481
- penNode.activeImgeIndex = switchNode.id !== node.id;
482
- if(staticType === 'SH'){
483
- // 对显示隐藏的功能进行交互处理
484
- const areaNode = tabAreaData[switchNode.bindStaticId];
485
- if(areaNode && this.store.data.pens[areaNode.order]) {
486
- const tagNode = this.store.data.pens[areaNode.order];
487
- tagNode.visible = !(switchNode.id !== node.id);
488
- setElementSwitchTabState(tagNode);
489
- }
488
+ const isActive = switchNode.id !== node.id;
489
+ if(!isActive) {
490
+ visitParams.order = tabIndex;
491
+ visitParams.data = switchNode.tabData;
490
492
  }
493
+ penNode.activeImgeIndex = isActive;
494
+ tabIndex++;
495
+ if(staticType === 'SH') tabHideShowOperation(switchNode, tabAreaData); // 对显示隐藏的功能进行交互处理
491
496
  }
492
497
  // 对绑定的图表进行数据处理
493
- if (node.bindStaticId && ['DAY', 'WEEK', 'MONTH', 'YEAR'].includes(staticType)) {
494
- const findCurentEchart = tabAreaData[node.bindStaticId]; // 获取当前点中的节点绑定的统计图表数据
495
- if (findCurentEchart && findCurentEchart.data.params) {
496
- const cn = this.store.data.pens[findCurentEchart.order];
497
- cn.data.params['staticForType'] = staticType; // 统计类型赋值
498
- cn.elementRendered = false;
499
- }
500
- }
498
+ tabStaticOperation(staticType, node, tabAreaData, visitParams);
501
499
  this.store.data.dataResize = 1;
502
500
  this.render();
503
501
  };
@@ -763,6 +761,9 @@ var Common = /** @class */ (function () {
763
761
  if (item.children && item.children.length) {
764
762
  this.mqttDataDrawing(item.children, retData);
765
763
  }
764
+ if (item.formData && item.formData.detailPageData && item.formData.detailPageData.pens && item.formData.detailPageData.pens.length) {
765
+ this.mqttDataDrawing(item.formData.detailPageData.pens, retData);
766
+ }
766
767
  });
767
768
  //console.log('执行完毕-----', this.store.data.pens)
768
769
  this.render();
@@ -826,6 +827,28 @@ var Common = /** @class */ (function () {
826
827
  }
827
828
  }
828
829
  };
830
+ Common.prototype.formOverflowConversionData = function (obj) {
831
+ if (!obj) {
832
+ obj = {pens: []};
833
+ }
834
+ let data = JSON.parse(JSON.stringify(obj));
835
+ Object.assign(this.store.data, data);
836
+ this.store.data.pens = [];
837
+ this.openCount = 0
838
+ const type = this.store.options.type;
839
+ if (data.pens) {
840
+ for (var _d = 0, _e = data.pens; _d < _e.length; _d++) {
841
+ const item = _e[_d];
842
+ if (!item.from) {
843
+ const node = new Node(item);
844
+ this.store.data.pens.push(node);
845
+ } else {
846
+ const linNode = new Line(item);
847
+ this.store.data.pens.push(linNode);
848
+ }
849
+ }
850
+ }
851
+ };
829
852
  Common.prototype.destroyStatic = function () {
830
853
  this.clear('destroy');
831
854
  //this.closeSocket();
package/core/src/core.js CHANGED
@@ -2340,6 +2340,31 @@ var Topology = (function (_super) {
2340
2340
 
2341
2341
  return true
2342
2342
  };
2343
+ Topology.prototype.formOverflowOpen = function (data) {
2344
+ this.formOverflowConversionData(data);
2345
+ this.overflowView();
2346
+ this.render(true);
2347
+ }
2348
+ Topology.prototype.overflowView = function (data) {
2349
+ try {
2350
+ var rect = this.getRect();
2351
+ let _a = this.canvas;
2352
+ if(!_a.width) return;
2353
+ let width = _a.width, height = _a.height;
2354
+ let rectWidth = rect.width? (rect.ex + 4) : rect.width
2355
+ let rectHeight= rect.height? (rect.ey + 4) : rect.height
2356
+ if (width < rectWidth) {
2357
+ width = rectWidth;
2358
+ }
2359
+ if (height < rectHeight) {
2360
+ height = rectHeight;
2361
+ }
2362
+ this.resize({width: width, height: height});
2363
+ return rect;
2364
+ }catch (e){
2365
+ console.log('-error--------overflowView---',e)
2366
+ }
2367
+ }
2343
2368
  return Topology;
2344
2369
  }(Common));
2345
2370
 
@@ -76,7 +76,7 @@ var DivLayer = /** @class */ (function (_super) {
76
76
  return _this;
77
77
  }
78
78
  DivLayer.prototype.addElement = function (node){
79
- if(['iframe', 'echarts'].includes(node.name)) {
79
+ if(['iframe', 'echarts', 'formOverflow'].includes(node.name)) {
80
80
  this.canvas.parentNode.appendChild(this.elements[node.id]);
81
81
  }else {
82
82
  this.canvas.appendChild(this.elements[node.id]);
@@ -196,7 +196,9 @@ export function getSelectedData(e, data, editData) {
196
196
  if(!optionNode) return;
197
197
  // 切换数据
198
198
  currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[node.id];
199
+ const isInitTable = initTabSwitchPage(data.formData.bindBlockTag, optionNode.data, currentStore);
199
200
  setMapDataOptions(optionNode.option, optionNode.data);
201
+ if(isInitTable) Store.set(`${data.TID}-LT:render`, true);
200
202
  }
201
203
  if(staticType === selectStaticType.dataShow) {
202
204
  // 数据展示
@@ -215,6 +217,32 @@ export function getSelectedData(e, data, editData) {
215
217
  Store.set(`${data.TID}-LT:render`, true);
216
218
  }
217
219
  }
220
+ // 初始化Tab页签选中状态
221
+ function initTabSwitchPage(bindBlockTag, data, currentStore) {
222
+ if(!bindBlockTag) return false;
223
+ // 初始化分类选中状态
224
+ const tabData = currentStore.switchTabDataPool[`${bindBlockTag}Data`]; // 获取Tab组数据
225
+ if(!tabData) return false;
226
+ const tabKeys = Object.keys(tabData);
227
+ const pens = currentStore.data.pens;
228
+ if(!tabKeys.length || !pens[tabData[tabKeys[0]].order].activeImgeIndex) return false; //Tab默认选中第一个页签就退出程序,不执行初始化状态
229
+ let tabInit = false;
230
+ for (let tabNode of Object.values(tabData)) {
231
+ const penNode = pens[tabNode.order];
232
+ if(!tabInit) {
233
+ data.params.tabVisitOrder = 0;
234
+ data.tabData = {
235
+ type: '',
236
+ data: tabNode.tabData
237
+ };
238
+ }
239
+ if(penNode) {
240
+ penNode.activeImgeIndex = tabInit;
241
+ tabInit = true;
242
+ }
243
+ }
244
+ return true;
245
+ }
218
246
  // 配置下拉展示的主题风格
219
247
  export function setSelectElementTheme(node) {
220
248
  const themeType = node.formData.theme ? ` theme${node.formData.theme}` : '';
@@ -9,7 +9,11 @@ export function setElementSwitchTabState(node) {
9
9
  if(!commonStore[node.TID].elementInteractivePoor.elementDataLength) return;
10
10
  const ele = commonStore[node.TID].echartsDataPool[node.id] && commonStore[node.TID].echartsDataPool[node.id].div ||
11
11
  commonStore[node.TID].selectDataPool[node.id] && commonStore[node.TID].selectDataPool[node.id].dom.selectEle;
12
- if(ele) ele.style.display = !node.visible ? 'none': 'block';
12
+ if(ele) {
13
+ ele.style.display = !node.visible ? 'none': 'block';
14
+ }else {
15
+ commonStore[node.TID].data.dataResize = 1;
16
+ }
13
17
  if(node.children && node.children.length) {
14
18
  node.children.map((ch) => {
15
19
  ch.visible = node.visible;
@@ -0,0 +1,61 @@
1
+ // import {} from './rectangle';
2
+ import {rectangle, createDiv, s8, Topology} from '../../../../core';
3
+ import {commonStore} from "../../store";
4
+
5
+ export async function formOverflow(ctx, node) {
6
+ // 绘制一个底图,类似于占位符。
7
+ rectangle(ctx, node)
8
+ console.log('绘制滚动组件--')
9
+ // 添加当前节点到div层
10
+ if (!node.elementId) {
11
+ node.elementId = s8()
12
+ }
13
+ let formoverData = commonStore[node.TID].formoverDataPool[node.id];
14
+ let id = node.formData.detailPageId
15
+ const color = node.formData.scrollbarColor? node.formData.scrollbarColor: 'auto'
16
+ const colorBg = node.formData.scrollbarColorBg? node.formData.scrollbarColorBg: 'auto'
17
+ const scrollbarColor = color + ' ' + colorBg
18
+
19
+ if (!node.elementLoaded && !formoverData) {
20
+ console.log('是否存在--formoverData--0-',formoverData)
21
+ if(!formoverData) {
22
+ formoverData = {
23
+ div: createDiv(node)
24
+ };
25
+ }else {
26
+ formoverData.div = createDiv(node);
27
+ }
28
+ formoverData.div.setAttribute('class', 'topoOverflow');
29
+ formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
30
+ formoverData.div.style.setProperty('scrollbar-width', 'thin');
31
+
32
+ node.elementLoaded = true
33
+ document.body.appendChild(formoverData.div)
34
+ // 添加当前节点到div层
35
+ node.addToDiv()
36
+ commonStore[node.TID].formoverDataPool[node.id] = formoverData;
37
+
38
+
39
+ console.log('请求子页面接口-----id =',id)
40
+ let canvas = new Topology(node.id, {
41
+ rotateCursor: '/img/rotate.cur',
42
+ })
43
+ canvas.formOverflowOpen(node.formData.detailPageData)
44
+ commonStore[node.TID].formoverCanvasDataPool[node.id] = canvas
45
+ }else if(formoverData && id){
46
+ console.log('是否存在--formoverData--1-',formoverData)
47
+ formoverData.div.style.setProperty('scrollbar-color', scrollbarColor);
48
+ formOverflowChange(node)
49
+ }
50
+ }
51
+
52
+ // 更新滚动组件中子页面
53
+ export function formOverflowChange(node) {
54
+ //绘制画布
55
+ console.log('更新滚动组件中子页面-',node)
56
+ let canvas = commonStore[node.TID].formoverCanvasDataPool[node.id]
57
+ let data = node.formData.detailPageData
58
+ console.log('改变滚动组件中子页面-',data)
59
+ canvas.formOverflowOpen(data)
60
+ }
61
+
@@ -25,19 +25,27 @@ export function formSelect(ctx, node) {
25
25
  },
26
26
  dom: {}
27
27
  };
28
- const bindBlockId = node.formData && node.formData.bindBlockId;
28
+ let bindBlockId = '';
29
+ if(node.formData.bindBlockId) {
30
+ // 去空格重新赋值
31
+ bindBlockId = node.formData.bindBlockId.trim();
32
+ node.formData.bindBlockId = bindBlockId;
33
+ }
34
+ if(node.formData.bindBlockTag) {
35
+ // 去空格重新赋值
36
+ node.formData.bindBlockTag = node.formData.bindBlockTag.trim();
37
+ }
29
38
  let selectRealData = bindBlockId && currentStore.selectRealDataPool[bindBlockId];
30
39
  if(bindBlockId && selectRealData) {
31
40
  // select与echarts互相关联
32
41
  currentStore.selectDataPool[node.id].data = selectRealData;
33
42
  const echartsData = currentStore.echartsDataPool[bindBlockId];
34
- if(echartsData){
35
- echartsData.bindId = node.id;
36
- }else {
37
- currentStore.echartsDataPool[bindBlockId] = {
38
- bindId: node.id
39
- }
40
- }
43
+ echartsData ? echartsData.bindId = node.id : currentStore.echartsDataPool[bindBlockId] = {
44
+ bindId: node.id
45
+ };
46
+ // select与Tab关联
47
+ const bindBlockTagData = currentStore.switchTabDataPool[`${node.formData.bindBlockTag}Data`];
48
+ if(bindBlockTagData) currentStore.echartsDataPool[bindBlockId].tabCorrelationType = 'select';
41
49
  }else {
42
50
  if(node.formData.ids) {
43
51
  const optionIds = node.formData.ids.split(',');
@@ -44,4 +44,5 @@ export * from './tablePagination';
44
44
  export * from './text';
45
45
  export * from './triangle';
46
46
  export * from './triangle.anchor';
47
- export * from './triangle.rect';
47
+ export * from './triangle.rect';
48
+ export * from './formoverflow';
@@ -45,4 +45,5 @@ export * from './text';
45
45
  export * from './triangle';
46
46
  export * from './triangle.anchor';
47
47
  export * from './triangle.rect';
48
+ export * from './formoverflow';
48
49
  //# sourceMappingURL=index.js.map
@@ -48,6 +48,13 @@ var Node = /** @class */ (function (_super) {
48
48
  _this.iconSize = +json.iconSize;
49
49
  _this.iconColor = json.iconColor;
50
50
  _this.image = json.image;
51
+ _this.tabData = json.tabData || {
52
+ state: false,
53
+ name: '℃',
54
+ min: 0,
55
+ max: 60,
56
+ interval: 20
57
+ };
51
58
  _this.floorImageIndex = json.floorImageIndex || false;
52
59
  _this.formData = json.formData || null;
53
60
  _this.formStyle = json.formStyle || null;
@@ -45,7 +45,7 @@ export interface Options {
45
45
  alwaysAnchor?: boolean;
46
46
  disableEmptyLine?: boolean;
47
47
  disableRepeatLine?: boolean;
48
- disableScale?: boolean;
48
+ disableScale?: boolean; // 禁止缩放
49
49
  disableMoveOutParent?: boolean;
50
50
  disableDockLine?: boolean;
51
51
  playIcon?: string;
@@ -63,6 +63,8 @@ export interface visualization2DStore {
63
63
  selectRealDataPool: {}; // form select
64
64
  selectTabDataPool: {}; // form select
65
65
  iframeDataPool: {}; // iframe
66
+ formoverDataPool: {}; // 滚动组件 Dom节点数据
67
+ formoverCanvasDataPool: {}; // 滚动组件 画布节点数据
66
68
  emitter: Emitter;
67
69
  dpiRatio?: number;
68
70
  lastScale?: number; //记录上次模版的scale
@@ -113,6 +115,8 @@ export const createStore = () => {
113
115
  selectRealDataPool: {}, // form select
114
116
  selectTabDataPool: {}, // form select
115
117
  iframeDataPool: {}, // iframe
118
+ formoverDataPool: {}, // 滚动组件 Dom节点数据
119
+ formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
116
120
  emitter: mitt(),
117
121
  cacheDatas: [],
118
122
  dpiRatio: 1,
@@ -59,6 +59,8 @@ export var createStore = function () {
59
59
  selectRealDataPool: {}, // form select
60
60
  selectTabDataPool: {}, // form select
61
61
  iframeDataPool: {}, // iframe
62
+ formoverDataPool: {}, // 滚动组件 Dom节点数据
63
+ formoverCanvasDataPool: {}, // 滚动组件 画布节点数据
62
64
  emitter: mitt(),
63
65
  cacheDatas: [],
64
66
  dpiRatio: 1,
@@ -76,7 +78,7 @@ export var useStore = function (id) {
76
78
  return commonStore[id];
77
79
  };
78
80
  export function clearElementDataPool(data) {
79
- const { echartsDataPool, selectDataPool, iframeDataPool} = data;
81
+ const { echartsDataPool, selectDataPool, iframeDataPool, formoverDataPool, formoverCanvasDataPool} = data;
80
82
  for (let [key, node] of Object.entries(echartsDataPool)) {
81
83
  if(node) {
82
84
  clearInterval(node.timeTicket);
@@ -107,6 +109,16 @@ export function clearElementDataPool(data) {
107
109
  node.iframe.parentNode.removeChild(node.iframe);
108
110
  delete data.iframeDataPool[key];
109
111
  }
112
+ for (let key of Object.keys(formoverDataPool)) {
113
+ delete formoverDataPool[key];
114
+ }
115
+ for (let key of Object.keys(formoverCanvasDataPool)) {
116
+ const elementNode = document.getElementById(key);
117
+ if(elementNode) {
118
+ elementNode.parentNode.removeChild(elementNode);
119
+ }
120
+ delete formoverCanvasDataPool[key];
121
+ }
110
122
  }
111
123
  export var clearStore = function (store, del) {
112
124
  store.lastScale = store.data.scale;
@@ -154,6 +166,8 @@ export var clearStore = function (store, del) {
154
166
  echartsDataPool: store.echartsDataPool,
155
167
  selectDataPool: store.selectDataPool,
156
168
  iframeDataPool: store.iframeDataPool,
169
+ formoverDataPool: store.formoverDataPool,
170
+ formoverCanvasDataPool: store.formoverCanvasDataPool,
157
171
  });
158
172
  if(del) {
159
173
  delete commonStore[store.id];
@@ -105,7 +105,7 @@ export function setDefaultNodeValidat(node, retData) {
105
105
  * 全局报警标记,代表正在访问的这个topology文件中是否有告警发生
106
106
  * 需要注意:自定义函数中要通过 return {monitorAlarm: boolean}的格式将元件告警状态返回
107
107
  */
108
- if(funcData && funcData.monitorAlarm) commonStore[node.TID].monitorAlarm = true;
108
+ if(funcData && funcData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
109
109
  }catch (e) {
110
110
  console.log(`自定义函数出错>>>`,);
111
111
  console.log(`目标元件:${node.id}>>>`,);
@@ -114,7 +114,7 @@ export function setDefaultNodeValidat(node, retData) {
114
114
  } else {
115
115
  // console.log('默认函数')
116
116
  const newData = setConfItemNode(node, retData);
117
- if(newData && newData.monitorAlarm) commonStore[node.TID].monitorAlarm = true;
117
+ if(newData && newData.monitorAlarm && commonStore[node.TID]) commonStore[node.TID].monitorAlarm = true;
118
118
  }
119
119
  if (node.animateFrames && node.animateFrames.length) {
120
120
  for (var _a = 0, _af = node.animateFrames; _a < _af.length; _a++) {
@@ -1,4 +1,6 @@
1
1
  // @ts-ignore
2
+ export declare const echartsStaticType: Array<string> = [];
3
+ // @ts-ignore
2
4
  export declare const winEventActionFns: Array<string> = [];
3
5
  export interface MoveDataType {
4
6
  None?: string | number;
@@ -1,3 +1,4 @@
1
+ export const echartsStaticType = ['DAY', 'WEEK', 'MONTH', 'YEAR', 'REALTIME'];
1
2
  export const winEventActionFns = ['Link', 'DoAnimate', 'DoFn', 'DoWindowFn', 'openImg'];
2
3
  export const moveDataType = {
3
4
  None: 0,
@@ -1,5 +1,6 @@
1
1
  import {Node} from "../models";
2
-
2
+ export declare function tabStaticOperation(type: string, node: Node, areaData: any, params: object): void;
3
+ export declare function tabHideShowOperation(node: any, areaData: any): void;
3
4
  export declare function getEchartsRealData(node: {}, data: []): void;
4
5
  export declare function setInitConfData(id: string, data: object): void;
5
6
  export declare function setTagIdData(data: any): [];
@@ -1,4 +1,56 @@
1
1
  import {commonStore} from '../store';
2
+ import {setElementSwitchTabState} from '../element';
3
+ import {echartsStaticType} from '../utils';
4
+
5
+ /**
6
+ * Tab 数据统计
7
+ * @param type 统计类型
8
+ * @param node 元件数据
9
+ * @param areaData tab展示区域数据
10
+ * @param params Tab 切换选中参数
11
+ */
12
+ export function tabStaticOperation(type, node, areaData, params) {
13
+ if(!node.bindStaticId || !(echartsStaticType.includes(type) || type === 'OTHER')) return;
14
+ const curentEchart = areaData && areaData[node.bindStaticId]; // 获取当前点中的节点绑定的统计图表数据
15
+ if(!curentEchart || !curentEchart.data.params) return console.log('未能找到匹配的echarts图表>>>');
16
+ const currentStore = commonStore[node.TID];
17
+ const echartNode = currentStore.data.pens[curentEchart.order]; // 获取tab 绑定的图表元件数据
18
+ if(type === 'OTHER') {
19
+ const tabCorrelationType = currentStore.echartsDataPool[node.bindStaticId].tabCorrelationType; // 获取select与tab关联的标识
20
+ const optionNode = currentStore.echartsOptionsPool[node.bindStaticId];
21
+ if(tabCorrelationType === 'select') {
22
+ // tab类型为包含在select下的切换则执行下面的逻辑
23
+ echartNode.data.params['tabVisitOrder'] = params.order;
24
+ }else {
25
+ // 非 年、月、日、周、实时类型的切换
26
+ const groupData = currentStore.selectRealDataPool[node.bindStaticId];
27
+ if (optionNode) currentStore.echartsRealDataPool[optionNode.data.id] = currentStore.echartsRealDataPool[groupData[params.order].id];
28
+ }
29
+ if(optionNode) optionNode.data.tabData = {
30
+ type,
31
+ data: params.data
32
+ };
33
+ }
34
+ echartNode.data.params['staticForType'] = type
35
+ echartNode.elementRendered = false;
36
+ }
37
+ /**
38
+ * Tab 显示/隐藏切换
39
+ * @param node tab页签数据
40
+ * @param areaData // tab展示区域数据
41
+ */
42
+ export function tabHideShowOperation(node, areaData) {
43
+ const confIds = node.bindStaticId && node.bindStaticId.split(',') || [];
44
+ const pens = commonStore[node.TID].data.pens;
45
+ for (let i = 0; i < confIds.length; i++) {
46
+ const confid = confIds[i];
47
+ const areaNode = areaData[confid];
48
+ if(!(areaNode && pens[areaNode.order])) return;
49
+ const tagNode = pens[areaNode.order];
50
+ tagNode.visible = !(node.id !== node.id);
51
+ setElementSwitchTabState(tagNode);
52
+ }
53
+ }
2
54
  /**
3
55
  * 获取echarts和select实时数据
4
56
  * @param node 节点
@@ -6,6 +6,9 @@ export function getParams(id, data) {
6
6
  if (item.children && item.children.length) {
7
7
  getParams(id, item.children);
8
8
  }
9
+ if (item.formData && item.formData.detailPageData && item.formData.detailPageData.pens && item.formData.detailPageData.pens.length) {
10
+ getParams(id, item.formData.detailPageData.pens);
11
+ }
9
12
  });
10
13
  }
11
14
  // 过滤出参数
@@ -1,5 +1,7 @@
1
1
  // 源码版写法
2
2
  import { registerNode } from '../core'
3
+ import { formOverflow } from '../core/src/middles/nodes/formoverflow'
4
+
3
5
 
4
6
  // 组件版写法和bundle一致
5
7
  // window.Le5leTopology.registerNode
@@ -7,87 +9,87 @@ import { registerNode } from '../core'
7
9
  // 画骨架
8
10
 
9
11
  function drawOuterLine(ctx, node) {
10
- const R = Math.floor((node.rect.width - 6) / 2);
11
- const r = Math.round((R * 1) / 2);
12
-
13
- ctx.beginPath();
14
- // 上半个圆形
15
- ctx.arc(node.rect.x + R, node.rect.y + r, r, 0, Math.PI, true);
16
- // 下半个圆形
17
- const theta = Math.acos((r * 1.0) / R);
18
- ctx.arc(
19
- node.rect.x + R,
20
- node.rect.y + node.rect.height - R,
21
- R,
22
- theta + Math.PI,
23
- -theta,
24
- true
25
- ); // 逆时针
26
- ctx.closePath();
27
- ctx.stroke();
12
+ const R = Math.floor((node.rect.width - 6) / 2);
13
+ const r = Math.round((R * 1) / 2);
14
+
15
+ ctx.beginPath();
16
+ // 上半个圆形
17
+ ctx.arc(node.rect.x + R, node.rect.y + r, r, 0, Math.PI, true);
18
+ // 下半个圆形
19
+ const theta = Math.acos((r * 1.0) / R);
20
+ ctx.arc(
21
+ node.rect.x + R,
22
+ node.rect.y + node.rect.height - R,
23
+ R,
24
+ theta + Math.PI,
25
+ -theta,
26
+ true
27
+ ); // 逆时针
28
+ ctx.closePath();
29
+ ctx.stroke();
28
30
  }
29
31
 
30
32
  // 画底色
31
33
  function drawBasic(ctx, node) {
32
- const lingrad = ctx.createLinearGradient(
33
- node.rect.x,
34
- node.rect.y,
35
- node.rect.width,
36
- node.rect.height
37
- );
38
- lingrad.addColorStop(0, 'mediumvioletred');
39
- lingrad.addColorStop(0.2, 'darkorange');
40
- lingrad.addColorStop(0.4, 'gold');
41
- lingrad.addColorStop(0.6, 'limegreen');
42
- lingrad.addColorStop(0.8, 'navy');
43
- lingrad.addColorStop(1, 'purple');
44
- ctx.fillStyle = lingrad;
45
- ctx.fill('evenodd');
34
+ const lingrad = ctx.createLinearGradient(
35
+ node.rect.x,
36
+ node.rect.y,
37
+ node.rect.width,
38
+ node.rect.height
39
+ );
40
+ lingrad.addColorStop(0, 'mediumvioletred');
41
+ lingrad.addColorStop(0.2, 'darkorange');
42
+ lingrad.addColorStop(0.4, 'gold');
43
+ lingrad.addColorStop(0.6, 'limegreen');
44
+ lingrad.addColorStop(0.8, 'navy');
45
+ lingrad.addColorStop(1, 'purple');
46
+ ctx.fillStyle = lingrad;
47
+ ctx.fill('evenodd');
46
48
  }
47
49
 
48
50
  function getYByValue(node, i) {
49
- const R = Math.floor((node.rect.width - 6) / 2);
50
- const r = Math.round((R * 1) / 2);
51
-
52
- const min = 0;
53
- const max = 40;
54
-
55
- // 刻度线总高度
56
- const scale_height = node.rect.height - 2 * R - 2 * r;
57
- // 0刻度线所在位置
58
- const zero_scale_y = node.rect.height - 2 * R;
59
- const dy_dtem = scale_height / (max - min);
60
- return zero_scale_y - dy_dtem * node.value;
51
+ const R = Math.floor((node.rect.width - 6) / 2);
52
+ const r = Math.round((R * 1) / 2);
53
+
54
+ const min = 0;
55
+ const max = 40;
56
+
57
+ // 刻度线总高度
58
+ const scale_height = node.rect.height - 2 * R - 2 * r;
59
+ // 0刻度线所在位置
60
+ const zero_scale_y = node.rect.height - 2 * R;
61
+ const dy_dtem = scale_height / (max - min);
62
+ return zero_scale_y - dy_dtem * node.value;
61
63
  }
62
64
 
63
65
  // 画刻度线
64
66
  function drawScale(ctx, node) {
65
- const min = 0;
66
- const max = 40;
67
- const R = Math.floor((node.rect.width - 6) / 2);
68
- const r = Math.round((R * 1) / 2);
69
-
70
- for (let i = min; i <= max; i++) {
71
- // 画刻度线
72
- const y = getYByValue(node, i);
73
- ctx.beginPath();
74
- ctx.moveTo(R + r, y);
75
- if (i % 10 == 0) {
76
- ctx.lineWidth = 2;
77
- ctx.lineTo(R + r - (r * 2) / 3, y);
78
- // ctx.font = "15px bold";
79
- ctx.fillText(i + '', R + r, y + 6);
80
- ctx.stroke();
81
- } else {
82
- ctx.lineWidth = 1;
83
- if (i % 5 == 0) {
84
- ctx.lineTo(R + r - r / 2, y);
85
- } else {
86
- ctx.lineTo(R + r - r / 3, y);
87
- }
88
- ctx.stroke();
89
- }
67
+ const min = 0;
68
+ const max = 40;
69
+ const R = Math.floor((node.rect.width - 6) / 2);
70
+ const r = Math.round((R * 1) / 2);
71
+
72
+ for (let i = min; i <= max; i++) {
73
+ // 画刻度线
74
+ const y = getYByValue(node, i);
75
+ ctx.beginPath();
76
+ ctx.moveTo(R + r, y);
77
+ if (i % 10 == 0) {
78
+ ctx.lineWidth = 2;
79
+ ctx.lineTo(R + r - (r * 2) / 3, y);
80
+ // ctx.font = "15px bold";
81
+ ctx.fillText(i + '', R + r, y + 6);
82
+ ctx.stroke();
83
+ } else {
84
+ ctx.lineWidth = 1;
85
+ if (i % 5 == 0) {
86
+ ctx.lineTo(R + r - r / 2, y);
87
+ } else {
88
+ ctx.lineTo(R + r - r / 3, y);
89
+ }
90
+ ctx.stroke();
90
91
  }
92
+ }
91
93
  }
92
94
 
93
95
  /////////////////////
@@ -96,101 +98,102 @@ function drawScale(ctx, node) {
96
98
 
97
99
  // 自定义图形库绘画函数
98
100
  export function thermometer(ctx, node) {
99
- ctx.beginPath();
100
-
101
- drawOuterLine(ctx, node);
102
- drawBasic(ctx, node);
103
- ctx.clearRect(
104
- node.rect.x,
105
- node.rect.y,
106
- node.rect.width,
107
- getYByValue(node, node.value)
108
- );
109
- drawOuterLine(ctx, node);
110
- drawScale(ctx, node);
101
+ ctx.beginPath();
102
+
103
+ drawOuterLine(ctx, node);
104
+ drawBasic(ctx, node);
105
+ ctx.clearRect(
106
+ node.rect.x,
107
+ node.rect.y,
108
+ node.rect.width,
109
+ getYByValue(node, node.value)
110
+ );
111
+ drawOuterLine(ctx, node);
112
+ drawScale(ctx, node);
111
113
  }
112
114
 
113
115
  // 自定义图形库绘画函数
114
116
  export function pool(ctx, node) {
115
- var wr = node.borderRadius;
116
- var hr = node.borderRadius;
117
- if (node.borderRadius < 1) {
118
- wr = node.rect.width * node.borderRadius;
119
- hr = node.rect.height * node.borderRadius;
120
- }
121
- var r = wr < hr ? wr : hr;
122
- if (node.rect.width < 2 * r) {
123
- r = node.rect.width / 2;
124
- }
125
- if (node.rect.height < 2 * r) {
126
- r = node.rect.height / 2;
127
- }
128
- ctx.beginPath();
129
- ctx.strokeStyle = "rgba(0,0,0,.0)"
130
- var value = (1-node.value) * (node.rect.height - node.lineWidth/2)
131
- ctx.moveTo(node.rect.x + node.lineWidth/2, node.rect.y + value);
132
- ctx.lineTo(node.rect.ex - node.lineWidth/2, node.rect.y + value);
133
- ctx.arcTo(node.rect.ex - node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, node.rect.x + node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, r);
134
- ctx.arcTo(node.rect.x + node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, node.rect.x + node.lineWidth/2, node.rect.y, r);
135
- ctx.lineTo(node.rect.x + node.lineWidth/2, node.rect.y + value);
136
- ctx.closePath();
137
- (node.fillStyle || node.bkType) && ctx.fill();
138
- ctx.stroke();
139
-
140
- ctx.beginPath();
141
- ctx.strokeStyle = node.strokeStyle
142
- ctx.lineWidth = node.lineWidth
143
- ctx.moveTo(node.rect.x + node.rect.width, node.rect.y);
144
- ctx.arcTo(node.rect.x + node.rect.width, node.rect.y + node.rect.height, node.rect.x, node.rect.y + node.rect.height, r);
145
- ctx.arcTo(node.rect.x, node.rect.y + node.rect.height, node.rect.x, node.rect.y, r);
146
- ctx.arcTo(node.rect.x, node.rect.y, node.rect.x + node.rect.width, node.rect.y, r);
147
- // ctx.closePath();
148
- (node.fillStyle || node.bkType);
149
- ctx.stroke();
117
+ var wr = node.borderRadius;
118
+ var hr = node.borderRadius;
119
+ if (node.borderRadius < 1) {
120
+ wr = node.rect.width * node.borderRadius;
121
+ hr = node.rect.height * node.borderRadius;
122
+ }
123
+ var r = wr < hr ? wr : hr;
124
+ if (node.rect.width < 2 * r) {
125
+ r = node.rect.width / 2;
126
+ }
127
+ if (node.rect.height < 2 * r) {
128
+ r = node.rect.height / 2;
129
+ }
130
+ ctx.beginPath();
131
+ ctx.strokeStyle = "rgba(0,0,0,.0)"
132
+ var value = (1-node.value) * (node.rect.height - node.lineWidth/2)
133
+ ctx.moveTo(node.rect.x + node.lineWidth/2, node.rect.y + value);
134
+ ctx.lineTo(node.rect.ex - node.lineWidth/2, node.rect.y + value);
135
+ ctx.arcTo(node.rect.ex - node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, node.rect.x + node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, r);
136
+ ctx.arcTo(node.rect.x + node.lineWidth/2, node.rect.y + node.rect.height - node.lineWidth/2, node.rect.x + node.lineWidth/2, node.rect.y, r);
137
+ ctx.lineTo(node.rect.x + node.lineWidth/2, node.rect.y + value);
138
+ ctx.closePath();
139
+ (node.fillStyle || node.bkType) && ctx.fill();
140
+ ctx.stroke();
141
+
142
+ ctx.beginPath();
143
+ ctx.strokeStyle = node.strokeStyle
144
+ ctx.lineWidth = node.lineWidth
145
+ ctx.moveTo(node.rect.x + node.rect.width, node.rect.y);
146
+ ctx.arcTo(node.rect.x + node.rect.width, node.rect.y + node.rect.height, node.rect.x, node.rect.y + node.rect.height, r);
147
+ ctx.arcTo(node.rect.x, node.rect.y + node.rect.height, node.rect.x, node.rect.y, r);
148
+ ctx.arcTo(node.rect.x, node.rect.y, node.rect.x + node.rect.width, node.rect.y, r);
149
+ // ctx.closePath();
150
+ (node.fillStyle || node.bkType);
151
+ ctx.stroke();
150
152
  }
151
153
 
152
154
  // 自定义图形库绘画函数
153
155
  export function electricFan(ctx, node) {
154
- var wwr = node.rect.width / 2;
155
- var hwr = node.rect.height / 2;
156
- var hwr = node.rect.height / 2;
157
- var x0 = node.rect.x + node.rect.width /2
158
- var y0 = node.rect.y + node.rect.height / 2
159
- var withinRadius = wwr < hwr ? wwr : hwr;
160
- ctx.beginPath();
161
- ctx.lineWidth = node.lineWidth
162
- ctx.arc(x0,y0,withinRadius,0,2*Math.PI);
163
- ctx.closePath();
164
- ctx.stroke();
165
- ctx.beginPath();
166
- ctx.lineWidth = 1;
167
- var fanCount = node.fanCount;
168
- for(var i = 0; i < fanCount; i++){
169
- var fanAngle = 2 * Math.PI / fanCount * i;
170
- var x1 = x0 - withinRadius*Math.sin(fanAngle);
171
- var y1 = y0 - withinRadius*Math.cos(fanAngle);
172
- var xr = x0 - withinRadius*Math.sin(fanAngle)/2;
173
- var yr = y0 - withinRadius*Math.cos(fanAngle)/2;
174
- ctx.moveTo(x0, y0);
175
- ctx.lineTo(x1, y1);
176
- ctx.arc(xr, yr, withinRadius/2, Math.PI / 2 - fanAngle,3 * Math.PI / 2 - fanAngle);
177
- }
178
- ctx.closePath();
179
- (node.fillStyle || node.bkType) && ctx.fill();
180
- ctx.stroke();
181
- ctx.beginPath();
182
- ctx.lineWidth = 3;
183
- ctx.arc(x0,y0,withinRadius/5,0,2*Math.PI);
184
- ctx.closePath();
185
- (node.fillStyle || node.bkType) && ctx.fill();
186
- ctx.stroke();
156
+ var wwr = node.rect.width / 2;
157
+ var hwr = node.rect.height / 2;
158
+ var hwr = node.rect.height / 2;
159
+ var x0 = node.rect.x + node.rect.width /2
160
+ var y0 = node.rect.y + node.rect.height / 2
161
+ var withinRadius = wwr < hwr ? wwr : hwr;
162
+ ctx.beginPath();
163
+ ctx.lineWidth = node.lineWidth
164
+ ctx.arc(x0,y0,withinRadius,0,2*Math.PI);
165
+ ctx.closePath();
166
+ ctx.stroke();
167
+ ctx.beginPath();
168
+ ctx.lineWidth = 1;
169
+ var fanCount = node.fanCount;
170
+ for(var i = 0; i < fanCount; i++){
171
+ var fanAngle = 2 * Math.PI / fanCount * i;
172
+ var x1 = x0 - withinRadius*Math.sin(fanAngle);
173
+ var y1 = y0 - withinRadius*Math.cos(fanAngle);
174
+ var xr = x0 - withinRadius*Math.sin(fanAngle)/2;
175
+ var yr = y0 - withinRadius*Math.cos(fanAngle)/2;
176
+ ctx.moveTo(x0, y0);
177
+ ctx.lineTo(x1, y1);
178
+ ctx.arc(xr, yr, withinRadius/2, Math.PI / 2 - fanAngle,3 * Math.PI / 2 - fanAngle);
179
+ }
180
+ ctx.closePath();
181
+ (node.fillStyle || node.bkType) && ctx.fill();
182
+ ctx.stroke();
183
+ ctx.beginPath();
184
+ ctx.lineWidth = 3;
185
+ ctx.arc(x0,y0,withinRadius/5,0,2*Math.PI);
186
+ ctx.closePath();
187
+ (node.fillStyle || node.bkType) && ctx.fill();
188
+ ctx.stroke();
187
189
  }
188
190
 
189
191
  // 注册自定义图形库
190
192
  export function registerMyShape() {
191
- registerNode('electricFan', electricFan);
192
- registerNode('pool', pool);
193
- registerNode('thermometer', thermometer);
193
+ registerNode('electricFan', electricFan);
194
+ registerNode('pool', pool);
195
+ registerNode('thermometer', thermometer);
196
+ registerNode('formOverflow', formOverflow);
194
197
  }
195
198
 
196
199
  // src\views\data.ts 里面加载到工具栏,第一个就是此自定义图形库
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dcim-topology2d",
3
- "version": "2.0.5",
3
+ "version": "2.0.6",
4
4
  "description": "",
5
5
  "main": "-",
6
6
  "scripts": {