dcim-topology2d 1.0.3 → 1.1.1
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.
- package/chart-diagram/src/echarts/index.js +3 -6
- package/core/index.d.ts +1 -0
- package/core/index.js +1 -0
- package/core/src/activeLayer.d.ts +2 -10
- package/core/src/activeLayer.js +42 -41
- package/core/src/animateLayer.d.ts +3 -7
- package/core/src/animateLayer.js +10 -12
- package/core/src/calling.d.ts +1 -4
- package/core/src/calling.js +38 -41
- package/core/src/canvas.d.ts +1 -6
- package/core/src/canvas.js +17 -18
- package/core/src/common.d.ts +5 -5
- package/core/src/common.js +147 -110
- package/core/src/core.d.ts +3 -4
- package/core/src/core.js +222 -251
- package/core/src/divLayer.d.ts +2 -7
- package/core/src/divLayer.js +25 -25
- package/core/src/healps/changeData.d.ts +1 -1
- package/core/src/healps/changeData.js +31 -11
- package/core/src/hoverLayer.d.ts +2 -9
- package/core/src/hoverLayer.js +31 -34
- package/core/src/models/index.d.ts +0 -1
- package/core/src/models/index.js +0 -1
- package/core/src/offscreen.d.ts +1 -4
- package/core/src/offscreen.js +10 -8
- package/core/src/options.js +1 -0
- package/core/src/preview.d.ts +1 -13
- package/core/src/preview.js +26 -27
- package/core/src/renderLayer.d.ts +1 -3
- package/core/src/renderLayer.js +26 -31
- package/core/src/store/common.d.ts +9 -0
- package/core/src/store/common.js +5 -0
- package/core/src/store/data.d.ts +126 -0
- package/core/src/store/data.js +80 -0
- package/core/src/store/index.d.ts +2 -0
- package/core/src/store/index.js +2 -0
- package/core/src/utils/conversion.d.ts +7 -0
- package/core/src/utils/conversion.js +54 -0
- package/core/src/utils/dom.d.ts +4 -3
- package/core/src/utils/dom.js +2 -0
- package/package.json +1 -1
- package/core/src/models/data.d.ts +0 -26
- package/core/src/models/data.js +0 -77
- package/core/src/models/data.js.map +0 -1
- package/core/src/mqtt.d.ts +0 -14
- package/core/src/mqtt.js +0 -82
- package/core/src/mqtt.js.map +0 -1
- package/core/src/socket.d.ts +0 -10
- package/core/src/socket.js +0 -51
- package/core/src/socket.js.map +0 -1
package/core/src/preview.js
CHANGED
@@ -29,7 +29,7 @@ var Preview = (function (_super) {
|
|
29
29
|
_this.onmouseup(e);
|
30
30
|
return;
|
31
31
|
}
|
32
|
-
if (_this.data.locked && _this.mouseDown) {
|
32
|
+
if (_this.store.data.locked && _this.mouseDown) {
|
33
33
|
return;
|
34
34
|
}
|
35
35
|
_this.scheduledAnimationFrame = true;
|
@@ -45,7 +45,7 @@ var Preview = (function (_super) {
|
|
45
45
|
hoverNode,
|
46
46
|
moveType,
|
47
47
|
eventNode
|
48
|
-
} = mousMoveFun(_this.options.type, pos, _this.data.pens);
|
48
|
+
} = mousMoveFun(_this.store.options.type, pos, _this.store.data.pens);
|
49
49
|
_this.moveIn.type = _this.moveInType.None;
|
50
50
|
_this.scheduledAnimationFrame = false;
|
51
51
|
_this.hideTip();
|
@@ -73,7 +73,7 @@ var Preview = (function (_super) {
|
|
73
73
|
if (_this.inputObj) {
|
74
74
|
_this.setNodeText();
|
75
75
|
}
|
76
|
-
const {eventType, value} = mousDownFun(_this.options.type, _this.moveIn.eventNode);
|
76
|
+
const {eventType, value} = mousDownFun(_this.store.options.type, _this.moveIn.eventNode);
|
77
77
|
if (_this.moveIn.type == _this.moveInType.Nodes) {
|
78
78
|
_this.divLayer.canvas.style.cursor = 'pointer';
|
79
79
|
switch (eventType) {
|
@@ -84,7 +84,7 @@ var Preview = (function (_super) {
|
|
84
84
|
_this.dispatch('node', _this.moveIn.hoverNode);
|
85
85
|
break;
|
86
86
|
case downDataType.Showhide:
|
87
|
-
_this.hidePenByTag(_this.data.pens, value);
|
87
|
+
_this.hidePenByTag(_this.store.data.pens, value);
|
88
88
|
const obj = value ? JSON.parse(value) : {}
|
89
89
|
const visibleRange = obj.visibleRange
|
90
90
|
if (visibleRange == '1') {
|
@@ -109,10 +109,10 @@ var Preview = (function (_super) {
|
|
109
109
|
_this.divLayer.canvas.onmousedown = this.onmousedown;
|
110
110
|
_this.divLayer.canvas.onmouseup = this.onmouseup;
|
111
111
|
_this.divLayer.canvas.onwheel = function (event) {
|
112
|
-
if (_this.options.disableScale) {
|
112
|
+
if (_this.store.options.disableScale) {
|
113
113
|
return;
|
114
114
|
}
|
115
|
-
switch (_this.options.scaleKey) {
|
115
|
+
switch (_this.store.options.scaleKey) {
|
116
116
|
case KeyType.None:
|
117
117
|
break;
|
118
118
|
case KeyType.Ctrl:
|
@@ -166,46 +166,45 @@ var Preview = (function (_super) {
|
|
166
166
|
// open - redraw by the data
|
167
167
|
Preview.prototype.open = function (topoJSon) {
|
168
168
|
this.conversionData(topoJSon);
|
169
|
-
this.parentElem.scrollLeft = 0;
|
170
|
-
this.parentElem.scrollTop = 0;
|
171
|
-
this.divLayer.clear();
|
172
169
|
this.fitView();
|
173
170
|
this.render(true);
|
174
171
|
this.animate(true);
|
175
172
|
};
|
176
173
|
Preview.prototype.scale = function (scale, center, w, h) {
|
177
|
-
if (this.data.scale * scale < this.options.minScale ||
|
178
|
-
this.data.scale * scale > this.options.maxScale) {
|
174
|
+
if (this.store.data.scale * scale < this.store.options.minScale ||
|
175
|
+
this.store.data.scale * scale > this.store.options.maxScale) {
|
179
176
|
return;
|
180
177
|
}
|
181
178
|
const scaleX = w ? w : scale;
|
182
179
|
const scaleY = h ? h : scale;
|
183
|
-
this.data.scale *= scale;
|
180
|
+
this.store.data.scale *= scale;
|
184
181
|
if(this.isFullScreen) {
|
185
|
-
this.ratioCord.ratio *= scale;
|
186
|
-
this.ratioCord.scaleX *= scaleX;
|
187
|
-
this.ratioCord.scaleY *= scaleY;
|
182
|
+
this.store.ratioCord.ratio *= scale;
|
183
|
+
this.store.ratioCord.scaleX *= scaleX;
|
184
|
+
this.store.ratioCord.scaleY *= scaleY;
|
188
185
|
}else {
|
189
|
-
this.ratioCord
|
190
|
-
|
191
|
-
|
186
|
+
this.store.ratioCord = {
|
187
|
+
ratio: 1,
|
188
|
+
scaleX: 1,
|
189
|
+
scaleY: 1
|
190
|
+
}
|
192
191
|
}
|
193
192
|
!center && (center = this.getRect().center);
|
194
|
-
for (var _i = 0, _a = this.data.pens; _i < _a.length; _i++) {
|
193
|
+
for (var _i = 0, _a = this.store.data.pens; _i < _a.length; _i++) {
|
195
194
|
var item = _a[_i];
|
196
195
|
item.scale(scale, center, w, h);
|
197
196
|
}
|
198
197
|
};
|
199
198
|
Preview.prototype.scaleTo = function (scale) {
|
200
|
-
this.scale(scale / this.data.scale);
|
201
|
-
this.data.scale = scale;
|
199
|
+
this.scale(scale / this.store.data.scale);
|
200
|
+
this.store.data.scale = scale;
|
202
201
|
};
|
203
202
|
// scale for origin canvas:
|
204
203
|
Preview.prototype.fitView = function (viewPadding, restore) {
|
205
204
|
if (!this.hasView())
|
206
205
|
return;
|
207
206
|
// 1. 重置画布尺寸为容器尺寸
|
208
|
-
var parentElem = this.
|
207
|
+
var parentElem = this.store.parentElem;
|
209
208
|
var width = parentElem.offsetWidth, height = parentElem.offsetHeight;
|
210
209
|
this.canvasResize({
|
211
210
|
width: width,
|
@@ -214,7 +213,7 @@ var Preview = (function (_super) {
|
|
214
213
|
// 2. 图形居中
|
215
214
|
this.centerView(viewPadding);
|
216
215
|
// 3. 获取设置的留白值
|
217
|
-
var padding = formatPadding(viewPadding || this.options.viewPadding);
|
216
|
+
var padding = formatPadding(viewPadding || this.store.options.viewPadding);
|
218
217
|
// 4. 获取图形尺寸
|
219
218
|
var rect = this.getRect();
|
220
219
|
// 6. 计算缩放比
|
@@ -225,14 +224,14 @@ var Preview = (function (_super) {
|
|
225
224
|
ratio = h;
|
226
225
|
}
|
227
226
|
if(typeof restore === 'boolean' && restore) {
|
228
|
-
ratio = 1 / this.ratioCord.ratio;
|
229
|
-
w = 1 / this.ratioCord.scaleX;
|
230
|
-
h = 1 / this.ratioCord.scaleY;
|
227
|
+
ratio = 1 / this.store.ratioCord.ratio;
|
228
|
+
w = 1 / this.store.ratioCord.scaleX;
|
229
|
+
h = 1 / this.store.ratioCord.scaleY;
|
231
230
|
}
|
232
231
|
this.scale(ratio, undefined, w, h);
|
233
232
|
this.canvas.scale(ratio, undefined, w, h);
|
234
233
|
// 7. X抽滚动条隐藏
|
235
|
-
this.parentElem.style.overflow = 'hidden auto';
|
234
|
+
this.store.parentElem.style.overflow = 'hidden auto';
|
236
235
|
};
|
237
236
|
Preview.prototype.destroy = function () {
|
238
237
|
this.destroyStatic();
|
@@ -2,8 +2,6 @@ import { Options } from './options';
|
|
2
2
|
import { Canvas } from './canvas';
|
3
3
|
import {Point} from './models';
|
4
4
|
export declare class RenderLayer extends Canvas {
|
5
|
-
parentElem: HTMLElement;
|
6
|
-
options: Options;
|
7
5
|
offscreen: any;
|
8
6
|
bkImg: HTMLImageElement;
|
9
7
|
bkImgRect: {
|
@@ -22,7 +20,7 @@ export declare class RenderLayer extends Canvas {
|
|
22
20
|
width: number;
|
23
21
|
height: number;
|
24
22
|
};
|
25
|
-
constructor(
|
23
|
+
constructor(TID: String);
|
26
24
|
loadBkImg(cb?: any): void;
|
27
25
|
clearBkImg(): void;
|
28
26
|
render: () => void;
|
package/core/src/renderLayer.js
CHANGED
@@ -13,22 +13,20 @@ var __extends = (this && this.__extends) || (function () {
|
|
13
13
|
})();
|
14
14
|
import { Store } from 'le5le-store';
|
15
15
|
import { Canvas } from './canvas';
|
16
|
-
import {
|
16
|
+
import { commonStore } from './store'
|
17
17
|
//let isQttFillStyle = false;
|
18
18
|
var RenderLayer = /** @class */ (function (_super) {
|
19
19
|
__extends(RenderLayer, _super);
|
20
|
-
function RenderLayer(
|
20
|
+
function RenderLayer(TID) {
|
21
21
|
//isQttFillStyle = false;
|
22
|
-
|
23
|
-
var _this = _super.call(this, parentElem, options, TID) || this;
|
24
|
-
_this.parentElem = parentElem;
|
25
|
-
_this.options = options;
|
22
|
+
var _this = _super.call(this, TID) || this;
|
26
23
|
_this.bkImgRect = null;
|
27
24
|
_this.initImage = false;
|
28
25
|
_this.coverType = 'container';
|
29
26
|
_this.bgRect = null;
|
30
27
|
_this.render = function () {
|
31
|
-
if
|
28
|
+
if(!commonStore || !commonStore[TID]) return;
|
29
|
+
if (commonStore[TID].data.bkImage && !_this.initImage) {
|
32
30
|
_this.loadBkImg(_this.render, 'pixi');
|
33
31
|
return;
|
34
32
|
}
|
@@ -37,12 +35,8 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
37
35
|
}
|
38
36
|
var ctx = _this.canvas.getContext('2d');
|
39
37
|
ctx.clearRect(0, 0, _this.canvas.width, _this.canvas.height);
|
40
|
-
|
41
|
-
|
42
|
-
// isQttFillStyle = true;
|
43
|
-
// }
|
44
|
-
if (_this.data.bkColor) {
|
45
|
-
ctx.fillStyle = _this.data.bkColor;
|
38
|
+
if (commonStore[TID].data.bkColor) {
|
39
|
+
ctx.fillStyle = commonStore[TID].data.bkColor;
|
46
40
|
ctx.fillRect(0, 0, _this.width, _this.height);
|
47
41
|
}
|
48
42
|
if (_this.bkImg && _this.bkImgRect) {
|
@@ -52,34 +46,38 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
52
46
|
ctx.drawImage(_this.offscreen, 0, 0, _this.width, _this.height);
|
53
47
|
};
|
54
48
|
_this.offscreen = Store.get(_this.generateStoreKey('LT:offscreen'));
|
55
|
-
|
49
|
+
commonStore[TID].parentElem.appendChild(_this.canvas);
|
56
50
|
return _this;
|
57
51
|
}
|
58
52
|
RenderLayer.prototype.scale = function (scale, center, w, h){
|
59
|
-
|
53
|
+
const TID = this.TID;
|
54
|
+
if(!commonStore || !commonStore[TID]) return;
|
55
|
+
const bkImage = commonStore[TID].data.bkImage;
|
56
|
+
const bkImageRect = commonStore[TID].data.bkImageRect;
|
57
|
+
if(!bkImage) return;
|
60
58
|
if(!center) {
|
61
|
-
center =
|
59
|
+
center = bkImageRect ? bkImageRect.center : this.bgRect.center;
|
62
60
|
}
|
63
61
|
if (!w) {
|
64
62
|
w = scale;
|
65
|
-
if(
|
66
|
-
|
63
|
+
if(bkImageRect) {
|
64
|
+
bkImageRect.x = center.x - (center.x - bkImageRect.x) * w;
|
67
65
|
}else {
|
68
66
|
this.bgRect.x = center.x - (center.x - this.bgRect.x) * w;
|
69
67
|
}
|
70
68
|
}
|
71
69
|
if (!h) {
|
72
70
|
h = scale;
|
73
|
-
if(
|
74
|
-
|
71
|
+
if(bkImageRect){
|
72
|
+
bkImageRect.y = center.y - (center.y - bkImageRect.y) * h;
|
75
73
|
}else {
|
76
74
|
this.bgRect.y = center.y - (center.y - this.bgRect.y) * h;
|
77
75
|
}
|
78
76
|
}
|
79
|
-
if(
|
80
|
-
|
81
|
-
|
82
|
-
this.bkImgRect =
|
77
|
+
if(bkImageRect) {
|
78
|
+
bkImageRect.width *= w;
|
79
|
+
bkImageRect.height *= h;
|
80
|
+
this.bkImgRect = bkImageRect;
|
83
81
|
}else {
|
84
82
|
if(this.initImage) {
|
85
83
|
this.bgRect.width *= w;
|
@@ -90,12 +88,13 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
90
88
|
};
|
91
89
|
RenderLayer.prototype.loadBkImg = function (cb, pixi) {
|
92
90
|
var _this = this;
|
93
|
-
|
91
|
+
const bkImage = commonStore[_this.TID].data.bkImage;
|
92
|
+
if (!bkImage || this.initImage) {
|
94
93
|
return;
|
95
94
|
}
|
96
95
|
this.bkImg = new Image();
|
97
96
|
this.bkImg.crossOrigin = 'anonymous';
|
98
|
-
this.bkImg.src =
|
97
|
+
this.bkImg.src = bkImage;
|
99
98
|
this.bkImg.onload = function () {
|
100
99
|
if(pixi && !_this.bkImgRect) {
|
101
100
|
_this.bkImgRectResize({width: _this.canvas.width, height: _this.canvas.height});
|
@@ -149,7 +148,7 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
149
148
|
};
|
150
149
|
|
151
150
|
RenderLayer.prototype.bkImgRectResize = function (size) {
|
152
|
-
const bkImageRect = this.
|
151
|
+
const bkImageRect = commonStore[this.TID].bkImageRect;
|
153
152
|
if(!size) return;
|
154
153
|
if(bkImageRect) {
|
155
154
|
let x = bkImageRect.x ? Number(bkImageRect.x) : 0;
|
@@ -170,16 +169,12 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
170
169
|
|
171
170
|
RenderLayer.prototype.destroy = function() {
|
172
171
|
|
173
|
-
this.data = null;
|
174
|
-
|
175
172
|
this.canvas = null;
|
176
173
|
|
177
174
|
this.render = null;
|
178
175
|
|
179
176
|
this.offscreen = null;
|
180
177
|
|
181
|
-
this.options = null;
|
182
|
-
|
183
178
|
}
|
184
179
|
return RenderLayer;
|
185
180
|
}(Canvas));
|
@@ -0,0 +1,9 @@
|
|
1
|
+
import { Pen } from '../models';
|
2
|
+
// @ts-ignore
|
3
|
+
export const commonStore: {
|
4
|
+
canvasDraws: {
|
5
|
+
[key: string]: (ctx: CanvasRenderingContext2D, pen: Pen) => void;
|
6
|
+
};
|
7
|
+
anchors: { [key: string]: (pen: Pen) => void };
|
8
|
+
htmlElements: { [key: string]: HTMLDivElement }; // html元素
|
9
|
+
};
|
@@ -0,0 +1,126 @@
|
|
1
|
+
// @ts-ignore
|
2
|
+
import { default as mitt, Emitter } from 'mitt';
|
3
|
+
import { Pen, Lock } from '../models';
|
4
|
+
import {Options, DefalutOptions} from '../options';
|
5
|
+
import {s8} from '../utils';
|
6
|
+
import { commonStore } from './common'
|
7
|
+
// 2D可视化的data数据
|
8
|
+
export interface visualization2DData {
|
9
|
+
pens: Pen[];
|
10
|
+
lineName: string;
|
11
|
+
fromArrowType: string;
|
12
|
+
toArrowType: string;
|
13
|
+
scale: number;
|
14
|
+
locked: Lock;
|
15
|
+
bkImage: string;
|
16
|
+
bkColor: string;
|
17
|
+
grid?: boolean;
|
18
|
+
websocket?: string;
|
19
|
+
mqttUrl?: string;
|
20
|
+
mqttOptions?: {
|
21
|
+
clientId?: string;
|
22
|
+
username?: string;
|
23
|
+
password?: string;
|
24
|
+
};
|
25
|
+
mqttTopics?: string;
|
26
|
+
manualCps?: boolean;
|
27
|
+
dataConstruct?: any;
|
28
|
+
data?: any;
|
29
|
+
bkImageRect?: any;
|
30
|
+
}
|
31
|
+
// 2D可视化使用到的数据仓库
|
32
|
+
export interface visualization2DStore {
|
33
|
+
id: string;
|
34
|
+
data: visualization2DData;
|
35
|
+
pens: { [key: string]: Pen };
|
36
|
+
options: Options;
|
37
|
+
cacheDatas?: {
|
38
|
+
data: visualization2DData;
|
39
|
+
}[];
|
40
|
+
emitter: Emitter;
|
41
|
+
dpiRatio?: number;
|
42
|
+
lastScale?: number; //记录上次模版的scale
|
43
|
+
ratioCord: {
|
44
|
+
ratio?: number;
|
45
|
+
scaleX?: number;
|
46
|
+
scaleY?: number;
|
47
|
+
},
|
48
|
+
parentElem: HTMLElement
|
49
|
+
}
|
50
|
+
|
51
|
+
// @ts-ignore
|
52
|
+
export const createStore = () => {
|
53
|
+
return {
|
54
|
+
id: '',
|
55
|
+
data: {
|
56
|
+
pens: [],
|
57
|
+
lineName: 'curve',
|
58
|
+
fromArrowType: '',
|
59
|
+
toArrowType: 'triangleSolid',
|
60
|
+
scale: 1,
|
61
|
+
locked: Lock.None,
|
62
|
+
bkImageRect: null,
|
63
|
+
mqttOptions: {
|
64
|
+
clientId: s8()
|
65
|
+
},
|
66
|
+
dataConstruct: {}
|
67
|
+
},
|
68
|
+
pens: {},
|
69
|
+
options: { ...DefalutOptions },
|
70
|
+
emitter: mitt(),
|
71
|
+
cacheDatas: [],
|
72
|
+
dpiRatio: 1,
|
73
|
+
lastScale: 1,
|
74
|
+
ratioCord: {
|
75
|
+
ratio: 1,
|
76
|
+
scaleX: 1,
|
77
|
+
scaleY: 1
|
78
|
+
},
|
79
|
+
parentElem: null
|
80
|
+
} as visualization2DStore;
|
81
|
+
};
|
82
|
+
// @ts-ignore
|
83
|
+
export const useStore = (id = 'default'): visualization2DStore => {
|
84
|
+
if (!commonStore[id]) {
|
85
|
+
// @ts-ignore
|
86
|
+
commonStore[id] = createStore();
|
87
|
+
commonStore[id].id = id;
|
88
|
+
}
|
89
|
+
return commonStore[id];
|
90
|
+
};
|
91
|
+
|
92
|
+
// @ts-ignore
|
93
|
+
export const clearStore = (store: visualization2DStore) => {
|
94
|
+
store.data = {
|
95
|
+
bkColor: '',
|
96
|
+
bkImage: '',
|
97
|
+
data: undefined,
|
98
|
+
grid: false,
|
99
|
+
manualCps: false,
|
100
|
+
mqttTopics: '',
|
101
|
+
mqttUrl: '',
|
102
|
+
websocket: '',
|
103
|
+
pens: [],
|
104
|
+
lineName: 'curve',
|
105
|
+
fromArrowType: '',
|
106
|
+
toArrowType: 'triangleSolid',
|
107
|
+
scale: 1,
|
108
|
+
locked: Lock.None,
|
109
|
+
bkImageRect: null,
|
110
|
+
mqttOptions: {
|
111
|
+
clientId: s8()
|
112
|
+
},
|
113
|
+
dataConstruct: {}
|
114
|
+
};
|
115
|
+
store.lastScale = store.data.scale;
|
116
|
+
store.pens = {};
|
117
|
+
store.options = {};
|
118
|
+
store.cacheDatas = [];
|
119
|
+
store.dpiRatio = 1;
|
120
|
+
store.lastScale = 1;
|
121
|
+
store.ratioCord = {
|
122
|
+
ratio: 1,
|
123
|
+
scaleX: 1,
|
124
|
+
scaleY: 1
|
125
|
+
}
|
126
|
+
};
|
@@ -0,0 +1,80 @@
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
2
|
+
__assign = Object.assign || function(t) {
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
+
s = arguments[i];
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
+
t[p] = s[p];
|
7
|
+
}
|
8
|
+
return t;
|
9
|
+
};
|
10
|
+
return __assign.apply(this, arguments);
|
11
|
+
};
|
12
|
+
import { default as mitt } from 'mitt';
|
13
|
+
import { Lock } from '../models';
|
14
|
+
import {DefalutOptions} from '../options';
|
15
|
+
import {s8} from '../utils';
|
16
|
+
import { commonStore } from './common'
|
17
|
+
export var createStore = function () {
|
18
|
+
return {
|
19
|
+
id: '',
|
20
|
+
data: {
|
21
|
+
pens: [],
|
22
|
+
lineName: 'curve',
|
23
|
+
fromArrowType: '',
|
24
|
+
toArrowType: 'triangleSolid',
|
25
|
+
scale: 1,
|
26
|
+
locked: Lock.None,
|
27
|
+
bkImageRect: null,
|
28
|
+
mqttOptions: {
|
29
|
+
clientId: s8()
|
30
|
+
},
|
31
|
+
dataConstruct: {}
|
32
|
+
},
|
33
|
+
pens: {},
|
34
|
+
options: { ...DefalutOptions },
|
35
|
+
emitter: mitt(),
|
36
|
+
cacheDatas: [],
|
37
|
+
dpiRatio: 1,
|
38
|
+
lastScale: 1,
|
39
|
+
ratioCord: {
|
40
|
+
ratio: 1,
|
41
|
+
scaleX: 1,
|
42
|
+
scaleY: 1
|
43
|
+
},
|
44
|
+
parentElem: null
|
45
|
+
};
|
46
|
+
};
|
47
|
+
export var useStore = function (id) {
|
48
|
+
if (id === void 0) { id = 'default'; }
|
49
|
+
if (!commonStore[id]) {
|
50
|
+
commonStore[id] = createStore();
|
51
|
+
commonStore[id].id = id;
|
52
|
+
}
|
53
|
+
return commonStore[id];
|
54
|
+
};
|
55
|
+
export var clearStore = function (store, del) {
|
56
|
+
store.lastScale = store.data.scale;
|
57
|
+
store.data = {
|
58
|
+
pens: [],
|
59
|
+
lineName: 'curve',
|
60
|
+
fromArrowType: '',
|
61
|
+
toArrowType: 'triangleSolid',
|
62
|
+
scale: 1,
|
63
|
+
locked: Lock.None,
|
64
|
+
bkImageRect: null,
|
65
|
+
mqttOptions: {
|
66
|
+
clientId: s8()
|
67
|
+
},
|
68
|
+
dataConstruct: {}
|
69
|
+
};
|
70
|
+
store.pens = {};
|
71
|
+
store.cacheDatas = [];
|
72
|
+
store.dpiRatio = 1;
|
73
|
+
store.lastScale = 1;
|
74
|
+
store.ratioCord = {
|
75
|
+
ratio: 1,
|
76
|
+
scaleX: 1,
|
77
|
+
scaleY: 1
|
78
|
+
};
|
79
|
+
if(del) delete commonStore[store.id];
|
80
|
+
};
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import {Node} from "../models";
|
2
|
+
|
3
|
+
export declare function setTagIdData(data: any): [];
|
4
|
+
export declare function setKpiAddrData(data: any): [];
|
5
|
+
export declare function setAssetIdData(data: any): [];
|
6
|
+
export declare function setAreaIdData(data: any): [];
|
7
|
+
export declare function setThreeCategoryIdData(pen: Node, data: any): [];
|
@@ -0,0 +1,54 @@
|
|
1
|
+
export function setTagIdData(data) {
|
2
|
+
return [{
|
3
|
+
"key": "tagId",
|
4
|
+
"value": data.tagId,
|
5
|
+
"isControlDis": data.isControlDis,
|
6
|
+
"type": data.tagType,
|
7
|
+
"tagVal": data.value,
|
8
|
+
"valExplain": data.valExplain,
|
9
|
+
"tagId": data.tagId
|
10
|
+
}, {
|
11
|
+
"key": "测点名称",
|
12
|
+
"value": data.tagName
|
13
|
+
}];
|
14
|
+
}
|
15
|
+
export function setKpiAddrData(data) {
|
16
|
+
return [{
|
17
|
+
"key": "kpiAddr",
|
18
|
+
"value": data.kpiId + '_' + data.kpiAddr,
|
19
|
+
"isControlDis": data.isControlDis,
|
20
|
+
"type": data.tagType
|
21
|
+
}, {
|
22
|
+
"key": "指标名称",
|
23
|
+
"value": data.kpiName
|
24
|
+
}];
|
25
|
+
}
|
26
|
+
export function setAssetIdData(data) {
|
27
|
+
return [{
|
28
|
+
"key": "assetId",
|
29
|
+
"value": data.id
|
30
|
+
}, {
|
31
|
+
"key": "资产名称",
|
32
|
+
"value": data.name
|
33
|
+
}];
|
34
|
+
}
|
35
|
+
export function setAreaIdData(data) {
|
36
|
+
return [{
|
37
|
+
"key": "areaId",
|
38
|
+
"value": data.id
|
39
|
+
}, {
|
40
|
+
"key": "区域名称",
|
41
|
+
"value": data.name
|
42
|
+
}];
|
43
|
+
}
|
44
|
+
export function setThreeCategoryIdData(pen, data) {
|
45
|
+
let params = [];
|
46
|
+
const hasThreeCategoryId = pen.data.find((tc) => {
|
47
|
+
return tc.key === 'threeCategoryId' && tc.value.includes(data.threeCategoryId);
|
48
|
+
});
|
49
|
+
if(!hasThreeCategoryId) params = [{
|
50
|
+
"key": "threeCategoryId",
|
51
|
+
"value": data.threeCategoryId
|
52
|
+
}];
|
53
|
+
return params;
|
54
|
+
}
|
package/core/src/utils/dom.d.ts
CHANGED
@@ -1,6 +1,7 @@
|
|
1
|
-
import { Node
|
1
|
+
import { Node } from '../models';
|
2
|
+
import { visualization2DStore } from '../store';
|
2
3
|
export declare let DomElements: {};
|
3
|
-
export declare function createChildrenDivByElementId(node: Node, data?:
|
4
|
-
export declare function setStyleForElementIdDiv(node: Node, elem: HTMLElement, data:
|
4
|
+
export declare function createChildrenDivByElementId(node: Node, data?: visualization2DStore): HTMLDivElement;
|
5
|
+
export declare function setStyleForElementIdDiv(node: Node, elem: HTMLElement, data: visualization2DStore): void;
|
5
6
|
export declare function createDiv(node: Node): HTMLDivElement;
|
6
7
|
export declare function loadJS(url: string, callback?: () => void, render?: boolean): void;
|
package/core/src/utils/dom.js
CHANGED
@@ -1,7 +1,9 @@
|
|
1
1
|
import { Store } from 'le5le-store';
|
2
2
|
import { Lock } from '../models'
|
3
|
+
import {commonStore} from '../store';
|
3
4
|
export let DomElements = {};
|
4
5
|
export function createChildrenDivByElementId(node, data) {
|
6
|
+
if(!data) data = commonStore[node.TID].data;
|
5
7
|
if (!DomElements[node.id]) {
|
6
8
|
DomElements[node.id] = document.getElementById(node.id);
|
7
9
|
if (DomElements[node.id]) {
|
package/package.json
CHANGED
@@ -1,26 +0,0 @@
|
|
1
|
-
import { Pen } from './pen';
|
2
|
-
import { Lock } from './status';
|
3
|
-
export declare class TopologyData {
|
4
|
-
pens: Pen[];
|
5
|
-
lineName: string;
|
6
|
-
fromArrowType: string;
|
7
|
-
toArrowType: string;
|
8
|
-
scale: number;
|
9
|
-
locked: Lock;
|
10
|
-
bkImage: string;
|
11
|
-
bkColor: string;
|
12
|
-
grid?: boolean;
|
13
|
-
websocket?: string;
|
14
|
-
mqttUrl?: string;
|
15
|
-
mqttOptions?: {
|
16
|
-
clientId?: string;
|
17
|
-
username?: string;
|
18
|
-
password?: string;
|
19
|
-
};
|
20
|
-
mqttTopics?: string;
|
21
|
-
manualCps?: boolean;
|
22
|
-
dataConstruct?: any;
|
23
|
-
data?: any;
|
24
|
-
bkImageRect?: any;
|
25
|
-
constructor(json?: any);
|
26
|
-
}
|