gisviewer-vue3-arcgis 1.0.274 → 1.0.276
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/es/src/gis-map/utils/dbscan-cluster/index.d.ts +2 -0
- package/es/src/gis-map/utils/dbscan-cluster/index.mjs +46 -22
- package/es/src/gis-map/utils/edpass-device-controller.d.ts +17 -2
- package/es/src/gis-map/utils/edpass-device-controller.mjs +166 -125
- package/es/src/types/index.d.ts +1 -0
- package/lib/src/gis-map/utils/dbscan-cluster/index.d.ts +2 -0
- package/lib/src/gis-map/utils/dbscan-cluster/index.js +1 -1
- package/lib/src/gis-map/utils/edpass-device-controller.d.ts +17 -2
- package/lib/src/gis-map/utils/edpass-device-controller.js +1 -1
- package/lib/src/types/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -8,6 +8,7 @@ export default class DbscanCluster {
|
|
|
8
8
|
private readonly minClusterPoints;
|
|
9
9
|
constructor(view: __esri.MapView | __esri.SceneView);
|
|
10
10
|
private zoomWatchHandle;
|
|
11
|
+
private scaleThreshold?;
|
|
11
12
|
private locations;
|
|
12
13
|
private clusteredLocations;
|
|
13
14
|
private clusterMarkUrl;
|
|
@@ -15,6 +16,7 @@ export default class DbscanCluster {
|
|
|
15
16
|
* 将地理位置转换为屏幕坐标
|
|
16
17
|
*/
|
|
17
18
|
private locationToScreen;
|
|
19
|
+
private currentStyle;
|
|
18
20
|
/**
|
|
19
21
|
* 添加聚类点到视图
|
|
20
22
|
* @param params
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { Point as
|
|
1
|
+
import { Point as n } from "@arcgis/core/geometry";
|
|
2
2
|
import m from "@arcgis/core/Graphic";
|
|
3
3
|
import p from "@arcgis/core/layers/GraphicsLayer";
|
|
4
4
|
class S {
|
|
5
5
|
constructor(t) {
|
|
6
|
-
this.maxClusterSymbolSize = 50, this.minClusterSymbolSize = 25, this.clusterRadius = 120, this.minClusterPoints = 2, this.zoomWatchHandle = null, this.locations = [], this.clusteredLocations = [], this.clusterMarkUrl = "", this.view = t, this.clusterLayer = new p(), this.view.map.add(this.clusterLayer);
|
|
6
|
+
this.maxClusterSymbolSize = 50, this.minClusterSymbolSize = 25, this.clusterRadius = 120, this.minClusterPoints = 2, this.zoomWatchHandle = null, this.locations = [], this.clusteredLocations = [], this.clusterMarkUrl = "", this.currentStyle = "cluster", this.view = t, this.clusterLayer = new p(), this.view.map.add(this.clusterLayer);
|
|
7
7
|
}
|
|
8
8
|
/**
|
|
9
9
|
* 将地理位置转换为屏幕坐标
|
|
@@ -11,7 +11,7 @@ class S {
|
|
|
11
11
|
locationToScreen() {
|
|
12
12
|
this.clusteredLocations = [], this.locations.forEach((t) => {
|
|
13
13
|
const s = this.view.toScreen(
|
|
14
|
-
new
|
|
14
|
+
new n({ x: t.x, y: t.y })
|
|
15
15
|
);
|
|
16
16
|
s.x > 0 && s.y > 0 && (t.properties.screenX = s.x, t.properties.screenY = s.y, t.visited = !1, t.clusterId = void 0, this.clusteredLocations.push(t));
|
|
17
17
|
});
|
|
@@ -22,7 +22,7 @@ class S {
|
|
|
22
22
|
*/
|
|
23
23
|
addClusterPoints(t) {
|
|
24
24
|
var r;
|
|
25
|
-
this.locations = t.points, this.clusterMarkUrl = ((r = t.clusterSymbol) == null ? void 0 : r.url) || "/GisViewerAssets/Images/cross/gis_xhj_blue.png", this.locations = this.locations.filter((e) => e.x !== null && e.y !== null && !isNaN(e.x) && !isNaN(e.y)), this.locations.forEach((e) => {
|
|
25
|
+
this.locations = t.points, this.scaleThreshold = t.scaleThreshold, this.clusterMarkUrl = ((r = t.clusterSymbol) == null ? void 0 : r.url) || "/GisViewerAssets/Images/cross/gis_xhj_blue.png", this.locations = this.locations.filter((e) => e.x !== null && e.y !== null && !isNaN(e.x) && !isNaN(e.y)), this.locations.forEach((e) => {
|
|
26
26
|
e.x = Number(e.x), e.y = Number(e.y), e.symbol || (e.symbol = t.pointSymbol || {
|
|
27
27
|
type: "simple-marker",
|
|
28
28
|
style: "circle",
|
|
@@ -34,14 +34,38 @@ class S {
|
|
|
34
34
|
}
|
|
35
35
|
});
|
|
36
36
|
}), this.zoomWatchHandle || (this.zoomWatchHandle = this.view.watch("stationary", () => {
|
|
37
|
-
if (this.view.stationary)
|
|
38
|
-
this.
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
37
|
+
if (this.view.stationary)
|
|
38
|
+
if (this.scaleThreshold) {
|
|
39
|
+
if (this.view.scale < this.scaleThreshold && this.currentStyle === "cluster")
|
|
40
|
+
this.currentStyle = "normal", this.clusterLayer.removeAll(), this.locations.forEach((e) => {
|
|
41
|
+
const i = new m({
|
|
42
|
+
geometry: new n({ x: e.x, y: e.y }),
|
|
43
|
+
attributes: {
|
|
44
|
+
...e,
|
|
45
|
+
...e.properties,
|
|
46
|
+
type: "clusterPoint",
|
|
47
|
+
id: e.id
|
|
48
|
+
},
|
|
49
|
+
symbol: e.symbol
|
|
50
|
+
});
|
|
51
|
+
this.clusterLayer.add(i);
|
|
52
|
+
});
|
|
53
|
+
else if (this.view.scale > this.scaleThreshold) {
|
|
54
|
+
this.currentStyle = "cluster", this.locationToScreen();
|
|
55
|
+
const e = this.doPixelCluster(
|
|
56
|
+
this.clusterRadius,
|
|
57
|
+
this.minClusterPoints
|
|
58
|
+
);
|
|
59
|
+
this.showClusters(e);
|
|
60
|
+
}
|
|
61
|
+
} else {
|
|
62
|
+
this.locationToScreen();
|
|
63
|
+
const e = this.doPixelCluster(
|
|
64
|
+
this.clusterRadius,
|
|
65
|
+
this.minClusterPoints
|
|
66
|
+
);
|
|
67
|
+
this.showClusters(e);
|
|
68
|
+
}
|
|
45
69
|
})), this.locationToScreen();
|
|
46
70
|
const s = this.doPixelCluster(
|
|
47
71
|
this.clusterRadius,
|
|
@@ -62,8 +86,8 @@ class S {
|
|
|
62
86
|
if (e.id !== -1) {
|
|
63
87
|
let i = r === s ? (this.maxClusterSymbolSize + this.minClusterSymbolSize) / 2 : this.minClusterSymbolSize + (e.count - r) / (s - r) * (this.maxClusterSymbolSize - this.minClusterSymbolSize);
|
|
64
88
|
i *= 0.75;
|
|
65
|
-
const
|
|
66
|
-
geometry: new
|
|
89
|
+
const c = (e.count.toString().length * 8 + 6) / 2, u = new m({
|
|
90
|
+
geometry: new n({ x: e.center.x, y: e.center.y }),
|
|
67
91
|
attributes: {
|
|
68
92
|
count: e.count
|
|
69
93
|
},
|
|
@@ -102,11 +126,11 @@ class S {
|
|
|
102
126
|
geometry: {
|
|
103
127
|
rings: [
|
|
104
128
|
[
|
|
105
|
-
[-
|
|
106
|
-
[
|
|
107
|
-
[
|
|
108
|
-
[-
|
|
109
|
-
[-
|
|
129
|
+
[-c, 40],
|
|
130
|
+
[c, 40],
|
|
131
|
+
[c, 20],
|
|
132
|
+
[-c, 20],
|
|
133
|
+
[-c, 40]
|
|
110
134
|
]
|
|
111
135
|
]
|
|
112
136
|
},
|
|
@@ -175,11 +199,11 @@ class S {
|
|
|
175
199
|
}
|
|
176
200
|
}
|
|
177
201
|
});
|
|
178
|
-
this.clusterLayer.add(
|
|
202
|
+
this.clusterLayer.add(u);
|
|
179
203
|
} else
|
|
180
204
|
e.items.forEach((i) => {
|
|
181
205
|
const o = new m({
|
|
182
|
-
geometry: new
|
|
206
|
+
geometry: new n({ x: i.x, y: i.y }),
|
|
183
207
|
attributes: {
|
|
184
208
|
...i,
|
|
185
209
|
...i.properties,
|
|
@@ -223,7 +247,7 @@ class S {
|
|
|
223
247
|
for (const e of this.clusteredLocations)
|
|
224
248
|
e.clusterId === void 0 || e.clusterId === -1 ? s.push(e) : (t[e.clusterId] || (t[e.clusterId] = []), t[e.clusterId].push(e));
|
|
225
249
|
const r = Object.keys(t).map((e, i) => {
|
|
226
|
-
const o = t[Number(e)], l = o.length,
|
|
250
|
+
const o = t[Number(e)], l = o.length, c = o.reduce((h, a) => h + a.x, 0), u = o.reduce((h, a) => h + a.y, 0), y = c / l, d = u / l;
|
|
227
251
|
return {
|
|
228
252
|
id: Number(e),
|
|
229
253
|
items: o,
|
|
@@ -6,11 +6,26 @@ export default class EdpassDeviceController {
|
|
|
6
6
|
private kkNormalLayer;
|
|
7
7
|
private kkAbnormalLayer;
|
|
8
8
|
private mapInitializer;
|
|
9
|
+
private readonly clusterScaleThreshold;
|
|
9
10
|
private watchHandle;
|
|
10
|
-
private
|
|
11
|
-
private
|
|
11
|
+
private currentShowParams;
|
|
12
|
+
private isCameraVisible;
|
|
13
|
+
private isKkVisible;
|
|
14
|
+
private clusterEnabled;
|
|
12
15
|
constructor(view: __esri.MapView | __esri.SceneView);
|
|
13
16
|
setEdpassLayerVisibility(params: IShowEdpassDeviceParams): Promise<IResult>;
|
|
17
|
+
/**
|
|
18
|
+
* 控制散点图层显示隐藏
|
|
19
|
+
* @param visible
|
|
20
|
+
*/
|
|
21
|
+
private showScatter;
|
|
14
22
|
private getLayerConfig;
|
|
23
|
+
private getAutoStyleByScale;
|
|
24
|
+
private updateClusterEnabled;
|
|
25
|
+
private ensureStationaryWatch;
|
|
26
|
+
private hasAnyClusterEnabled;
|
|
27
|
+
private tryRemoveWatchIfNoVisible;
|
|
28
|
+
private applyScatterMode;
|
|
29
|
+
private applyClusterMode;
|
|
15
30
|
private showClusterInExtent;
|
|
16
31
|
}
|
|
@@ -1,22 +1,27 @@
|
|
|
1
|
-
import * as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import { toRaw as
|
|
5
|
-
import
|
|
6
|
-
class
|
|
1
|
+
import * as b from "@arcgis/core/core/reactiveUtils.js";
|
|
2
|
+
import d from "@arcgis/core/Graphic";
|
|
3
|
+
import c from "@arcgis/core/layers/GraphicsLayer";
|
|
4
|
+
import { toRaw as u } from "vue";
|
|
5
|
+
import k from "../stores/index.mjs";
|
|
6
|
+
class w {
|
|
7
7
|
constructor(e) {
|
|
8
|
-
this.watchHandle = null, this.
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
this.clusterScaleThreshold = 5e3, this.watchHandle = null, this.currentShowParams = null, this.isCameraVisible = !1, this.isKkVisible = !1, this.clusterEnabled = {
|
|
9
|
+
cameraNormal: !1,
|
|
10
|
+
cameraAbnormal: !1,
|
|
11
|
+
kkNormal: !1,
|
|
12
|
+
kkAbnormal: !1
|
|
13
|
+
}, this.view = e;
|
|
14
|
+
const t = k.useAppDataStore;
|
|
15
|
+
this.mapInitializer = u(t.mapInitializer), this.cameraNormalLayer = new c({
|
|
11
16
|
id: "cameraNormalLayer",
|
|
12
17
|
visible: !1
|
|
13
|
-
}), this.cameraAbnormalLayer = new
|
|
18
|
+
}), this.cameraAbnormalLayer = new c({
|
|
14
19
|
id: "cameraAbnormalLayer",
|
|
15
20
|
visible: !1
|
|
16
|
-
}), this.kkNormalLayer = new
|
|
21
|
+
}), this.kkNormalLayer = new c({
|
|
17
22
|
id: "kkNormalLayer",
|
|
18
23
|
visible: !1
|
|
19
|
-
}), this.kkAbnormalLayer = new
|
|
24
|
+
}), this.kkAbnormalLayer = new c({
|
|
20
25
|
id: "kkAbnormalLayer",
|
|
21
26
|
visible: !1
|
|
22
27
|
}), this.view.map.addMany([
|
|
@@ -27,78 +32,44 @@ class I {
|
|
|
27
32
|
]);
|
|
28
33
|
}
|
|
29
34
|
async setEdpassLayerVisibility(e) {
|
|
30
|
-
|
|
31
|
-
|
|
35
|
+
if (this.currentShowParams = {
|
|
36
|
+
...this.currentShowParams ?? {},
|
|
37
|
+
...e
|
|
38
|
+
}, e.deviceType !== "camera" && e.deviceType !== "kk")
|
|
32
39
|
return { status: -1, message: "不支持的设备类型" };
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
this.mapInitializer.setLayerVisibility({
|
|
41
|
-
id: `${e.deviceType}-normal`,
|
|
42
|
-
visible: e.visible
|
|
43
|
-
}), this.mapInitializer.setLayerVisibility({
|
|
44
|
-
id: `${e.deviceType}-abnormal`,
|
|
45
|
-
visible: e.visible
|
|
46
|
-
});
|
|
40
|
+
e.deviceType === "camera" && (this.isCameraVisible = e.visible), e.deviceType === "kk" && (this.isKkVisible = e.visible), this.updateClusterEnabled(e);
|
|
41
|
+
const t = e.style ?? this.getAutoStyleByScale();
|
|
42
|
+
switch (t === "cluster" || e.style == null ? this.ensureStationaryWatch() : this.tryRemoveWatchIfNoVisible(), t) {
|
|
43
|
+
case "scatter": {
|
|
44
|
+
this.applyScatterMode(), this.tryRemoveWatchIfNoVisible();
|
|
45
|
+
break;
|
|
46
|
+
}
|
|
47
47
|
case "cluster": {
|
|
48
|
-
|
|
49
|
-
i.visible = e.visible, this.currentDdCode = e.ddCode || "", this.currentZdCode = e.zdCode || "", e.visible ? (await this.showClusterInExtent(e, this.view.extent), this.watchHandle || (this.watchHandle = h.when(
|
|
50
|
-
() => this.view.stationary,
|
|
51
|
-
async () => {
|
|
52
|
-
this.cameraNormalLayer.visible && await this.showClusterInExtent(
|
|
53
|
-
{
|
|
54
|
-
deviceType: "camera",
|
|
55
|
-
deviceState: "normal",
|
|
56
|
-
style: "cluster",
|
|
57
|
-
ddCode: this.currentDdCode,
|
|
58
|
-
zdCode: this.currentZdCode,
|
|
59
|
-
visible: !0
|
|
60
|
-
},
|
|
61
|
-
this.view.extent
|
|
62
|
-
), this.cameraAbnormalLayer.visible && await this.showClusterInExtent(
|
|
63
|
-
{
|
|
64
|
-
deviceType: "camera",
|
|
65
|
-
deviceState: "abnormal",
|
|
66
|
-
style: "cluster",
|
|
67
|
-
ddCode: this.currentDdCode,
|
|
68
|
-
zdCode: this.currentZdCode,
|
|
69
|
-
visible: !0
|
|
70
|
-
},
|
|
71
|
-
this.view.extent
|
|
72
|
-
), this.kkNormalLayer.visible && await this.showClusterInExtent(
|
|
73
|
-
{
|
|
74
|
-
deviceType: "kk",
|
|
75
|
-
deviceState: "normal",
|
|
76
|
-
style: "cluster",
|
|
77
|
-
ddCode: this.currentDdCode,
|
|
78
|
-
zdCode: this.currentZdCode,
|
|
79
|
-
visible: !0
|
|
80
|
-
},
|
|
81
|
-
this.view.extent
|
|
82
|
-
), this.kkAbnormalLayer.visible && await this.showClusterInExtent(
|
|
83
|
-
{
|
|
84
|
-
deviceType: "kk",
|
|
85
|
-
deviceState: "abnormal",
|
|
86
|
-
style: "cluster",
|
|
87
|
-
ddCode: this.currentDdCode,
|
|
88
|
-
zdCode: this.currentZdCode,
|
|
89
|
-
visible: !0
|
|
90
|
-
},
|
|
91
|
-
this.view.extent
|
|
92
|
-
);
|
|
93
|
-
}
|
|
94
|
-
))) : (i.removeAll(), !this.cameraNormalLayer.visible && !this.cameraAbnormalLayer.visible && !this.kkNormalLayer.visible && !this.kkAbnormalLayer.visible && ((t = this.watchHandle) == null || t.remove(), this.watchHandle = null));
|
|
48
|
+
await this.applyClusterMode();
|
|
95
49
|
break;
|
|
96
50
|
}
|
|
97
51
|
}
|
|
98
|
-
return {
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
52
|
+
return { status: 0, message: "Success" };
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* 控制散点图层显示隐藏
|
|
56
|
+
* @param visible
|
|
57
|
+
*/
|
|
58
|
+
showScatter(e) {
|
|
59
|
+
const t = e ?? this.isCameraVisible, i = e ?? this.isKkVisible;
|
|
60
|
+
this.mapInitializer.setLayerVisibility({
|
|
61
|
+
id: "camera-normal",
|
|
62
|
+
visible: t
|
|
63
|
+
}), this.mapInitializer.setLayerVisibility({
|
|
64
|
+
id: "camera-abnormal",
|
|
65
|
+
visible: t
|
|
66
|
+
}), this.mapInitializer.setLayerVisibility({
|
|
67
|
+
id: "kk-normal",
|
|
68
|
+
visible: i
|
|
69
|
+
}), this.mapInitializer.setLayerVisibility({
|
|
70
|
+
id: "kk-abnormal",
|
|
71
|
+
visible: i
|
|
72
|
+
});
|
|
102
73
|
}
|
|
103
74
|
getLayerConfig(e) {
|
|
104
75
|
let t, i, a;
|
|
@@ -108,6 +79,92 @@ class I {
|
|
|
108
79
|
deviceLayer: a
|
|
109
80
|
};
|
|
110
81
|
}
|
|
82
|
+
getAutoStyleByScale() {
|
|
83
|
+
return this.view.scale > this.clusterScaleThreshold ? "cluster" : "scatter";
|
|
84
|
+
}
|
|
85
|
+
updateClusterEnabled(e) {
|
|
86
|
+
const t = e.deviceState;
|
|
87
|
+
e.deviceType === "camera" ? t ? t === "normal" ? this.clusterEnabled.cameraNormal = e.visible : this.clusterEnabled.cameraAbnormal = e.visible : (this.clusterEnabled.cameraNormal = e.visible, this.clusterEnabled.cameraAbnormal = e.visible) : t ? t === "normal" ? this.clusterEnabled.kkNormal = e.visible : this.clusterEnabled.kkAbnormal = e.visible : (this.clusterEnabled.kkNormal = e.visible, this.clusterEnabled.kkAbnormal = e.visible);
|
|
88
|
+
}
|
|
89
|
+
ensureStationaryWatch() {
|
|
90
|
+
this.watchHandle || (this.watchHandle = b.when(
|
|
91
|
+
() => this.view.stationary,
|
|
92
|
+
async () => {
|
|
93
|
+
if (!this.currentShowParams)
|
|
94
|
+
return;
|
|
95
|
+
if ((this.currentShowParams.style ?? this.getAutoStyleByScale()) === "scatter") {
|
|
96
|
+
this.applyScatterMode();
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
await this.applyClusterMode();
|
|
100
|
+
}
|
|
101
|
+
));
|
|
102
|
+
}
|
|
103
|
+
hasAnyClusterEnabled() {
|
|
104
|
+
return this.clusterEnabled.cameraNormal || this.clusterEnabled.cameraAbnormal || this.clusterEnabled.kkNormal || this.clusterEnabled.kkAbnormal;
|
|
105
|
+
}
|
|
106
|
+
tryRemoveWatchIfNoVisible() {
|
|
107
|
+
var i;
|
|
108
|
+
const e = this.isCameraVisible || this.isKkVisible, t = this.hasAnyClusterEnabled();
|
|
109
|
+
!e && !t && ((i = this.watchHandle) == null || i.remove(), this.watchHandle = null);
|
|
110
|
+
}
|
|
111
|
+
applyScatterMode() {
|
|
112
|
+
this.showScatter(), this.cameraNormalLayer.visible = !1, this.cameraAbnormalLayer.visible = !1, this.kkNormalLayer.visible = !1, this.kkAbnormalLayer.visible = !1, this.cameraNormalLayer.removeAll(), this.cameraAbnormalLayer.removeAll(), this.kkNormalLayer.removeAll(), this.kkAbnormalLayer.removeAll();
|
|
113
|
+
}
|
|
114
|
+
async applyClusterMode() {
|
|
115
|
+
var l, r;
|
|
116
|
+
this.showScatter(!1);
|
|
117
|
+
const e = ((l = this.currentShowParams) == null ? void 0 : l.ddCode) || "", t = ((r = this.currentShowParams) == null ? void 0 : r.zdCode) || "", i = this.view.extent, a = [];
|
|
118
|
+
this.cameraNormalLayer.visible = this.clusterEnabled.cameraNormal, this.clusterEnabled.cameraNormal ? a.push(
|
|
119
|
+
this.showClusterInExtent(
|
|
120
|
+
{
|
|
121
|
+
deviceType: "camera",
|
|
122
|
+
deviceState: "normal",
|
|
123
|
+
style: "cluster",
|
|
124
|
+
ddCode: e,
|
|
125
|
+
zdCode: t,
|
|
126
|
+
visible: !0
|
|
127
|
+
},
|
|
128
|
+
i
|
|
129
|
+
)
|
|
130
|
+
) : this.cameraNormalLayer.removeAll(), this.cameraAbnormalLayer.visible = this.clusterEnabled.cameraAbnormal, this.clusterEnabled.cameraAbnormal ? a.push(
|
|
131
|
+
this.showClusterInExtent(
|
|
132
|
+
{
|
|
133
|
+
deviceType: "camera",
|
|
134
|
+
deviceState: "abnormal",
|
|
135
|
+
style: "cluster",
|
|
136
|
+
ddCode: e,
|
|
137
|
+
zdCode: t,
|
|
138
|
+
visible: !0
|
|
139
|
+
},
|
|
140
|
+
i
|
|
141
|
+
)
|
|
142
|
+
) : this.cameraAbnormalLayer.removeAll(), this.kkNormalLayer.visible = this.clusterEnabled.kkNormal, this.clusterEnabled.kkNormal ? a.push(
|
|
143
|
+
this.showClusterInExtent(
|
|
144
|
+
{
|
|
145
|
+
deviceType: "kk",
|
|
146
|
+
deviceState: "normal",
|
|
147
|
+
style: "cluster",
|
|
148
|
+
ddCode: e,
|
|
149
|
+
zdCode: t,
|
|
150
|
+
visible: !0
|
|
151
|
+
},
|
|
152
|
+
i
|
|
153
|
+
)
|
|
154
|
+
) : this.kkNormalLayer.removeAll(), this.kkAbnormalLayer.visible = this.clusterEnabled.kkAbnormal, this.clusterEnabled.kkAbnormal ? a.push(
|
|
155
|
+
this.showClusterInExtent(
|
|
156
|
+
{
|
|
157
|
+
deviceType: "kk",
|
|
158
|
+
deviceState: "abnormal",
|
|
159
|
+
style: "cluster",
|
|
160
|
+
ddCode: e,
|
|
161
|
+
zdCode: t,
|
|
162
|
+
visible: !0
|
|
163
|
+
},
|
|
164
|
+
i
|
|
165
|
+
)
|
|
166
|
+
) : this.kkAbnormalLayer.removeAll(), await Promise.all(a), this.tryRemoveWatchIfNoVisible();
|
|
167
|
+
}
|
|
111
168
|
async showClusterInExtent(e, t) {
|
|
112
169
|
const i = await fetch("/es/queryGeoAggregation", {
|
|
113
170
|
method: "POST",
|
|
@@ -133,33 +190,32 @@ class I {
|
|
|
133
190
|
const a = await i.json();
|
|
134
191
|
if (a.code !== 200)
|
|
135
192
|
return;
|
|
136
|
-
const { icon:
|
|
137
|
-
|
|
138
|
-
const
|
|
139
|
-
var
|
|
140
|
-
const
|
|
193
|
+
const { icon: l, color: r, deviceLayer: m } = this.getLayerConfig(e);
|
|
194
|
+
m.removeAll();
|
|
195
|
+
const y = a.data.map((s) => {
|
|
196
|
+
var h;
|
|
197
|
+
const o = (s.count.toString().length * 6 + 6) / 2, n = new d({
|
|
141
198
|
geometry: {
|
|
142
199
|
type: "point",
|
|
143
|
-
x:
|
|
144
|
-
y:
|
|
200
|
+
x: s.lon,
|
|
201
|
+
y: s.lat
|
|
145
202
|
},
|
|
146
203
|
attributes: {
|
|
147
|
-
id: ((
|
|
204
|
+
id: ((h = s.devInfo) == null ? void 0 : h.deviceId) || s.key,
|
|
148
205
|
type: e.deviceType,
|
|
149
|
-
count:
|
|
206
|
+
count: s.count,
|
|
150
207
|
typeName: e.deviceType === "camera" ? "视频" : "卡口",
|
|
151
208
|
stateName: e.deviceState === "normal" ? "正常" : "异常",
|
|
152
|
-
...
|
|
209
|
+
...s.devInfo
|
|
153
210
|
}
|
|
154
211
|
});
|
|
155
|
-
return
|
|
212
|
+
return s.count > 1 ? n.symbol = {
|
|
156
213
|
type: "cim",
|
|
157
214
|
data: {
|
|
158
215
|
type: "CIMSymbolReference",
|
|
159
216
|
symbol: {
|
|
160
217
|
type: "CIMPointSymbol",
|
|
161
218
|
symbolLayers: [
|
|
162
|
-
// 聚合数量
|
|
163
219
|
{
|
|
164
220
|
type: "CIMVectorMarker",
|
|
165
221
|
size: 32,
|
|
@@ -167,17 +223,16 @@ class I {
|
|
|
167
223
|
anchorPointUnits: "Relative",
|
|
168
224
|
frame: { xmin: -16, ymin: -16, xmax: 16, ymax: 16 },
|
|
169
225
|
markerGraphics: [
|
|
170
|
-
// 数量文本框
|
|
171
226
|
{
|
|
172
227
|
type: "CIMMarkerGraphic",
|
|
173
228
|
geometry: {
|
|
174
229
|
rings: [
|
|
175
230
|
[
|
|
176
|
-
[-
|
|
177
|
-
[
|
|
178
|
-
[
|
|
179
|
-
[-
|
|
180
|
-
[-
|
|
231
|
+
[-o, 30],
|
|
232
|
+
[o, 30],
|
|
233
|
+
[o, 15],
|
|
234
|
+
[-o, 15],
|
|
235
|
+
[-o, 30]
|
|
181
236
|
]
|
|
182
237
|
]
|
|
183
238
|
},
|
|
@@ -187,18 +242,17 @@ class I {
|
|
|
187
242
|
{
|
|
188
243
|
type: "CIMSolidFill",
|
|
189
244
|
enable: !0,
|
|
190
|
-
color:
|
|
245
|
+
color: r.concat([255])
|
|
191
246
|
},
|
|
192
247
|
{
|
|
193
248
|
type: "CIMSolidStroke",
|
|
194
249
|
enable: !0,
|
|
195
250
|
width: 3,
|
|
196
|
-
color:
|
|
251
|
+
color: r.concat([128])
|
|
197
252
|
}
|
|
198
253
|
]
|
|
199
254
|
}
|
|
200
255
|
},
|
|
201
|
-
// 数量文字
|
|
202
256
|
{
|
|
203
257
|
type: "CIMMarkerGraphic",
|
|
204
258
|
primitiveName: "textGraphic",
|
|
@@ -222,13 +276,12 @@ class I {
|
|
|
222
276
|
},
|
|
223
277
|
verticalAlignment: "Center"
|
|
224
278
|
},
|
|
225
|
-
textString:
|
|
279
|
+
textString: s.count.toString()
|
|
226
280
|
}
|
|
227
281
|
],
|
|
228
282
|
scaleSymbolsProportionally: !0,
|
|
229
283
|
respectFrame: !0
|
|
230
284
|
},
|
|
231
|
-
// 聚合图标
|
|
232
285
|
{
|
|
233
286
|
type: "CIMPictureMarker",
|
|
234
287
|
enable: !0,
|
|
@@ -240,46 +293,34 @@ class I {
|
|
|
240
293
|
size: 24,
|
|
241
294
|
rotateClockwise: !0,
|
|
242
295
|
textureFilter: "Picture",
|
|
243
|
-
url:
|
|
296
|
+
url: l
|
|
244
297
|
}
|
|
245
298
|
]
|
|
246
299
|
}
|
|
247
300
|
}
|
|
248
|
-
} : (
|
|
301
|
+
} : (n.symbol = {
|
|
249
302
|
type: "picture-marker",
|
|
250
|
-
url:
|
|
303
|
+
url: l,
|
|
251
304
|
width: 18,
|
|
252
305
|
height: 18
|
|
253
|
-
},
|
|
306
|
+
}, n.popupTemplate = {
|
|
254
307
|
title: "视频信息",
|
|
255
308
|
content: [
|
|
256
309
|
{
|
|
257
310
|
type: "fields",
|
|
258
311
|
fieldInfos: [
|
|
259
|
-
{
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
}
|
|
263
|
-
{
|
|
264
|
-
fieldName: "deviceName",
|
|
265
|
-
label: "设备名称"
|
|
266
|
-
},
|
|
267
|
-
{
|
|
268
|
-
fieldName: "typeName",
|
|
269
|
-
label: "设备类型"
|
|
270
|
-
},
|
|
271
|
-
{
|
|
272
|
-
fieldName: "stateName",
|
|
273
|
-
label: "设备状态"
|
|
274
|
-
}
|
|
312
|
+
{ fieldName: "deviceId", label: "设备编号" },
|
|
313
|
+
{ fieldName: "deviceName", label: "设备名称" },
|
|
314
|
+
{ fieldName: "typeName", label: "设备类型" },
|
|
315
|
+
{ fieldName: "stateName", label: "设备状态" }
|
|
275
316
|
]
|
|
276
317
|
}
|
|
277
318
|
]
|
|
278
|
-
}),
|
|
319
|
+
}), n;
|
|
279
320
|
});
|
|
280
|
-
|
|
321
|
+
m.addMany(y);
|
|
281
322
|
}
|
|
282
323
|
}
|
|
283
324
|
export {
|
|
284
|
-
|
|
325
|
+
w as default
|
|
285
326
|
};
|
package/es/src/types/index.d.ts
CHANGED
|
@@ -8,6 +8,7 @@ export default class DbscanCluster {
|
|
|
8
8
|
private readonly minClusterPoints;
|
|
9
9
|
constructor(view: __esri.MapView | __esri.SceneView);
|
|
10
10
|
private zoomWatchHandle;
|
|
11
|
+
private scaleThreshold?;
|
|
11
12
|
private locations;
|
|
12
13
|
private clusteredLocations;
|
|
13
14
|
private clusterMarkUrl;
|
|
@@ -15,6 +16,7 @@ export default class DbscanCluster {
|
|
|
15
16
|
* 将地理位置转换为屏幕坐标
|
|
16
17
|
*/
|
|
17
18
|
private locationToScreen;
|
|
19
|
+
private currentStyle;
|
|
18
20
|
/**
|
|
19
21
|
* 添加聚类点到视图
|
|
20
22
|
* @param params
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@arcgis/core/geometry"),y=require("@arcgis/core/Graphic"),p=require("@arcgis/core/layers/GraphicsLayer");class f{constructor(t){this.maxClusterSymbolSize=50,this.minClusterSymbolSize=25,this.clusterRadius=120,this.minClusterPoints=2,this.zoomWatchHandle=null,this.locations=[],this.clusteredLocations=[],this.clusterMarkUrl="",this.currentStyle="cluster",this.view=t,this.clusterLayer=new p,this.view.map.add(this.clusterLayer)}locationToScreen(){this.clusteredLocations=[],this.locations.forEach(t=>{const s=this.view.toScreen(new c.Point({x:t.x,y:t.y}));s.x>0&&s.y>0&&(t.properties.screenX=s.x,t.properties.screenY=s.y,t.visited=!1,t.clusterId=void 0,this.clusteredLocations.push(t))})}addClusterPoints(t){var r;this.locations=t.points,this.scaleThreshold=t.scaleThreshold,this.clusterMarkUrl=((r=t.clusterSymbol)==null?void 0:r.url)||"/GisViewerAssets/Images/cross/gis_xhj_blue.png",this.locations=this.locations.filter(e=>e.x!==null&&e.y!==null&&!isNaN(e.x)&&!isNaN(e.y)),this.locations.forEach(e=>{e.x=Number(e.x),e.y=Number(e.y),e.symbol||(e.symbol=t.pointSymbol||{type:"simple-marker",style:"circle",color:"#3388ff",size:8,outline:{color:"#ffffff",width:1}})}),this.zoomWatchHandle||(this.zoomWatchHandle=this.view.watch("stationary",()=>{if(this.view.stationary)if(this.scaleThreshold){if(this.view.scale<this.scaleThreshold&&this.currentStyle==="cluster")this.currentStyle="normal",this.clusterLayer.removeAll(),this.locations.forEach(e=>{const i=new y({geometry:new c.Point({x:e.x,y:e.y}),attributes:{...e,...e.properties,type:"clusterPoint",id:e.id},symbol:e.symbol});this.clusterLayer.add(i)});else if(this.view.scale>this.scaleThreshold){this.currentStyle="cluster",this.locationToScreen();const e=this.doPixelCluster(this.clusterRadius,this.minClusterPoints);this.showClusters(e)}}else{this.locationToScreen();const e=this.doPixelCluster(this.clusterRadius,this.minClusterPoints);this.showClusters(e)}})),this.locationToScreen();const s=this.doPixelCluster(this.clusterRadius,this.minClusterPoints);this.showClusters(s)}removeAllClusterPoints(){var t;(t=this.zoomWatchHandle)==null||t.remove(),this.zoomWatchHandle=null,this.clusterLayer.removeAll()}showClusters(t){this.clusterLayer.removeAll();let s=Number.MIN_VALUE,r=Number.MAX_VALUE;t.forEach(e=>{e.count>1&&(r=Math.min(r,e.count),s=Math.max(s,e.count))}),t.forEach(e=>{if(e.id!==-1){let i=r===s?(this.maxClusterSymbolSize+this.minClusterSymbolSize)/2:this.minClusterSymbolSize+(e.count-r)/(s-r)*(this.maxClusterSymbolSize-this.minClusterSymbolSize);i*=.75;const n=(e.count.toString().length*8+6)/2,u=new y({geometry:new c.Point({x:e.center.x,y:e.center.y}),attributes:{count:e.count},symbol:{type:"cim",data:{type:"CIMSymbolReference",primitiveOverrides:[{type:"CIMPrimitiveOverride",primitiveName:"textGraphic",propertyName:"TextString",valueExpressionInfo:{type:"CIMExpressionInfo",title:"Custom",expression:"$feature.count",returnType:"Default"}}],symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:i,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",geometry:{rings:[[[-n,40],[n,40],[n,20],[-n,20],[-n,40]]]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[2,72,200,255]},{type:"CIMSolidStroke",enable:!0,width:5,color:[2,72,200,128]}]}},{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",height:16,horizontalAlignment:"Center",offsetX:0,offsetY:30,symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},verticalAlignment:"Center"},textString:""}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:i,rotateClockwise:!0,textureFilter:"Picture",url:this.clusterMarkUrl}]}}}});this.clusterLayer.add(u)}else e.items.forEach(i=>{const o=new y({geometry:new c.Point({x:i.x,y:i.y}),attributes:{...i,...i.properties,type:"clusterPoint",id:i.id},symbol:i.symbol});this.clusterLayer.add(o)})})}getNeighbors(t,s){return this.clusteredLocations.filter(r=>r.id===t.id||r.visited?!1:this.getDistance(t,r)<=s)}getDistance(t,s){return Math.sqrt(Math.pow(t.properties.screenX-s.properties.screenX,2)+Math.pow(t.properties.screenY-s.properties.screenY,2))}createClusters(){const t={},s=[];for(const e of this.clusteredLocations)e.clusterId===void 0||e.clusterId===-1?s.push(e):(t[e.clusterId]||(t[e.clusterId]=[]),t[e.clusterId].push(e));const r=Object.keys(t).map((e,i)=>{const o=t[Number(e)],l=o.length,n=o.reduce((h,a)=>h+a.x,0),u=o.reduce((h,a)=>h+a.y,0),m=n/l,d=u/l;return{id:Number(e),items:o,count:l,center:{x:m,y:d}}});return s.length>0&&r.push({id:-1,items:s,count:s.length,center:null}),r}doPixelCluster(t,s){let r=0;for(let e=0;e<this.clusteredLocations.length;e++){const i=this.clusteredLocations[e];if(i.visited)continue;i.visited=!0;const o=this.getNeighbors(i,t);o.length<s?i.clusterId=-1:(o.forEach(l=>{l.visited=!0,l.clusterId=r}),i.clusterId=r,r++)}return this.createClusters()}}exports.default=f;
|
|
@@ -6,11 +6,26 @@ export default class EdpassDeviceController {
|
|
|
6
6
|
private kkNormalLayer;
|
|
7
7
|
private kkAbnormalLayer;
|
|
8
8
|
private mapInitializer;
|
|
9
|
+
private readonly clusterScaleThreshold;
|
|
9
10
|
private watchHandle;
|
|
10
|
-
private
|
|
11
|
-
private
|
|
11
|
+
private currentShowParams;
|
|
12
|
+
private isCameraVisible;
|
|
13
|
+
private isKkVisible;
|
|
14
|
+
private clusterEnabled;
|
|
12
15
|
constructor(view: __esri.MapView | __esri.SceneView);
|
|
13
16
|
setEdpassLayerVisibility(params: IShowEdpassDeviceParams): Promise<IResult>;
|
|
17
|
+
/**
|
|
18
|
+
* 控制散点图层显示隐藏
|
|
19
|
+
* @param visible
|
|
20
|
+
*/
|
|
21
|
+
private showScatter;
|
|
14
22
|
private getLayerConfig;
|
|
23
|
+
private getAutoStyleByScale;
|
|
24
|
+
private updateClusterEnabled;
|
|
25
|
+
private ensureStationaryWatch;
|
|
26
|
+
private hasAnyClusterEnabled;
|
|
27
|
+
private tryRemoveWatchIfNoVisible;
|
|
28
|
+
private applyScatterMode;
|
|
29
|
+
private applyClusterMode;
|
|
15
30
|
private showClusterInExtent;
|
|
16
31
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("@arcgis/core/core/reactiveUtils.js"),u=require("@arcgis/core/Graphic"),m=require("@arcgis/core/layers/GraphicsLayer"),v=require("vue"),k=require("../stores/index.js");function f(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const i=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,i.get?i:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const p=f(b);class S{constructor(e){this.clusterScaleThreshold=5e3,this.watchHandle=null,this.currentShowParams=null,this.isCameraVisible=!1,this.isKkVisible=!1,this.clusterEnabled={cameraNormal:!1,cameraAbnormal:!1,kkNormal:!1,kkAbnormal:!1},this.view=e;const t=k.default.useAppDataStore;this.mapInitializer=v.toRaw(t.mapInitializer),this.cameraNormalLayer=new m({id:"cameraNormalLayer",visible:!1}),this.cameraAbnormalLayer=new m({id:"cameraAbnormalLayer",visible:!1}),this.kkNormalLayer=new m({id:"kkNormalLayer",visible:!1}),this.kkAbnormalLayer=new m({id:"kkAbnormalLayer",visible:!1}),this.view.map.addMany([this.cameraNormalLayer,this.cameraAbnormalLayer,this.kkNormalLayer,this.kkAbnormalLayer])}async setEdpassLayerVisibility(e){if(this.currentShowParams={...this.currentShowParams??{},...e},e.deviceType!=="camera"&&e.deviceType!=="kk")return{status:-1,message:"不支持的设备类型"};e.deviceType==="camera"&&(this.isCameraVisible=e.visible),e.deviceType==="kk"&&(this.isKkVisible=e.visible),this.updateClusterEnabled(e);const t=e.style??this.getAutoStyleByScale();switch(t==="cluster"||e.style==null?this.ensureStationaryWatch():this.tryRemoveWatchIfNoVisible(),t){case"scatter":{this.applyScatterMode(),this.tryRemoveWatchIfNoVisible();break}case"cluster":{await this.applyClusterMode();break}}return{status:0,message:"Success"}}showScatter(e){const t=e??this.isCameraVisible,i=e??this.isKkVisible;this.mapInitializer.setLayerVisibility({id:"camera-normal",visible:t}),this.mapInitializer.setLayerVisibility({id:"camera-abnormal",visible:t}),this.mapInitializer.setLayerVisibility({id:"kk-normal",visible:i}),this.mapInitializer.setLayerVisibility({id:"kk-abnormal",visible:i})}getLayerConfig(e){let t,i,a;return e.deviceType==="camera"?e.deviceState==="normal"?(t="/GisViewerAssets/Images/gis/gis_sxj_map.png",i=[45,108,196],a=this.cameraNormalLayer):(t="/GisViewerAssets/Images/gis/gis_sxj_yc.png",i=[189,49,50],a=this.cameraAbnormalLayer):e.deviceState==="normal"?(t="/GisViewerAssets/Images/gis/gis_kk_map.png",i=[45,108,196],a=this.kkNormalLayer):(t="/GisViewerAssets/Images/gis/gis_kk_yc.png",i=[189,49,50],a=this.kkAbnormalLayer),{icon:t,color:i,deviceLayer:a}}getAutoStyleByScale(){return this.view.scale>this.clusterScaleThreshold?"cluster":"scatter"}updateClusterEnabled(e){const t=e.deviceState;e.deviceType==="camera"?t?t==="normal"?this.clusterEnabled.cameraNormal=e.visible:this.clusterEnabled.cameraAbnormal=e.visible:(this.clusterEnabled.cameraNormal=e.visible,this.clusterEnabled.cameraAbnormal=e.visible):t?t==="normal"?this.clusterEnabled.kkNormal=e.visible:this.clusterEnabled.kkAbnormal=e.visible:(this.clusterEnabled.kkNormal=e.visible,this.clusterEnabled.kkAbnormal=e.visible)}ensureStationaryWatch(){this.watchHandle||(this.watchHandle=p.when(()=>this.view.stationary,async()=>{if(!this.currentShowParams)return;if((this.currentShowParams.style??this.getAutoStyleByScale())==="scatter"){this.applyScatterMode();return}await this.applyClusterMode()}))}hasAnyClusterEnabled(){return this.clusterEnabled.cameraNormal||this.clusterEnabled.cameraAbnormal||this.clusterEnabled.kkNormal||this.clusterEnabled.kkAbnormal}tryRemoveWatchIfNoVisible(){var i;const e=this.isCameraVisible||this.isKkVisible,t=this.hasAnyClusterEnabled();!e&&!t&&((i=this.watchHandle)==null||i.remove(),this.watchHandle=null)}applyScatterMode(){this.showScatter(),this.cameraNormalLayer.visible=!1,this.cameraAbnormalLayer.visible=!1,this.kkNormalLayer.visible=!1,this.kkAbnormalLayer.visible=!1,this.cameraNormalLayer.removeAll(),this.cameraAbnormalLayer.removeAll(),this.kkNormalLayer.removeAll(),this.kkAbnormalLayer.removeAll()}async applyClusterMode(){var l,o;this.showScatter(!1);const e=((l=this.currentShowParams)==null?void 0:l.ddCode)||"",t=((o=this.currentShowParams)==null?void 0:o.zdCode)||"",i=this.view.extent,a=[];this.cameraNormalLayer.visible=this.clusterEnabled.cameraNormal,this.clusterEnabled.cameraNormal?a.push(this.showClusterInExtent({deviceType:"camera",deviceState:"normal",style:"cluster",ddCode:e,zdCode:t,visible:!0},i)):this.cameraNormalLayer.removeAll(),this.cameraAbnormalLayer.visible=this.clusterEnabled.cameraAbnormal,this.clusterEnabled.cameraAbnormal?a.push(this.showClusterInExtent({deviceType:"camera",deviceState:"abnormal",style:"cluster",ddCode:e,zdCode:t,visible:!0},i)):this.cameraAbnormalLayer.removeAll(),this.kkNormalLayer.visible=this.clusterEnabled.kkNormal,this.clusterEnabled.kkNormal?a.push(this.showClusterInExtent({deviceType:"kk",deviceState:"normal",style:"cluster",ddCode:e,zdCode:t,visible:!0},i)):this.kkNormalLayer.removeAll(),this.kkAbnormalLayer.visible=this.clusterEnabled.kkAbnormal,this.clusterEnabled.kkAbnormal?a.push(this.showClusterInExtent({deviceType:"kk",deviceState:"abnormal",style:"cluster",ddCode:e,zdCode:t,visible:!0},i)):this.kkAbnormalLayer.removeAll(),await Promise.all(a),this.tryRemoveWatchIfNoVisible()}async showClusterInExtent(e,t){const i=await fetch("/es/queryGeoAggregation",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({deviceType:e.deviceType,topLeftLat:t.ymax,topLeftLon:t.xmin,bottomRightLat:t.ymin,bottomRightLon:t.xmax,devStateSet:e.deviceState?[e.deviceState==="normal"?"1":"2"]:["1","2"],zdCode:e.zdCode||"",ddCode:e.ddCode||"",mapLevel:this.view.zoom+9})});if(i.status!==200){console.error(i.statusText);return}const a=await i.json();if(a.code!==200)return;const{icon:l,color:o,deviceLayer:h}=this.getLayerConfig(e);h.removeAll();const d=a.data.map(s=>{var y;const n=(s.count.toString().length*6+6)/2,c=new u({geometry:{type:"point",x:s.lon,y:s.lat},attributes:{id:((y=s.devInfo)==null?void 0:y.deviceId)||s.key,type:e.deviceType,count:s.count,typeName:e.deviceType==="camera"?"视频":"卡口",stateName:e.deviceState==="normal"?"正常":"异常",...s.devInfo}});return s.count>1?c.symbol={type:"cim",data:{type:"CIMSymbolReference",symbol:{type:"CIMPointSymbol",symbolLayers:[{type:"CIMVectorMarker",size:32,colorLocked:!0,anchorPointUnits:"Relative",frame:{xmin:-16,ymin:-16,xmax:16,ymax:16},markerGraphics:[{type:"CIMMarkerGraphic",geometry:{rings:[[[-n,30],[n,30],[n,15],[-n,15],[-n,30]]]},symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:o.concat([255])},{type:"CIMSolidStroke",enable:!0,width:3,color:o.concat([128])}]}},{type:"CIMMarkerGraphic",primitiveName:"textGraphic",geometry:{x:0,y:0},symbol:{type:"CIMTextSymbol",fontFamilyName:"msyh",height:12,horizontalAlignment:"Center",offsetX:0,offsetY:22,symbol:{type:"CIMPolygonSymbol",symbolLayers:[{type:"CIMSolidFill",enable:!0,color:[255,255,255,255]}]},verticalAlignment:"Center"},textString:s.count.toString()}],scaleSymbolsProportionally:!0,respectFrame:!0},{type:"CIMPictureMarker",enable:!0,anchorPoint:{x:0,y:0},anchorPointUnits:"Relative",size:24,rotateClockwise:!0,textureFilter:"Picture",url:l}]}}}:(c.symbol={type:"picture-marker",url:l,width:18,height:18},c.popupTemplate={title:"视频信息",content:[{type:"fields",fieldInfos:[{fieldName:"deviceId",label:"设备编号"},{fieldName:"deviceName",label:"设备名称"},{fieldName:"typeName",label:"设备类型"},{fieldName:"stateName",label:"设备状态"}]}]}),c});h.addMany(d)}}exports.default=S;
|
package/lib/src/types/index.d.ts
CHANGED