@hzab/map-combine 0.4.1 → 0.4.2-alpha.0
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/CHANGELOG.md +5 -0
- package/package.json +1 -1
- package/src/basic/BasicElement.ts +14 -14
- package/src/basic/BasicMarker.ts +32 -26
- package/src/basic/BasicMouseHandler.ts +4 -4
- package/src/basic/Point.ts +173 -173
- package/src/basic/Polygon.ts +81 -70
- package/src/basic/Polyline.ts +85 -75
- package/src/basic/ReactPopup.tsx +12 -10
- package/src/cesium/CesiumPoint.ts +69 -69
- package/src/cesium/CesiumPolygon.ts +181 -190
- package/src/cesium/CesiumPolyline.ts +369 -369
- package/src/mine/MinePoint.ts +70 -78
- package/src/mine/MinePolygon.ts +206 -216
- package/src/mine/MinePolyline.ts +193 -203
- package/src/mine/MineTile3D.ts +7 -11
- package/src/openlayer/OpenlayerPoint.ts +185 -177
- package/src/openlayer/OpenlayerPolygon.ts +302 -299
- package/src/openlayer/OpenlayerPolyline.ts +303 -289
- package/src/utils/Image.ts +16 -20
- package/src/utils/PolygonEditor.ts +78 -99
- package/src/utils/PolylineEditor.ts +75 -90
- package/src/utils/static.ts +3 -3
package/src/mine/MinePoint.ts
CHANGED
|
@@ -1,82 +1,78 @@
|
|
|
1
|
-
|
|
2
1
|
import { Point } from "../basic/Point";
|
|
3
2
|
import { MineMap } from "./MineMap";
|
|
4
3
|
|
|
5
|
-
|
|
6
4
|
export function drawPoint(map: MineMap, point: Point<unknown>) {
|
|
7
|
-
const { viewer } = map
|
|
8
|
-
const { size, center } = point
|
|
9
|
-
let status = 0
|
|
10
|
-
let skip = 0
|
|
5
|
+
const { viewer } = map;
|
|
6
|
+
const { size, center } = point;
|
|
7
|
+
let status = 0;
|
|
8
|
+
let skip = 0;
|
|
11
9
|
|
|
12
|
-
const img = document.createElement(
|
|
13
|
-
img.src = point.src
|
|
14
|
-
img.width = size[0]
|
|
15
|
-
img.height = size[1]
|
|
16
|
-
img.style.cursor = point.cursor
|
|
10
|
+
const img = document.createElement("img");
|
|
11
|
+
img.src = point.src;
|
|
12
|
+
img.width = size[0];
|
|
13
|
+
img.height = size[1];
|
|
14
|
+
img.style.cursor = point.cursor;
|
|
17
15
|
|
|
18
16
|
img.onpointerenter = () => {
|
|
19
|
-
status == 2 && point.event.trigger(
|
|
20
|
-
}
|
|
17
|
+
status == 2 && point.event.trigger("pointer-in");
|
|
18
|
+
};
|
|
21
19
|
img.onpointerleave = () => {
|
|
22
|
-
status == 2 && point.event.trigger(
|
|
23
|
-
}
|
|
20
|
+
status == 2 && point.event.trigger("pointer-out");
|
|
21
|
+
};
|
|
24
22
|
|
|
25
23
|
img.onclick = () => {
|
|
26
|
-
status == 2 && point.event.trigger(
|
|
27
|
-
}
|
|
24
|
+
status == 2 && point.event.trigger("left-click");
|
|
25
|
+
};
|
|
28
26
|
img.oncontextmenu = () => {
|
|
29
|
-
status == 2 && point.event.trigger(
|
|
30
|
-
}
|
|
27
|
+
status == 2 && point.event.trigger("right-click");
|
|
28
|
+
};
|
|
31
29
|
|
|
32
30
|
const marker = new minemap.Marker({
|
|
33
31
|
draggable: point.editable,
|
|
34
32
|
rotation: 0,
|
|
35
|
-
offset: [-size[0] *
|
|
36
|
-
element: img
|
|
37
|
-
})
|
|
38
|
-
|
|
33
|
+
offset: [-size[0] * center[0], -size[1] * center[1]],
|
|
34
|
+
element: img,
|
|
35
|
+
});
|
|
39
36
|
|
|
40
37
|
if (point.coordinates) {
|
|
41
|
-
status = 2
|
|
42
|
-
marker.setLngLat(point.coordinates).setAltitude(point.coordinates[2] ?? 0)
|
|
38
|
+
status = 2;
|
|
39
|
+
marker.setLngLat(point.coordinates).setAltitude(point.coordinates[2] ?? 0);
|
|
43
40
|
point.show && marker.addTo(map.viewer);
|
|
44
41
|
}
|
|
45
42
|
|
|
46
|
-
|
|
47
43
|
const onMouseMove = (e: any) => {
|
|
48
44
|
switch (status) {
|
|
49
45
|
case 0:
|
|
50
|
-
status = 1
|
|
51
|
-
marker.setLngLat(e.lngLat)
|
|
46
|
+
status = 1;
|
|
47
|
+
marker.setLngLat(e.lngLat);
|
|
52
48
|
point.show && marker.addTo(map.viewer);
|
|
53
49
|
break;
|
|
54
50
|
case 1:
|
|
55
51
|
marker.setLngLat(e.lngLat);
|
|
56
|
-
break
|
|
52
|
+
break;
|
|
57
53
|
}
|
|
58
|
-
}
|
|
54
|
+
};
|
|
59
55
|
|
|
60
56
|
const onUpdate = (e: Set<string>) => {
|
|
61
57
|
if (skip) {
|
|
62
|
-
skip
|
|
63
|
-
return
|
|
58
|
+
skip--;
|
|
59
|
+
return;
|
|
64
60
|
}
|
|
65
|
-
const { size, center } = point
|
|
66
|
-
e.forEach(key => {
|
|
61
|
+
const { size, center } = point;
|
|
62
|
+
e.forEach((key) => {
|
|
67
63
|
switch (key) {
|
|
68
|
-
case
|
|
69
|
-
point.show ? marker.addTo(map.viewer) : marker.remove()
|
|
64
|
+
case "show":
|
|
65
|
+
point.show ? marker.addTo(map.viewer) : marker.remove();
|
|
70
66
|
break;
|
|
71
|
-
case
|
|
72
|
-
marker.setDraggable(point.editable)
|
|
67
|
+
case "editable":
|
|
68
|
+
marker.setDraggable(point.editable);
|
|
73
69
|
break;
|
|
74
|
-
case
|
|
70
|
+
case "coordinates":
|
|
75
71
|
if (point.coordinates) {
|
|
76
|
-
marker.setLngLat(point.coordinates).setAltitude(point.coordinates[2] ?? 0)
|
|
72
|
+
marker.setLngLat(point.coordinates).setAltitude(point.coordinates[2] ?? 0);
|
|
77
73
|
switch (status) {
|
|
78
74
|
case 0:
|
|
79
|
-
point.show && marker.addTo(map.viewer)
|
|
75
|
+
point.show && marker.addTo(map.viewer);
|
|
80
76
|
status = 2;
|
|
81
77
|
break;
|
|
82
78
|
case 1:
|
|
@@ -84,56 +80,52 @@ export function drawPoint(map: MineMap, point: Point<unknown>) {
|
|
|
84
80
|
break;
|
|
85
81
|
}
|
|
86
82
|
} else {
|
|
87
|
-
marker.remove()
|
|
88
|
-
status = 0
|
|
83
|
+
marker.remove();
|
|
84
|
+
status = 0;
|
|
89
85
|
}
|
|
90
86
|
|
|
91
87
|
break;
|
|
92
|
-
case
|
|
93
|
-
img.src = point.src
|
|
88
|
+
case "src":
|
|
89
|
+
img.src = point.src;
|
|
94
90
|
break;
|
|
95
|
-
case
|
|
96
|
-
img.width = size[0]
|
|
97
|
-
img.height = size[1]
|
|
98
|
-
if (!e.has(
|
|
99
|
-
marker.setOffset([-size[0] *
|
|
91
|
+
case "size":
|
|
92
|
+
img.width = size[0];
|
|
93
|
+
img.height = size[1];
|
|
94
|
+
if (!e.has("center")) {
|
|
95
|
+
marker.setOffset([-size[0] * center[0], -size[1] * center[1]]);
|
|
100
96
|
}
|
|
101
97
|
break;
|
|
102
|
-
case
|
|
103
|
-
marker.setOffset([-size[0] *
|
|
98
|
+
case "center":
|
|
99
|
+
marker.setOffset([-size[0] * center[0], -size[1] * center[1]]);
|
|
104
100
|
break;
|
|
105
|
-
case
|
|
106
|
-
marker.setRotation(point.rotation)
|
|
101
|
+
case "rotation":
|
|
102
|
+
marker.setRotation(point.rotation);
|
|
107
103
|
break;
|
|
108
104
|
default:
|
|
109
|
-
throw new Error(`${key} 还不支持修改`)
|
|
105
|
+
throw new Error(`${key} 还不支持修改`);
|
|
110
106
|
}
|
|
111
|
-
})
|
|
112
|
-
}
|
|
113
|
-
|
|
107
|
+
});
|
|
108
|
+
};
|
|
114
109
|
|
|
115
110
|
const onDestroy = () => {
|
|
116
|
-
marker.remove()
|
|
117
|
-
viewer.off(
|
|
118
|
-
viewer.off(
|
|
119
|
-
point.event.off(
|
|
120
|
-
point.event.off(
|
|
121
|
-
|
|
122
|
-
}
|
|
111
|
+
marker.remove();
|
|
112
|
+
viewer.off("mousemove", onMouseMove);
|
|
113
|
+
viewer.off("click", onClick);
|
|
114
|
+
point.event.off("update", onUpdate);
|
|
115
|
+
point.event.off("destroy", onDestroy);
|
|
116
|
+
};
|
|
123
117
|
const onClick = () => {
|
|
124
118
|
if (status == 1) {
|
|
125
|
-
status = 2
|
|
126
|
-
skip
|
|
127
|
-
const p = marker.getLngLat()
|
|
128
|
-
point.coordinates = [p.lng, p.lat]
|
|
129
|
-
point.event.trigger(
|
|
119
|
+
status = 2;
|
|
120
|
+
skip++;
|
|
121
|
+
const p = marker.getLngLat();
|
|
122
|
+
point.coordinates = [p.lng, p.lat];
|
|
123
|
+
point.event.trigger("pointer-in");
|
|
130
124
|
}
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
viewer.on('mousemove', onMouseMove)
|
|
135
|
-
viewer.on('click', onClick)
|
|
136
|
-
point.event.on('update', onUpdate)
|
|
137
|
-
point.event.on('destroy', onDestroy)
|
|
125
|
+
};
|
|
138
126
|
|
|
139
|
-
|
|
127
|
+
viewer.on("mousemove", onMouseMove);
|
|
128
|
+
viewer.on("click", onClick);
|
|
129
|
+
point.event.on("update", onUpdate);
|
|
130
|
+
point.event.on("destroy", onDestroy);
|
|
131
|
+
}
|