vesium 1.0.1-beta.50 → 1.0.1-beta.52
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/dist/index.cjs +1420 -1318
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1323 -0
- package/dist/index.d.cts.map +1 -0
- package/dist/index.d.mts +1323 -0
- package/dist/index.d.mts.map +1 -0
- package/dist/index.iife.js +1624 -1519
- package/dist/index.iife.js.map +1 -1
- package/dist/index.iife.min.js +2 -2
- package/dist/index.iife.min.js.map +1 -1
- package/dist/index.min.cjs +2 -2
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.mjs +2 -2
- package/dist/index.min.mjs.map +1 -1
- package/dist/index.mjs +1398 -1380
- package/dist/index.mjs.map +1 -1
- package/package.json +18 -16
- package/dist/index.d.ts +0 -1329
package/dist/index.cjs
CHANGED
|
@@ -1,1459 +1,1561 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
//#region rolldown:runtime
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __copyProps = (to, from, except, desc) => {
|
|
9
|
+
if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
|
|
10
|
+
key = keys[i];
|
|
11
|
+
if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
12
|
+
get: ((k) => from[k]).bind(null, key),
|
|
13
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
14
|
+
});
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
|
|
19
|
+
value: mod,
|
|
20
|
+
enumerable: true
|
|
21
|
+
}) : target, mod));
|
|
22
|
+
|
|
23
|
+
//#endregion
|
|
24
|
+
const __vueuse_core = __toESM(require("@vueuse/core"));
|
|
25
|
+
const cesium = __toESM(require("cesium"));
|
|
26
|
+
const vue = __toESM(require("vue"));
|
|
27
|
+
|
|
28
|
+
//#region createViewer/index.ts
|
|
29
|
+
/**
|
|
30
|
+
* @internal
|
|
31
|
+
*/
|
|
6
32
|
const CREATE_VIEWER_INJECTION_KEY = Symbol("CREATE_VIEWER_INJECTION_KEY");
|
|
33
|
+
/**
|
|
34
|
+
* @internal
|
|
35
|
+
*/
|
|
7
36
|
const CREATE_VIEWER_COLLECTION = /* @__PURE__ */ new WeakMap();
|
|
37
|
+
/**
|
|
38
|
+
*/
|
|
8
39
|
function createViewer(...args) {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
var _a, _b;
|
|
39
|
-
return !((_a = viewer.value) == null ? void 0 : _a.isDestroyed()) && ((_b = viewer.value) == null ? void 0 : _b.destroy());
|
|
40
|
-
});
|
|
41
|
-
} else {
|
|
42
|
-
viewer.value = void 0;
|
|
43
|
-
}
|
|
44
|
-
});
|
|
45
|
-
core.tryOnScopeDispose(() => {
|
|
46
|
-
viewer.value = void 0;
|
|
47
|
-
});
|
|
48
|
-
return vue.computed(() => {
|
|
49
|
-
var _a;
|
|
50
|
-
return ((_a = viewer.value) == null ? void 0 : _a.isDestroyed()) ? void 0 : viewer.value;
|
|
51
|
-
});
|
|
40
|
+
const viewer = (0, vue.shallowRef)();
|
|
41
|
+
const readonlyViewer = (0, vue.shallowReadonly)(viewer);
|
|
42
|
+
(0, vue.provide)(CREATE_VIEWER_INJECTION_KEY, readonlyViewer);
|
|
43
|
+
const scope = (0, vue.getCurrentScope)();
|
|
44
|
+
if (scope) CREATE_VIEWER_COLLECTION.set(scope, readonlyViewer);
|
|
45
|
+
const canvas = (0, vue.computed)(() => viewer.value?.canvas);
|
|
46
|
+
(0, __vueuse_core.useMutationObserver)(document?.body, () => {
|
|
47
|
+
if (canvas.value && !document?.body.contains(canvas.value)) viewer.value = void 0;
|
|
48
|
+
}, {
|
|
49
|
+
childList: true,
|
|
50
|
+
subtree: true
|
|
51
|
+
});
|
|
52
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
53
|
+
const [arg1, arg2] = args;
|
|
54
|
+
const value = (0, vue.toRaw)((0, vue.toValue)(arg1));
|
|
55
|
+
if (value instanceof cesium.Viewer) viewer.value = (0, vue.markRaw)(value);
|
|
56
|
+
else if (value) {
|
|
57
|
+
const element = value;
|
|
58
|
+
const options = arg2;
|
|
59
|
+
viewer.value = new cesium.Viewer(element, options);
|
|
60
|
+
onCleanup(() => !viewer.value?.isDestroyed() && viewer.value?.destroy());
|
|
61
|
+
} else viewer.value = void 0;
|
|
62
|
+
});
|
|
63
|
+
(0, __vueuse_core.tryOnScopeDispose)(() => {
|
|
64
|
+
viewer.value = void 0;
|
|
65
|
+
});
|
|
66
|
+
return (0, vue.computed)(() => {
|
|
67
|
+
return viewer.value?.isDestroyed() ? void 0 : viewer.value;
|
|
68
|
+
});
|
|
52
69
|
}
|
|
70
|
+
|
|
71
|
+
//#endregion
|
|
72
|
+
//#region utils/arrayDiff.ts
|
|
73
|
+
/**
|
|
74
|
+
* 计算两个数组的差异,返回新增和删除的元素
|
|
75
|
+
*/
|
|
53
76
|
function arrayDiff(list, oldList) {
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
77
|
+
const oldListSet = new Set(oldList);
|
|
78
|
+
const added = list.filter((obj) => !oldListSet.has(obj));
|
|
79
|
+
const newListSet = new Set(list);
|
|
80
|
+
const removed = oldList?.filter((obj) => !newListSet.has(obj)) ?? [];
|
|
81
|
+
return {
|
|
82
|
+
added,
|
|
83
|
+
removed
|
|
84
|
+
};
|
|
59
85
|
}
|
|
86
|
+
|
|
87
|
+
//#endregion
|
|
88
|
+
//#region utils/canvasCoordToCartesian.ts
|
|
89
|
+
/**
|
|
90
|
+
* Convert canvas coordinates to Cartesian coordinates
|
|
91
|
+
*
|
|
92
|
+
* @param canvasCoord Canvas coordinates
|
|
93
|
+
* @param scene Cesium.Scene instance
|
|
94
|
+
* @param mode optional values are 'pickPosition' | 'globePick' | 'auto' | 'noHeight' @default 'auto'
|
|
95
|
+
*
|
|
96
|
+
* `pickPosition`: Use scene.pickPosition for conversion, which can be used for picking models, oblique photography, etc.
|
|
97
|
+
* However, if depth detection is not enabled (globe.depthTestAgainstTerrain=false), picking terrain or inaccurate issues may occur
|
|
98
|
+
*
|
|
99
|
+
* `globePick`: Use camera.getPickRay for conversion, which cannot be used for picking models or oblique photography,
|
|
100
|
+
* but can be used for picking terrain. If terrain does not exist, the picked elevation is 0
|
|
101
|
+
*
|
|
102
|
+
* `auto`: Automatically determine which picking content to return
|
|
103
|
+
*
|
|
104
|
+
* Calculation speed comparison: globePick > auto >= pickPosition
|
|
105
|
+
*/
|
|
60
106
|
function canvasCoordToCartesian(canvasCoord, scene, mode = "auto") {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
}
|
|
76
|
-
const height1 = (position1 && cesium.Ellipsoid.WGS84.cartesianToCartographic(position1).height) ?? 0;
|
|
77
|
-
const height2 = (position2 && cesium.Ellipsoid.WGS84.cartesianToCartographic(position2).height) ?? 0;
|
|
78
|
-
return height1 < height2 ? position1 : position2;
|
|
79
|
-
}
|
|
107
|
+
if (mode === "pickPosition") return scene.pickPosition(canvasCoord);
|
|
108
|
+
else if (mode === "globePick") {
|
|
109
|
+
const ray = scene.camera.getPickRay(canvasCoord);
|
|
110
|
+
return ray && scene.globe.pick(ray, scene);
|
|
111
|
+
} else {
|
|
112
|
+
if (scene.globe.depthTestAgainstTerrain) return scene.pickPosition(canvasCoord);
|
|
113
|
+
const position1 = scene.pickPosition(canvasCoord);
|
|
114
|
+
const ray = scene.camera.getPickRay(canvasCoord);
|
|
115
|
+
const position2 = ray && scene.globe.pick(ray, scene);
|
|
116
|
+
if (!position1) return position2;
|
|
117
|
+
const height1 = (position1 && cesium.Ellipsoid.WGS84.cartesianToCartographic(position1).height) ?? 0;
|
|
118
|
+
const height2 = (position2 && cesium.Ellipsoid.WGS84.cartesianToCartographic(position2).height) ?? 0;
|
|
119
|
+
return height1 < height2 ? position1 : position2;
|
|
120
|
+
}
|
|
80
121
|
}
|
|
122
|
+
|
|
123
|
+
//#endregion
|
|
124
|
+
//#region utils/cartesianToCanvasCoord.ts
|
|
125
|
+
/**
|
|
126
|
+
* Convert Cartesian coordinates to canvas coordinates
|
|
127
|
+
*
|
|
128
|
+
* @param position Cartesian coordinates
|
|
129
|
+
* @param scene Cesium.Scene instance
|
|
130
|
+
*/
|
|
81
131
|
function cartesianToCanvasCoord(position, scene) {
|
|
82
|
-
|
|
132
|
+
return scene.cartesianToCanvasCoordinates(position);
|
|
83
133
|
}
|
|
134
|
+
|
|
135
|
+
//#endregion
|
|
136
|
+
//#region utils/is.ts
|
|
84
137
|
const toString = Object.prototype.toString;
|
|
85
138
|
function isDef(val) {
|
|
86
|
-
|
|
139
|
+
return typeof val !== "undefined";
|
|
87
140
|
}
|
|
88
141
|
function isBoolean(val) {
|
|
89
|
-
|
|
142
|
+
return typeof val === "boolean";
|
|
90
143
|
}
|
|
91
144
|
function isFunction(val) {
|
|
92
|
-
|
|
145
|
+
return typeof val === "function";
|
|
93
146
|
}
|
|
94
147
|
function isNumber(val) {
|
|
95
|
-
|
|
148
|
+
return typeof val === "number";
|
|
96
149
|
}
|
|
97
150
|
function isString(val) {
|
|
98
|
-
|
|
151
|
+
return typeof val === "string";
|
|
99
152
|
}
|
|
100
153
|
function isObject(val) {
|
|
101
|
-
|
|
154
|
+
return toString.call(val) === "[object Object]";
|
|
102
155
|
}
|
|
103
156
|
function isWindow(val) {
|
|
104
|
-
|
|
157
|
+
return typeof window !== "undefined" && toString.call(val) === "[object Window]";
|
|
105
158
|
}
|
|
106
159
|
function isPromise(val) {
|
|
107
|
-
|
|
160
|
+
return !!val && (typeof val === "object" || typeof val === "function") && typeof val.then === "function";
|
|
108
161
|
}
|
|
109
162
|
function isElement(val) {
|
|
110
|
-
|
|
163
|
+
return !!(val && val.nodeName && val.nodeType === 1);
|
|
111
164
|
}
|
|
112
165
|
const isArray = Array.isArray;
|
|
113
166
|
function isBase64(val) {
|
|
114
|
-
|
|
115
|
-
|
|
167
|
+
const reg = /^\s*data:([a-z]+\/[\d+.a-z-]+(;[a-z-]+=[\da-z-]+)?)?(;base64)?,([\s\w!$%&'()*+,./:;=?@~-]*?)\s*$/i;
|
|
168
|
+
return reg.test(val);
|
|
116
169
|
}
|
|
117
170
|
function assertError(condition, error) {
|
|
118
|
-
|
|
119
|
-
throw new Error(error);
|
|
120
|
-
}
|
|
171
|
+
if (condition) throw new Error(error);
|
|
121
172
|
}
|
|
173
|
+
|
|
174
|
+
//#endregion
|
|
175
|
+
//#region utils/cesiumEquals.ts
|
|
176
|
+
/**
|
|
177
|
+
* Determines if two Cesium objects are equal.
|
|
178
|
+
*
|
|
179
|
+
* This function not only judges whether the instances are equal,
|
|
180
|
+
* but also judges the equals method in the example.
|
|
181
|
+
*
|
|
182
|
+
* @param left The first Cesium object
|
|
183
|
+
* @param right The second Cesium object
|
|
184
|
+
* @returns Returns true if the two Cesium objects are equal, otherwise false
|
|
185
|
+
*/
|
|
122
186
|
function cesiumEquals(left, right) {
|
|
123
|
-
|
|
187
|
+
return left === right || isFunction(left?.equals) && left.equals(right) || isFunction(right?.equals) && right.equals(left);
|
|
124
188
|
}
|
|
189
|
+
|
|
190
|
+
//#endregion
|
|
191
|
+
//#region utils/toCoord.ts
|
|
192
|
+
/**
|
|
193
|
+
* Converts coordinates to an array or object in the specified format.
|
|
194
|
+
*
|
|
195
|
+
* @param position The coordinate to be converted, which can be a Cartesian3, Cartographic, array, or object.
|
|
196
|
+
* @param options Conversion options, including conversion type and whether to include altitude information.
|
|
197
|
+
* @returns The converted coordinate, which may be an array or object. If the input position is empty, undefined is returned.
|
|
198
|
+
*
|
|
199
|
+
* @template T Conversion type, optional values are 'Array' or 'Object', @default 'Array'.
|
|
200
|
+
* @template Alt Whether to include altitude information, default is false
|
|
201
|
+
*/
|
|
125
202
|
function toCoord(position, options = {}) {
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
203
|
+
if (!position) return void 0;
|
|
204
|
+
const { type = "Array", alt = false } = options;
|
|
205
|
+
let longitude, latitude, height;
|
|
206
|
+
if (position instanceof cesium.Cartesian3) {
|
|
207
|
+
const cartographic = cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
|
|
208
|
+
longitude = cesium.Math.toDegrees(cartographic.longitude);
|
|
209
|
+
latitude = cesium.Math.toDegrees(cartographic.latitude);
|
|
210
|
+
height = cartographic.height;
|
|
211
|
+
} else if (position instanceof cesium.Cartographic) {
|
|
212
|
+
const cartographic = position;
|
|
213
|
+
longitude = cesium.Math.toDegrees(cartographic.longitude);
|
|
214
|
+
latitude = cesium.Math.toDegrees(cartographic.latitude);
|
|
215
|
+
height = cartographic.height;
|
|
216
|
+
} else if (Array.isArray(position)) {
|
|
217
|
+
longitude = cesium.Math.toDegrees(position[0]);
|
|
218
|
+
latitude = cesium.Math.toDegrees(position[1]);
|
|
219
|
+
height = position[2];
|
|
220
|
+
} else {
|
|
221
|
+
longitude = position.longitude;
|
|
222
|
+
latitude = position.latitude;
|
|
223
|
+
height = position.height;
|
|
224
|
+
}
|
|
225
|
+
if (type === "Array") return alt ? [
|
|
226
|
+
longitude,
|
|
227
|
+
latitude,
|
|
228
|
+
height
|
|
229
|
+
] : [longitude, latitude];
|
|
230
|
+
else return alt ? {
|
|
231
|
+
longitude,
|
|
232
|
+
latitude,
|
|
233
|
+
height
|
|
234
|
+
} : {
|
|
235
|
+
longitude,
|
|
236
|
+
latitude
|
|
237
|
+
};
|
|
155
238
|
}
|
|
239
|
+
|
|
240
|
+
//#endregion
|
|
241
|
+
//#region utils/convertDMS.ts
|
|
242
|
+
/**
|
|
243
|
+
* Convert degrees to DMS (Degrees Minutes Seconds) format string
|
|
244
|
+
*
|
|
245
|
+
* @param degrees The angle value
|
|
246
|
+
* @param precision The number of decimal places to retain for the seconds, defaults to 3
|
|
247
|
+
* @returns A DMS formatted string in the format: degrees° minutes′ seconds″
|
|
248
|
+
*/
|
|
156
249
|
function dmsEncode(degrees, precision = 3) {
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
250
|
+
const str = `${degrees}`;
|
|
251
|
+
let i = str.indexOf(".");
|
|
252
|
+
const d = i < 0 ? str : str.slice(0, Math.max(0, i));
|
|
253
|
+
let m = "0";
|
|
254
|
+
let s = "0";
|
|
255
|
+
if (i > 0) {
|
|
256
|
+
m = `0${str.slice(Math.max(0, i))}`;
|
|
257
|
+
m = `${+m * 60}`;
|
|
258
|
+
i = m.indexOf(".");
|
|
259
|
+
if (i > 0) {
|
|
260
|
+
s = `0${m.slice(Math.max(0, i))}`;
|
|
261
|
+
m = m.slice(0, Math.max(0, i));
|
|
262
|
+
s = `${+s * 60}`;
|
|
263
|
+
i = s.indexOf(".");
|
|
264
|
+
s = s.slice(0, Math.max(0, i + 4));
|
|
265
|
+
s = (+s).toFixed(precision);
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
return `${Math.abs(+d)}°${+m}′${+s}″`;
|
|
176
269
|
}
|
|
270
|
+
/**
|
|
271
|
+
* Decode a DMS (Degrees Minutes Seconds) formatted string to a decimal angle value
|
|
272
|
+
*
|
|
273
|
+
* @param dmsCode DMS formatted string, e.g. "120°30′45″N"
|
|
274
|
+
* @returns The decoded decimal angle value, or 0 if decoding fails
|
|
275
|
+
*/
|
|
177
276
|
function dmsDecode(dmsCode) {
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
277
|
+
const [dd, msStr] = dmsCode.split("°") ?? [];
|
|
278
|
+
const [mm, sStr] = msStr?.split("′") ?? [];
|
|
279
|
+
const ss = sStr?.split("″")[0];
|
|
280
|
+
const d = Number(dd) || 0;
|
|
281
|
+
const m = (Number(mm) || 0) / 60;
|
|
282
|
+
const s = (Number(ss) || 0) / 60 / 60;
|
|
283
|
+
const degrees = d + m + s;
|
|
284
|
+
if (degrees === 0) return 0;
|
|
285
|
+
else {
|
|
286
|
+
let res = degrees;
|
|
287
|
+
if ([
|
|
288
|
+
"W",
|
|
289
|
+
"w",
|
|
290
|
+
"S",
|
|
291
|
+
"s"
|
|
292
|
+
].includes(dmsCode[dmsCode.length - 1])) res = -res;
|
|
293
|
+
return res;
|
|
294
|
+
}
|
|
194
295
|
}
|
|
296
|
+
/**
|
|
297
|
+
* Convert latitude and longitude coordinates to degrees-minutes-seconds format
|
|
298
|
+
*
|
|
299
|
+
* @param position The latitude and longitude coordinates
|
|
300
|
+
* @param precision The number of decimal places to retain for 'seconds', default is 3
|
|
301
|
+
* @returns Returns the coordinates in degrees-minutes-seconds format, or undefined if the conversion fails
|
|
302
|
+
*/
|
|
195
303
|
function degreesToDms(position, precision = 3) {
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
304
|
+
const coord = toCoord(position, { alt: true });
|
|
305
|
+
if (!coord) return;
|
|
306
|
+
const [longitude, latitude, height] = coord;
|
|
307
|
+
const x = dmsEncode(longitude, precision);
|
|
308
|
+
const y = dmsEncode(latitude, precision);
|
|
309
|
+
return [
|
|
310
|
+
`${x}${longitude > 0 ? "E" : "W"}`,
|
|
311
|
+
`${y}${latitude > 0 ? "N" : "S"}`,
|
|
312
|
+
height
|
|
313
|
+
];
|
|
204
314
|
}
|
|
315
|
+
/**
|
|
316
|
+
* Convert DMS (Degrees Minutes Seconds) format to decimal degrees for latitude and longitude coordinates
|
|
317
|
+
*
|
|
318
|
+
* @param dms The latitude or longitude coordinate in DMS format
|
|
319
|
+
* @returns Returns the coordinate in decimal degrees format, or undefined if the conversion fails
|
|
320
|
+
*/
|
|
205
321
|
function dmsToDegrees(dms) {
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
322
|
+
const [x, y, height] = dms;
|
|
323
|
+
const longitude = dmsDecode(x);
|
|
324
|
+
const latitude = dmsDecode(y);
|
|
325
|
+
return [
|
|
326
|
+
longitude,
|
|
327
|
+
latitude,
|
|
328
|
+
Number(height) || 0
|
|
329
|
+
];
|
|
210
330
|
}
|
|
331
|
+
|
|
332
|
+
//#endregion
|
|
333
|
+
//#region utils/isCesiumConstant.ts
|
|
334
|
+
/**
|
|
335
|
+
* Determines if the Cesium property is a constant.
|
|
336
|
+
*
|
|
337
|
+
* @param value Cesium property
|
|
338
|
+
*/
|
|
211
339
|
function isCesiumConstant(value) {
|
|
212
|
-
|
|
213
|
-
}
|
|
214
|
-
class CesiumMaterial extends cesium.Material {
|
|
215
|
-
constructor(options) {
|
|
216
|
-
super(options);
|
|
217
|
-
}
|
|
340
|
+
return !(0, cesium.defined)(value) || !!value.isConstant;
|
|
218
341
|
}
|
|
342
|
+
|
|
343
|
+
//#endregion
|
|
344
|
+
//#region utils/material.ts
|
|
345
|
+
/**
|
|
346
|
+
* Only as a type fix for `Cesium.Material`
|
|
347
|
+
*/
|
|
348
|
+
var CesiumMaterial = class extends cesium.Material {
|
|
349
|
+
constructor(options) {
|
|
350
|
+
super(options);
|
|
351
|
+
}
|
|
352
|
+
};
|
|
353
|
+
/**
|
|
354
|
+
* Get material from cache, alias of `Material._materialCache.getMaterial`
|
|
355
|
+
*/
|
|
219
356
|
function getMaterialCache(type) {
|
|
220
|
-
|
|
357
|
+
return cesium.Material._materialCache.getMaterial(type);
|
|
221
358
|
}
|
|
359
|
+
/**
|
|
360
|
+
* Add material to Cesium's material cache, alias of `Material._materialCache.addMaterial`
|
|
361
|
+
*/
|
|
222
362
|
function addMaterialCache(type, material) {
|
|
223
|
-
|
|
363
|
+
return cesium.Material._materialCache.addMaterial(type, material);
|
|
224
364
|
}
|
|
365
|
+
|
|
366
|
+
//#endregion
|
|
367
|
+
//#region utils/pick.ts
|
|
368
|
+
/**
|
|
369
|
+
* Analyze the result of Cesium's `scene.pick` and convert it to an array format
|
|
370
|
+
*/
|
|
225
371
|
function resolvePick(pick = {}) {
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
372
|
+
const { primitive, id, primitiveCollection, collection } = pick;
|
|
373
|
+
const entityCollection = id && id.entityCollection || null;
|
|
374
|
+
const dataSource = entityCollection && entityCollection.owner || null;
|
|
375
|
+
const ids = Array.isArray(id) ? id : [id].filter(Boolean);
|
|
376
|
+
return [
|
|
377
|
+
...ids,
|
|
378
|
+
primitive,
|
|
379
|
+
primitiveCollection,
|
|
380
|
+
collection,
|
|
381
|
+
entityCollection,
|
|
382
|
+
dataSource
|
|
383
|
+
].filter((e) => !!e);
|
|
238
384
|
}
|
|
385
|
+
/**
|
|
386
|
+
* Determine if the given array of graphics is hit by Cesium's `scene.pick`
|
|
387
|
+
*
|
|
388
|
+
* @param pick The `scene.pick` object used for matching
|
|
389
|
+
* @param graphic An array of graphics to check for hits
|
|
390
|
+
*/
|
|
239
391
|
function pickHitGraphic(pick, graphic) {
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
if (!elements.length) {
|
|
245
|
-
return false;
|
|
246
|
-
}
|
|
247
|
-
return elements.some((element) => graphic.includes(element));
|
|
392
|
+
if (!Array.isArray(graphic) || !graphic.length) return false;
|
|
393
|
+
const elements = resolvePick(pick);
|
|
394
|
+
if (!elements.length) return false;
|
|
395
|
+
return elements.some((element) => graphic.includes(element));
|
|
248
396
|
}
|
|
397
|
+
|
|
398
|
+
//#endregion
|
|
399
|
+
//#region utils/property.ts
|
|
400
|
+
/**
|
|
401
|
+
* Is Cesium.Property
|
|
402
|
+
* @param value - The target object
|
|
403
|
+
*/
|
|
249
404
|
function isProperty(value) {
|
|
250
|
-
|
|
405
|
+
return value && isFunction(value.getValue);
|
|
251
406
|
}
|
|
407
|
+
/**
|
|
408
|
+
* Converts a value that may be a Property into its target value, @see {toProperty} for the reverse operation
|
|
409
|
+
* ```typescript
|
|
410
|
+
* toPropertyValue('val') //=> 'val'
|
|
411
|
+
* toPropertyValue(new ConstantProperty('val')) //=> 'val'
|
|
412
|
+
* toPropertyValue(new CallbackProperty(()=>'val')) //=> 'val'
|
|
413
|
+
* ```
|
|
414
|
+
*
|
|
415
|
+
* @param value - The value to convert
|
|
416
|
+
*/
|
|
252
417
|
function toPropertyValue(value, time) {
|
|
253
|
-
|
|
418
|
+
return isProperty(value) ? value.getValue(time) : value;
|
|
254
419
|
}
|
|
420
|
+
/**
|
|
421
|
+
* Converts a value that may be a Property into a Property object, @see {toPropertyValue} for the reverse operation
|
|
422
|
+
*
|
|
423
|
+
* @param value - The property value or getter to convert, can be undefined or null
|
|
424
|
+
* @param isConstant - The second parameter for converting to CallbackProperty
|
|
425
|
+
* @returns Returns the converted Property object, if value is undefined or null, returns undefined
|
|
426
|
+
*/
|
|
255
427
|
function toProperty(value, isConstant = false) {
|
|
256
|
-
|
|
428
|
+
return isProperty(value) ? value : isFunction(value) ? new cesium.CallbackProperty(value, isConstant) : new cesium.ConstantProperty(value);
|
|
257
429
|
}
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
});
|
|
295
|
-
}
|
|
430
|
+
/**
|
|
431
|
+
* Create a Cesium property key
|
|
432
|
+
*
|
|
433
|
+
* @param scope The host object
|
|
434
|
+
* @param field The property name
|
|
435
|
+
* @param maybeProperty Optional property or getter
|
|
436
|
+
* @param readonly Whether the property is read-only
|
|
437
|
+
*/
|
|
438
|
+
function createPropertyField(scope, field, maybeProperty, readonly$2) {
|
|
439
|
+
let removeOwnerListener;
|
|
440
|
+
const ownerBinding = (value) => {
|
|
441
|
+
removeOwnerListener?.();
|
|
442
|
+
if ((0, cesium.defined)(value?.definitionChanged)) removeOwnerListener = value?.definitionChanged?.addEventListener(() => {
|
|
443
|
+
scope.definitionChanged.raiseEvent(scope, field, value, value);
|
|
444
|
+
});
|
|
445
|
+
};
|
|
446
|
+
const privateField = `_${field}`;
|
|
447
|
+
const property = toProperty(maybeProperty);
|
|
448
|
+
scope[privateField] = property;
|
|
449
|
+
ownerBinding(property);
|
|
450
|
+
if (readonly$2) Object.defineProperty(scope, field, { get() {
|
|
451
|
+
return scope[privateField];
|
|
452
|
+
} });
|
|
453
|
+
else Object.defineProperty(scope, field, {
|
|
454
|
+
get() {
|
|
455
|
+
return scope[privateField];
|
|
456
|
+
},
|
|
457
|
+
set(value) {
|
|
458
|
+
const previous = scope[privateField];
|
|
459
|
+
if (scope[privateField] !== value) {
|
|
460
|
+
scope[privateField] = value;
|
|
461
|
+
ownerBinding(value);
|
|
462
|
+
if ((0, cesium.defined)(scope.definitionChanged)) scope.definitionChanged.raiseEvent(scope, field, value, previous);
|
|
463
|
+
}
|
|
464
|
+
}
|
|
465
|
+
});
|
|
296
466
|
}
|
|
297
467
|
function createCesiumAttribute(scope, key, value, options = {}) {
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
}
|
|
331
|
-
const previous = Reflect.get(scope, privateKey);
|
|
332
|
-
if (previous !== value2) {
|
|
333
|
-
Reflect.set(scope, privateKey, value2);
|
|
334
|
-
changedEvent == null ? void 0 : changedEvent.raiseEvent.bind(changedEvent)(scope, key, value2, previous);
|
|
335
|
-
if (allowToProperty) {
|
|
336
|
-
serial(value2);
|
|
337
|
-
}
|
|
338
|
-
}
|
|
339
|
-
};
|
|
340
|
-
}
|
|
341
|
-
Object.defineProperty(scope, key, obj);
|
|
468
|
+
const allowToProperty = !!options.toProperty;
|
|
469
|
+
const shallowClone = !!options.shallowClone;
|
|
470
|
+
const changedEventKey = options.changedEventKey || "definitionChanged";
|
|
471
|
+
const changedEvent = Reflect.get(scope, changedEventKey);
|
|
472
|
+
const privateKey = `_${String(key)}`;
|
|
473
|
+
const attribute = allowToProperty ? toProperty(value) : value;
|
|
474
|
+
Reflect.set(scope, privateKey, attribute);
|
|
475
|
+
const obj = { get() {
|
|
476
|
+
const value$1 = Reflect.get(scope, privateKey);
|
|
477
|
+
if (shallowClone) return Array.isArray(value$1) ? [...value$1] : { ...value$1 };
|
|
478
|
+
else return value$1;
|
|
479
|
+
} };
|
|
480
|
+
let previousListener;
|
|
481
|
+
const serial = (property, previous) => {
|
|
482
|
+
previousListener?.();
|
|
483
|
+
previousListener = property?.definitionChanged?.addEventListener(() => {
|
|
484
|
+
changedEvent?.raiseEvent.bind(changedEvent)(scope, key, property, previous);
|
|
485
|
+
});
|
|
486
|
+
};
|
|
487
|
+
if (!options.readonly) {
|
|
488
|
+
if (allowToProperty && isProperty(value)) serial(value);
|
|
489
|
+
obj.set = (value$1) => {
|
|
490
|
+
if (allowToProperty && !isProperty(value$1)) throw new Error(`The value of ${String(key)} must be a Cesium.Property object`);
|
|
491
|
+
const previous = Reflect.get(scope, privateKey);
|
|
492
|
+
if (previous !== value$1) {
|
|
493
|
+
Reflect.set(scope, privateKey, value$1);
|
|
494
|
+
changedEvent?.raiseEvent.bind(changedEvent)(scope, key, value$1, previous);
|
|
495
|
+
if (allowToProperty) serial(value$1);
|
|
496
|
+
}
|
|
497
|
+
};
|
|
498
|
+
}
|
|
499
|
+
Object.defineProperty(scope, key, obj);
|
|
342
500
|
}
|
|
343
501
|
function createCesiumProperty(scope, key, value, options = {}) {
|
|
344
|
-
|
|
502
|
+
return createCesiumAttribute(scope, key, value, {
|
|
503
|
+
...options,
|
|
504
|
+
toProperty: true
|
|
505
|
+
});
|
|
345
506
|
}
|
|
507
|
+
|
|
508
|
+
//#endregion
|
|
509
|
+
//#region utils/throttle.ts
|
|
510
|
+
/**
|
|
511
|
+
* Throttle function, which limits the frequency of execution of the function
|
|
512
|
+
*
|
|
513
|
+
* @param callback raw function
|
|
514
|
+
* @param delay Throttled delay duration (ms)
|
|
515
|
+
* @param trailing Trigger callback function after last call @default true
|
|
516
|
+
* @param leading Trigger the callback function immediately on the first call @default false
|
|
517
|
+
* @returns Throttle function
|
|
518
|
+
*/
|
|
346
519
|
function throttle(callback, delay = 100, trailing = true, leading = false) {
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
restList[1] = rest;
|
|
373
|
-
}
|
|
374
|
-
if (!tracked) {
|
|
375
|
-
tracked = true;
|
|
376
|
-
trigger();
|
|
377
|
-
}
|
|
378
|
-
};
|
|
520
|
+
const restList = [];
|
|
521
|
+
let tracked = false;
|
|
522
|
+
const trigger = async () => {
|
|
523
|
+
await (0, __vueuse_core.promiseTimeout)(delay);
|
|
524
|
+
tracked = false;
|
|
525
|
+
if (leading) try {
|
|
526
|
+
callback(...restList[0]);
|
|
527
|
+
} catch (error) {
|
|
528
|
+
console.error(error);
|
|
529
|
+
}
|
|
530
|
+
if (trailing && (!leading || restList.length > 1)) try {
|
|
531
|
+
callback(...restList[restList.length - 1]);
|
|
532
|
+
} catch (error) {
|
|
533
|
+
console.error(error);
|
|
534
|
+
}
|
|
535
|
+
restList.length = 0;
|
|
536
|
+
};
|
|
537
|
+
return (...rest) => {
|
|
538
|
+
if (restList.length < 2) restList.push(rest);
|
|
539
|
+
else restList[1] = rest;
|
|
540
|
+
if (!tracked) {
|
|
541
|
+
tracked = true;
|
|
542
|
+
trigger();
|
|
543
|
+
}
|
|
544
|
+
};
|
|
379
545
|
}
|
|
546
|
+
|
|
547
|
+
//#endregion
|
|
548
|
+
//#region utils/toCartesian3.ts
|
|
549
|
+
/**
|
|
550
|
+
* Converts position to a coordinate point in the Cartesian coordinate system
|
|
551
|
+
*
|
|
552
|
+
* @param position Position information, which can be a Cartesian coordinate point (Cartesian3), a geographic coordinate point (Cartographic), an array, or an object containing WGS84 latitude, longitude, and height information
|
|
553
|
+
* @returns The converted Cartesian coordinate point. If the input parameter is invalid, undefined is returned
|
|
554
|
+
*/
|
|
380
555
|
function toCartesian3(position) {
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
} else if (position instanceof cesium.Cartographic) {
|
|
387
|
-
return cesium.Ellipsoid.WGS84.cartographicToCartesian(position);
|
|
388
|
-
} else if (Array.isArray(position)) {
|
|
389
|
-
return cesium.Cartesian3.fromDegrees(position[0], position[1], position[2]);
|
|
390
|
-
} else {
|
|
391
|
-
return cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, position.height);
|
|
392
|
-
}
|
|
556
|
+
if (!position) return void 0;
|
|
557
|
+
if (position instanceof cesium.Cartesian3) return position.clone();
|
|
558
|
+
else if (position instanceof cesium.Cartographic) return cesium.Ellipsoid.WGS84.cartographicToCartesian(position);
|
|
559
|
+
else if (Array.isArray(position)) return cesium.Cartesian3.fromDegrees(position[0], position[1], position[2]);
|
|
560
|
+
else return cesium.Cartesian3.fromDegrees(position.longitude, position.latitude, position.height);
|
|
393
561
|
}
|
|
562
|
+
|
|
563
|
+
//#endregion
|
|
564
|
+
//#region utils/toCartographic.ts
|
|
565
|
+
/**
|
|
566
|
+
* Converts a position to a Cartographic coordinate point
|
|
567
|
+
*
|
|
568
|
+
* @param position Position information, which can be a Cartesian3 coordinate point, a Cartographic coordinate point, an array, or an object containing WGS84 longitude, latitude, and height information
|
|
569
|
+
* @returns The converted Cartographic coordinate point, or undefined if the input parameter is invalid
|
|
570
|
+
*/
|
|
394
571
|
function toCartographic(position) {
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
} else if (position instanceof cesium.Cartographic) {
|
|
401
|
-
return position.clone();
|
|
402
|
-
} else if (Array.isArray(position)) {
|
|
403
|
-
return cesium.Cartographic.fromDegrees(position[0], position[1], position[2]);
|
|
404
|
-
} else {
|
|
405
|
-
return cesium.Cartographic.fromDegrees(position.longitude, position.latitude, position.height);
|
|
406
|
-
}
|
|
572
|
+
if (!position) return void 0;
|
|
573
|
+
if (position instanceof cesium.Cartesian3) return cesium.Ellipsoid.WGS84.cartesianToCartographic(position);
|
|
574
|
+
else if (position instanceof cesium.Cartographic) return position.clone();
|
|
575
|
+
else if (Array.isArray(position)) return cesium.Cartographic.fromDegrees(position[0], position[1], position[2]);
|
|
576
|
+
else return cesium.Cartographic.fromDegrees(position.longitude, position.latitude, position.height);
|
|
407
577
|
}
|
|
578
|
+
|
|
579
|
+
//#endregion
|
|
580
|
+
//#region utils/tryRun.ts
|
|
581
|
+
/**
|
|
582
|
+
* Safely execute the provided function without throwing errors,
|
|
583
|
+
* essentially a simple wrapper around a `try...catch...` block
|
|
584
|
+
*/
|
|
408
585
|
function tryRun(fn) {
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
586
|
+
return (...args) => {
|
|
587
|
+
try {
|
|
588
|
+
return fn?.(...args);
|
|
589
|
+
} catch (error) {
|
|
590
|
+
console.error(error);
|
|
591
|
+
}
|
|
592
|
+
};
|
|
416
593
|
}
|
|
594
|
+
|
|
595
|
+
//#endregion
|
|
596
|
+
//#region toPromiseValue/index.ts
|
|
597
|
+
/**
|
|
598
|
+
* Similar to Vue's built-in `toValue`, but capable of handling asynchronous functions, thus returning a `await value`.
|
|
599
|
+
*
|
|
600
|
+
* Used in conjunction with VueUse's `computedAsync`.
|
|
601
|
+
*
|
|
602
|
+
* @param source The source value, which can be a reactive reference or an asynchronous getter.
|
|
603
|
+
* @param options Conversion options
|
|
604
|
+
* @returns The converted value.
|
|
605
|
+
*
|
|
606
|
+
* @example
|
|
607
|
+
* ```ts
|
|
608
|
+
*
|
|
609
|
+
* const data = computedAsync(async ()=> {
|
|
610
|
+
* return await toPromiseValue(promiseRef)
|
|
611
|
+
* })
|
|
612
|
+
*
|
|
613
|
+
* ```
|
|
614
|
+
*/
|
|
417
615
|
async function toPromiseValue(source, options = {}) {
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
}
|
|
616
|
+
try {
|
|
617
|
+
const { raw = true } = options;
|
|
618
|
+
let value;
|
|
619
|
+
if (isFunction(source)) value = await source();
|
|
620
|
+
else {
|
|
621
|
+
const result = (0, vue.toValue)(source);
|
|
622
|
+
value = isPromise(result) ? await result : result;
|
|
623
|
+
}
|
|
624
|
+
return raw ? (0, vue.toRaw)(value) : value;
|
|
625
|
+
} catch (error) {
|
|
626
|
+
console.error(error);
|
|
627
|
+
throw error;
|
|
628
|
+
}
|
|
432
629
|
}
|
|
630
|
+
|
|
631
|
+
//#endregion
|
|
632
|
+
//#region useCesiumEventListener/index.ts
|
|
633
|
+
/**
|
|
634
|
+
* Easily use the `addEventListener` in `Cesium.Event` instances,
|
|
635
|
+
* when the dependent data changes or the component is unmounted,
|
|
636
|
+
* the listener function will automatically reload or destroy.
|
|
637
|
+
*
|
|
638
|
+
* @param event The Cesium.Event instance
|
|
639
|
+
* @param listener The listener function
|
|
640
|
+
* @param options additional options
|
|
641
|
+
* @returns A function that can be called to remove the event listener
|
|
642
|
+
*/
|
|
433
643
|
function useCesiumEventListener(event, listener, options = {}) {
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
644
|
+
const isActive = (0, vue.toRef)(options.isActive ?? true);
|
|
645
|
+
const cleanup = (0, vue.watchEffect)((onCleanup) => {
|
|
646
|
+
const _event = (0, vue.toValue)(event);
|
|
647
|
+
const events = Array.isArray(_event) ? _event : [_event];
|
|
648
|
+
if (events) {
|
|
649
|
+
if (events.length && isActive.value) {
|
|
650
|
+
const stopFns = events.map((event$1) => {
|
|
651
|
+
const e = (0, vue.toValue)(event$1);
|
|
652
|
+
return e?.addEventListener(listener, e);
|
|
653
|
+
});
|
|
654
|
+
onCleanup(() => stopFns.forEach((stop) => stop?.()));
|
|
655
|
+
}
|
|
656
|
+
}
|
|
657
|
+
});
|
|
658
|
+
(0, __vueuse_core.tryOnScopeDispose)(cleanup.stop);
|
|
659
|
+
return cleanup.stop;
|
|
450
660
|
}
|
|
661
|
+
|
|
662
|
+
//#endregion
|
|
663
|
+
//#region useViewer/index.ts
|
|
664
|
+
/**
|
|
665
|
+
* Obtain the `Viewer` instance injected through `createViewer` in the current component or its ancestor components.
|
|
666
|
+
*
|
|
667
|
+
* note:
|
|
668
|
+
* - If `createViewer` and `useViewer` are called in the same component, the `Viewer` instance injected by `createViewer` will be used preferentially.
|
|
669
|
+
* - When calling `createViewer` and `useViewer` in the same component, `createViewer` should be called before `useViewer`.
|
|
670
|
+
*/
|
|
451
671
|
function useViewer() {
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
"The `Viewer` instance injected by `createViewer` was not found in the current component or its ancestor components. Have you called `createViewer`?"
|
|
461
|
-
);
|
|
462
|
-
}
|
|
463
|
-
return injectViewer;
|
|
464
|
-
}
|
|
672
|
+
const scope = (0, vue.getCurrentScope)();
|
|
673
|
+
const instanceViewer = scope ? CREATE_VIEWER_COLLECTION.get(scope) : void 0;
|
|
674
|
+
if (instanceViewer) return instanceViewer;
|
|
675
|
+
else {
|
|
676
|
+
const injectViewer = (0, vue.inject)(CREATE_VIEWER_INJECTION_KEY);
|
|
677
|
+
if (!injectViewer) throw new Error("The `Viewer` instance injected by `createViewer` was not found in the current component or its ancestor components. Have you called `createViewer`?");
|
|
678
|
+
return injectViewer;
|
|
679
|
+
}
|
|
465
680
|
}
|
|
681
|
+
|
|
682
|
+
//#endregion
|
|
683
|
+
//#region useCameraState/index.ts
|
|
684
|
+
/**
|
|
685
|
+
* Reactive Cesium Camera state
|
|
686
|
+
* @param options options
|
|
687
|
+
* @returns Reactive camera states
|
|
688
|
+
*/
|
|
466
689
|
function useCameraState(options = {}) {
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.direction) == null ? void 0 : _b.clone() : void 0;
|
|
501
|
-
}),
|
|
502
|
-
up: vue.computed(() => {
|
|
503
|
-
var _a, _b;
|
|
504
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.up) == null ? void 0 : _b.clone() : void 0;
|
|
505
|
-
}),
|
|
506
|
-
right: vue.computed(() => {
|
|
507
|
-
var _a, _b;
|
|
508
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.right) == null ? void 0 : _b.clone() : void 0;
|
|
509
|
-
}),
|
|
510
|
-
positionCartographic: vue.computed(() => {
|
|
511
|
-
var _a, _b;
|
|
512
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.positionCartographic) == null ? void 0 : _b.clone() : void 0;
|
|
513
|
-
}),
|
|
514
|
-
positionWC: vue.computed(() => {
|
|
515
|
-
var _a, _b;
|
|
516
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.positionWC) == null ? void 0 : _b.clone() : void 0;
|
|
517
|
-
}),
|
|
518
|
-
directionWC: vue.computed(() => {
|
|
519
|
-
var _a, _b;
|
|
520
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.directionWC) == null ? void 0 : _b.clone() : void 0;
|
|
521
|
-
}),
|
|
522
|
-
upWC: vue.computed(() => {
|
|
523
|
-
var _a, _b;
|
|
524
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.directionWC) == null ? void 0 : _b.clone() : void 0;
|
|
525
|
-
}),
|
|
526
|
-
rightWC: vue.computed(() => {
|
|
527
|
-
var _a, _b;
|
|
528
|
-
return changedSymbol.value ? (_b = (_a = camera.value) == null ? void 0 : _a.directionWC) == null ? void 0 : _b.clone() : void 0;
|
|
529
|
-
}),
|
|
530
|
-
viewRectangle: vue.computed(() => {
|
|
531
|
-
var _a;
|
|
532
|
-
return changedSymbol.value ? (_a = camera.value) == null ? void 0 : _a.computeViewRectangle() : void 0;
|
|
533
|
-
}),
|
|
534
|
-
heading: vue.computed(() => {
|
|
535
|
-
var _a;
|
|
536
|
-
return changedSymbol.value ? (_a = camera.value) == null ? void 0 : _a.heading : void 0;
|
|
537
|
-
}),
|
|
538
|
-
pitch: vue.computed(() => {
|
|
539
|
-
var _a;
|
|
540
|
-
return changedSymbol.value ? (_a = camera.value) == null ? void 0 : _a.pitch : void 0;
|
|
541
|
-
}),
|
|
542
|
-
roll: vue.computed(() => {
|
|
543
|
-
var _a;
|
|
544
|
-
return changedSymbol.value ? (_a = camera.value) == null ? void 0 : _a.roll : void 0;
|
|
545
|
-
}),
|
|
546
|
-
level: vue.computed(() => {
|
|
547
|
-
var _a, _b;
|
|
548
|
-
return changedSymbol.value && ((_b = (_a = camera.value) == null ? void 0 : _a.positionCartographic) == null ? void 0 : _b.height) ? computeLevel(camera.value.positionCartographic.height) : void 0;
|
|
549
|
-
})
|
|
550
|
-
};
|
|
690
|
+
let getCamera = options.camera;
|
|
691
|
+
if (!getCamera) {
|
|
692
|
+
const viewer = useViewer();
|
|
693
|
+
getCamera = () => viewer.value?.scene.camera;
|
|
694
|
+
}
|
|
695
|
+
const camera = (0, vue.computed)(() => (0, vue.toValue)(getCamera));
|
|
696
|
+
const event = (0, vue.computed)(() => {
|
|
697
|
+
const eventField = (0, vue.toValue)(options.event) || "changed";
|
|
698
|
+
return camera.value?.[eventField];
|
|
699
|
+
});
|
|
700
|
+
const changedSymbol = (0, __vueuse_core.refThrottled)((0, vue.shallowRef)(Symbol("camera change")), options.delay ?? 8, true, false);
|
|
701
|
+
const setChangedSymbol = () => {
|
|
702
|
+
changedSymbol.value = Symbol("camera change");
|
|
703
|
+
};
|
|
704
|
+
(0, vue.watch)(camera, () => setChangedSymbol());
|
|
705
|
+
useCesiumEventListener(event, () => setChangedSymbol());
|
|
706
|
+
return {
|
|
707
|
+
camera,
|
|
708
|
+
position: (0, vue.computed)(() => changedSymbol.value ? camera.value?.position?.clone() : void 0),
|
|
709
|
+
direction: (0, vue.computed)(() => changedSymbol.value ? camera.value?.direction?.clone() : void 0),
|
|
710
|
+
up: (0, vue.computed)(() => changedSymbol.value ? camera.value?.up?.clone() : void 0),
|
|
711
|
+
right: (0, vue.computed)(() => changedSymbol.value ? camera.value?.right?.clone() : void 0),
|
|
712
|
+
positionCartographic: (0, vue.computed)(() => changedSymbol.value ? camera.value?.positionCartographic?.clone() : void 0),
|
|
713
|
+
positionWC: (0, vue.computed)(() => changedSymbol.value ? camera.value?.positionWC?.clone() : void 0),
|
|
714
|
+
directionWC: (0, vue.computed)(() => changedSymbol.value ? camera.value?.directionWC?.clone() : void 0),
|
|
715
|
+
upWC: (0, vue.computed)(() => changedSymbol.value ? camera.value?.directionWC?.clone() : void 0),
|
|
716
|
+
rightWC: (0, vue.computed)(() => changedSymbol.value ? camera.value?.directionWC?.clone() : void 0),
|
|
717
|
+
viewRectangle: (0, vue.computed)(() => changedSymbol.value ? camera.value?.computeViewRectangle() : void 0),
|
|
718
|
+
heading: (0, vue.computed)(() => changedSymbol.value ? camera.value?.heading : void 0),
|
|
719
|
+
pitch: (0, vue.computed)(() => changedSymbol.value ? camera.value?.pitch : void 0),
|
|
720
|
+
roll: (0, vue.computed)(() => changedSymbol.value ? camera.value?.roll : void 0),
|
|
721
|
+
level: (0, vue.computed)(() => changedSymbol.value && camera.value?.positionCartographic?.height ? computeLevel(camera.value.positionCartographic.height) : void 0)
|
|
722
|
+
};
|
|
551
723
|
}
|
|
552
724
|
const A = 40487.57;
|
|
553
725
|
const B = 7096758e-11;
|
|
554
726
|
const C = 91610.74;
|
|
555
727
|
const D = -40467.74;
|
|
728
|
+
/**
|
|
729
|
+
* Compute the camera level at a given height.
|
|
730
|
+
*/
|
|
556
731
|
function computeLevel(height) {
|
|
557
|
-
|
|
732
|
+
return D + (A - D) / (1 + (height / C) ** B);
|
|
558
733
|
}
|
|
734
|
+
|
|
735
|
+
//#endregion
|
|
736
|
+
//#region useCesiumFps/index.ts
|
|
737
|
+
/**
|
|
738
|
+
* Reactive get the frame rate of Cesium
|
|
739
|
+
* @param options options
|
|
740
|
+
* @returns Reactive fps states
|
|
741
|
+
*/
|
|
559
742
|
function useCesiumFps(options = {}) {
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
});
|
|
576
|
-
const fps = vue.computed(() => {
|
|
577
|
-
return 1e3 / interval.value;
|
|
578
|
-
});
|
|
579
|
-
return {
|
|
580
|
-
interval: vue.readonly(interval),
|
|
581
|
-
fps
|
|
582
|
-
};
|
|
743
|
+
const { delay = 100 } = options;
|
|
744
|
+
const viewer = useViewer();
|
|
745
|
+
const p = (0, vue.shallowRef)(performance.now());
|
|
746
|
+
useCesiumEventListener(() => viewer.value?.scene.postRender, () => p.value = performance.now());
|
|
747
|
+
const interval = (0, vue.ref)(0);
|
|
748
|
+
(0, __vueuse_core.watchThrottled)(p, (value, oldValue) => {
|
|
749
|
+
interval.value = value - oldValue;
|
|
750
|
+
}, { throttle: delay });
|
|
751
|
+
const fps = (0, vue.computed)(() => {
|
|
752
|
+
return 1e3 / interval.value;
|
|
753
|
+
});
|
|
754
|
+
return {
|
|
755
|
+
interval: (0, vue.readonly)(interval),
|
|
756
|
+
fps
|
|
757
|
+
};
|
|
583
758
|
}
|
|
759
|
+
|
|
760
|
+
//#endregion
|
|
761
|
+
//#region useCollectionScope/index.ts
|
|
762
|
+
/**
|
|
763
|
+
* Scope the SideEffects of Cesium-related `Collection` and automatically remove them when unmounted.
|
|
764
|
+
* - note: This is a basic function that is intended to be called by other lower-level function
|
|
765
|
+
* @param addFn - add SideEffect function. eg.`entites.add`
|
|
766
|
+
* @param removeFn - Clean SideEffect function. eg.`entities.remove`
|
|
767
|
+
* @param removeScopeArgs - The parameters to pass for `removeScope` triggered when the component is unmounted
|
|
768
|
+
*
|
|
769
|
+
* @returns Contains side effect addition and removal functions
|
|
770
|
+
*/
|
|
584
771
|
function useCollectionScope(addFn, removeFn, removeScopeArgs) {
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
removeWhere,
|
|
622
|
-
removeScope
|
|
623
|
-
};
|
|
772
|
+
const scope = (0, vue.shallowReactive)(/* @__PURE__ */ new Set());
|
|
773
|
+
const add = (instance, ...args) => {
|
|
774
|
+
const result = addFn(instance, ...args);
|
|
775
|
+
if (isPromise(result)) return new Promise((resolve, reject) => {
|
|
776
|
+
result.then((i) => {
|
|
777
|
+
scope.add(i);
|
|
778
|
+
resolve(i);
|
|
779
|
+
}).catch((error) => reject(error));
|
|
780
|
+
});
|
|
781
|
+
else {
|
|
782
|
+
scope.add(result);
|
|
783
|
+
return result;
|
|
784
|
+
}
|
|
785
|
+
};
|
|
786
|
+
const remove = (instance, ...args) => {
|
|
787
|
+
scope.delete(instance);
|
|
788
|
+
return removeFn(instance, ...args);
|
|
789
|
+
};
|
|
790
|
+
const removeWhere = (predicate, ...args) => {
|
|
791
|
+
scope.forEach((instance) => {
|
|
792
|
+
if (predicate(instance)) remove(instance, ...args);
|
|
793
|
+
});
|
|
794
|
+
};
|
|
795
|
+
const removeScope = (...args) => {
|
|
796
|
+
scope.forEach((instance) => {
|
|
797
|
+
remove(instance, ...args);
|
|
798
|
+
});
|
|
799
|
+
};
|
|
800
|
+
(0, __vueuse_core.tryOnScopeDispose)(() => removeScope(...removeScopeArgs));
|
|
801
|
+
return {
|
|
802
|
+
scope: (0, vue.shallowReadonly)(scope),
|
|
803
|
+
add,
|
|
804
|
+
remove,
|
|
805
|
+
removeWhere,
|
|
806
|
+
removeScope
|
|
807
|
+
};
|
|
624
808
|
}
|
|
809
|
+
|
|
810
|
+
//#endregion
|
|
811
|
+
//#region useDataSource/index.ts
|
|
625
812
|
function useDataSource(dataSources, options = {}) {
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
const _isActive = vue.toValue(isActive);
|
|
643
|
-
if (_isActive) {
|
|
644
|
-
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
645
|
-
const _collection = collection ?? ((_a = viewer.value) == null ? void 0 : _a.dataSources);
|
|
646
|
-
list.forEach((item) => item && (_collection == null ? void 0 : _collection.add(item)));
|
|
647
|
-
onCleanup(() => {
|
|
648
|
-
const destroy = vue.toValue(destroyOnRemove);
|
|
649
|
-
!(_collection == null ? void 0 : _collection.isDestroyed()) && list.forEach((dataSource) => dataSource && (_collection == null ? void 0 : _collection.remove(dataSource, destroy)));
|
|
650
|
-
});
|
|
651
|
-
}
|
|
652
|
-
});
|
|
653
|
-
return result;
|
|
813
|
+
const { destroyOnRemove, collection, isActive = true, evaluating } = options;
|
|
814
|
+
const result = (0, __vueuse_core.computedAsync)(() => toPromiseValue(dataSources), void 0, { evaluating });
|
|
815
|
+
const viewer = useViewer();
|
|
816
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
817
|
+
const _isActive = (0, vue.toValue)(isActive);
|
|
818
|
+
if (_isActive) {
|
|
819
|
+
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
820
|
+
const _collection = collection ?? viewer.value?.dataSources;
|
|
821
|
+
list.forEach((item) => item && _collection?.add(item));
|
|
822
|
+
onCleanup(() => {
|
|
823
|
+
const destroy = (0, vue.toValue)(destroyOnRemove);
|
|
824
|
+
!_collection?.isDestroyed() && list.forEach((dataSource) => dataSource && _collection?.remove(dataSource, destroy));
|
|
825
|
+
});
|
|
826
|
+
}
|
|
827
|
+
});
|
|
828
|
+
return result;
|
|
654
829
|
}
|
|
830
|
+
|
|
831
|
+
//#endregion
|
|
832
|
+
//#region useDataSourceScope/index.ts
|
|
833
|
+
/**
|
|
834
|
+
* // Scope the SideEffects of `DataSourceCollection` operations and automatically remove them when unmounted
|
|
835
|
+
*/
|
|
655
836
|
function useDataSourceScope(options = {}) {
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
remove,
|
|
677
|
-
removeWhere,
|
|
678
|
-
removeScope
|
|
679
|
-
};
|
|
837
|
+
const { collection: _collection, destroyOnRemove } = options;
|
|
838
|
+
const viewer = useViewer();
|
|
839
|
+
const collection = (0, vue.computed)(() => {
|
|
840
|
+
return (0, vue.toValue)(_collection) ?? viewer.value?.dataSources;
|
|
841
|
+
});
|
|
842
|
+
const addFn = (dataSource) => {
|
|
843
|
+
if (!collection.value) throw new Error("collection is not defined");
|
|
844
|
+
return collection.value.add(dataSource);
|
|
845
|
+
};
|
|
846
|
+
const removeFn = (dataSource, destroy) => {
|
|
847
|
+
return !!collection.value?.remove(dataSource, destroy);
|
|
848
|
+
};
|
|
849
|
+
const { scope, add, remove, removeWhere, removeScope } = useCollectionScope(addFn, removeFn, [destroyOnRemove]);
|
|
850
|
+
return {
|
|
851
|
+
scope,
|
|
852
|
+
add,
|
|
853
|
+
remove,
|
|
854
|
+
removeWhere,
|
|
855
|
+
removeScope
|
|
856
|
+
};
|
|
680
857
|
}
|
|
858
|
+
|
|
859
|
+
//#endregion
|
|
860
|
+
//#region useElementOverlay/index.ts
|
|
861
|
+
/**
|
|
862
|
+
* Cesium HtmlElement Overlay
|
|
863
|
+
*/
|
|
681
864
|
function useElementOverlay(target, position, options = {}) {
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
x: finalOffset.value.x + data.x,
|
|
747
|
-
y: finalOffset.value.y + data.y
|
|
748
|
-
};
|
|
749
|
-
});
|
|
750
|
-
const x = vue.computed(() => location.value.x);
|
|
751
|
-
const y = vue.computed(() => location.value.y);
|
|
752
|
-
const style = vue.computed(() => {
|
|
753
|
-
var _a, _b;
|
|
754
|
-
return { left: `${(_a = x.value) == null ? void 0 : _a.toFixed(2)}px`, top: `${(_b = y.value) == null ? void 0 : _b.toFixed(2)}px` };
|
|
755
|
-
});
|
|
756
|
-
vue.watchEffect(() => {
|
|
757
|
-
var _a, _b, _c, _d;
|
|
758
|
-
const element = vue.toValue(target);
|
|
759
|
-
if (element && vue.toValue(options.applyStyle ?? true)) {
|
|
760
|
-
(_b = (_a = element.style) == null ? void 0 : _a.setProperty) == null ? void 0 : _b.call(_a, "left", style.value.left);
|
|
761
|
-
(_d = (_c = element.style) == null ? void 0 : _c.setProperty) == null ? void 0 : _d.call(_c, "top", style.value.top);
|
|
762
|
-
}
|
|
763
|
-
});
|
|
764
|
-
return {
|
|
765
|
-
x,
|
|
766
|
-
y,
|
|
767
|
-
style
|
|
768
|
-
};
|
|
865
|
+
const { referenceWindow, horizontal = "center", vertical = "bottom", offset = {
|
|
866
|
+
x: 0,
|
|
867
|
+
y: 0
|
|
868
|
+
} } = options;
|
|
869
|
+
const cartesian3 = (0, vue.computed)(() => toCartesian3((0, vue.toValue)(position)));
|
|
870
|
+
const viewer = useViewer();
|
|
871
|
+
const coord = (0, vue.shallowRef)();
|
|
872
|
+
useCesiumEventListener(() => viewer.value?.scene.postRender, () => {
|
|
873
|
+
if (!viewer.value?.scene) return;
|
|
874
|
+
if (!cartesian3.value) coord.value = void 0;
|
|
875
|
+
else {
|
|
876
|
+
const reslut = cartesianToCanvasCoord(cartesian3.value, viewer.value.scene);
|
|
877
|
+
coord.value = !cesium.Cartesian2.equals(reslut, coord.value) ? reslut : coord.value;
|
|
878
|
+
}
|
|
879
|
+
});
|
|
880
|
+
const canvasBounding = (0, __vueuse_core.useElementBounding)(() => viewer.value?.canvas.parentElement);
|
|
881
|
+
const targetBounding = (0, __vueuse_core.useElementBounding)(target);
|
|
882
|
+
const finalOffset = (0, vue.computed)(() => {
|
|
883
|
+
const _offset = (0, vue.toValue)(offset);
|
|
884
|
+
let x$1 = _offset?.x ?? 0;
|
|
885
|
+
const _horizontal = (0, vue.toValue)(horizontal);
|
|
886
|
+
if (_horizontal === "center") x$1 -= targetBounding.width.value / 2;
|
|
887
|
+
else if (_horizontal === "right") x$1 -= targetBounding.width.value;
|
|
888
|
+
let y$1 = _offset?.y ?? 0;
|
|
889
|
+
const _vertical = (0, vue.toValue)(vertical);
|
|
890
|
+
if (_vertical === "center") y$1 -= targetBounding.height.value / 2;
|
|
891
|
+
else if (_vertical === "bottom") y$1 -= targetBounding.height.value;
|
|
892
|
+
return {
|
|
893
|
+
x: x$1,
|
|
894
|
+
y: y$1
|
|
895
|
+
};
|
|
896
|
+
});
|
|
897
|
+
const location = (0, vue.computed)(() => {
|
|
898
|
+
const data = {
|
|
899
|
+
x: coord.value?.x ?? 0,
|
|
900
|
+
y: coord.value?.y ?? 0
|
|
901
|
+
};
|
|
902
|
+
if ((0, vue.toValue)(referenceWindow)) {
|
|
903
|
+
data.x += canvasBounding.x.value;
|
|
904
|
+
data.y += canvasBounding.y.value;
|
|
905
|
+
}
|
|
906
|
+
return {
|
|
907
|
+
x: finalOffset.value.x + data.x,
|
|
908
|
+
y: finalOffset.value.y + data.y
|
|
909
|
+
};
|
|
910
|
+
});
|
|
911
|
+
const x = (0, vue.computed)(() => location.value.x);
|
|
912
|
+
const y = (0, vue.computed)(() => location.value.y);
|
|
913
|
+
const style = (0, vue.computed)(() => ({
|
|
914
|
+
left: `${x.value?.toFixed(2)}px`,
|
|
915
|
+
top: `${y.value?.toFixed(2)}px`
|
|
916
|
+
}));
|
|
917
|
+
(0, vue.watchEffect)(() => {
|
|
918
|
+
const element = (0, vue.toValue)(target);
|
|
919
|
+
if (element && (0, vue.toValue)(options.applyStyle ?? true)) {
|
|
920
|
+
element.style?.setProperty?.("left", style.value.left);
|
|
921
|
+
element.style?.setProperty?.("top", style.value.top);
|
|
922
|
+
}
|
|
923
|
+
});
|
|
924
|
+
return {
|
|
925
|
+
x,
|
|
926
|
+
y,
|
|
927
|
+
style
|
|
928
|
+
};
|
|
769
929
|
}
|
|
930
|
+
|
|
931
|
+
//#endregion
|
|
932
|
+
//#region useEntity/index.ts
|
|
770
933
|
function useEntity(data, options = {}) {
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
list.forEach((item) => item && (_collection == null ? void 0 : _collection.add(item)));
|
|
787
|
-
onCleanup(() => {
|
|
788
|
-
list.forEach((item) => item && (_collection == null ? void 0 : _collection.remove(item)));
|
|
789
|
-
});
|
|
790
|
-
}
|
|
791
|
-
});
|
|
792
|
-
return result;
|
|
934
|
+
const { collection, isActive = true, evaluating } = options;
|
|
935
|
+
const result = (0, __vueuse_core.computedAsync)(() => toPromiseValue(data), [], { evaluating });
|
|
936
|
+
const viewer = useViewer();
|
|
937
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
938
|
+
const _isActive = (0, vue.toValue)(isActive);
|
|
939
|
+
if (_isActive) {
|
|
940
|
+
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
941
|
+
const _collection = collection ?? viewer.value?.entities;
|
|
942
|
+
list.forEach((item) => item && _collection?.add(item));
|
|
943
|
+
onCleanup(() => {
|
|
944
|
+
list.forEach((item) => item && _collection?.remove(item));
|
|
945
|
+
});
|
|
946
|
+
}
|
|
947
|
+
});
|
|
948
|
+
return result;
|
|
793
949
|
}
|
|
950
|
+
|
|
951
|
+
//#endregion
|
|
952
|
+
//#region useEntityScope/index.ts
|
|
953
|
+
/**
|
|
954
|
+
* Make `add` and `remove` operations of `EntityCollection` scoped,
|
|
955
|
+
* automatically remove `Entity` instance when component is unmounted.
|
|
956
|
+
*/
|
|
794
957
|
function useEntityScope(options = {}) {
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
scope,
|
|
817
|
-
add,
|
|
818
|
-
remove,
|
|
819
|
-
removeWhere,
|
|
820
|
-
removeScope
|
|
821
|
-
};
|
|
958
|
+
const { collection: _collection } = options;
|
|
959
|
+
const viewer = useViewer();
|
|
960
|
+
const collection = (0, vue.computed)(() => {
|
|
961
|
+
return (0, vue.toValue)(_collection) ?? viewer.value?.entities;
|
|
962
|
+
});
|
|
963
|
+
const addFn = (entity) => {
|
|
964
|
+
if (!collection.value) throw new Error("collection is not defined");
|
|
965
|
+
if (!collection.value.contains(entity)) collection.value.add(entity);
|
|
966
|
+
return entity;
|
|
967
|
+
};
|
|
968
|
+
const removeFn = (entity) => {
|
|
969
|
+
return !!collection.value?.remove(entity);
|
|
970
|
+
};
|
|
971
|
+
const { scope, add, remove, removeWhere, removeScope } = useCollectionScope(addFn, removeFn, []);
|
|
972
|
+
return {
|
|
973
|
+
scope,
|
|
974
|
+
add,
|
|
975
|
+
remove,
|
|
976
|
+
removeWhere,
|
|
977
|
+
removeScope
|
|
978
|
+
};
|
|
822
979
|
}
|
|
980
|
+
|
|
981
|
+
//#endregion
|
|
982
|
+
//#region useScenePick/index.ts
|
|
823
983
|
const pickCache = /* @__PURE__ */ new WeakMap();
|
|
984
|
+
/**
|
|
985
|
+
* Uses the `scene.pick` function in Cesium's Scene object to perform screen point picking,
|
|
986
|
+
* return a computed property containing the pick result, or undefined if no object is picked.
|
|
987
|
+
*
|
|
988
|
+
* @param windowPosition The screen coordinates of the pick point.
|
|
989
|
+
*/
|
|
824
990
|
function useScenePick(windowPosition, options = {}) {
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
pick.value = (_a = viewer.value) == null ? void 0 : _a.scene.pick(
|
|
842
|
-
position.value,
|
|
843
|
-
vue.toValue(width),
|
|
844
|
-
vue.toValue(height)
|
|
845
|
-
);
|
|
846
|
-
}
|
|
847
|
-
}
|
|
848
|
-
});
|
|
849
|
-
return pick;
|
|
991
|
+
const { width = 3, height = 3, throttled = 8 } = options;
|
|
992
|
+
const isActive = (0, vue.toRef)(options.isActive ?? true);
|
|
993
|
+
const viewer = useViewer();
|
|
994
|
+
const position = (0, __vueuse_core.refThrottled)((0, vue.computed)(() => (0, vue.toValue)(windowPosition)?.clone()), throttled, false, true);
|
|
995
|
+
const pick = (0, vue.shallowRef)();
|
|
996
|
+
(0, vue.watchEffect)(() => {
|
|
997
|
+
if (viewer.value && position.value && isActive.value) {
|
|
998
|
+
const cache = pickCache.get(viewer.value);
|
|
999
|
+
if (cache && cache[0].equals(position.value)) pick.value = cache[1];
|
|
1000
|
+
else {
|
|
1001
|
+
pickCache.set(viewer.value, [position.value.clone(), pick.value]);
|
|
1002
|
+
pick.value = viewer.value?.scene.pick(position.value, (0, vue.toValue)(width), (0, vue.toValue)(height));
|
|
1003
|
+
}
|
|
1004
|
+
}
|
|
1005
|
+
});
|
|
1006
|
+
return pick;
|
|
850
1007
|
}
|
|
1008
|
+
|
|
1009
|
+
//#endregion
|
|
1010
|
+
//#region useScreenSpaceEventHandler/index.ts
|
|
1011
|
+
/**
|
|
1012
|
+
* Easily use the `ScreenSpaceEventHandler`,
|
|
1013
|
+
* when the dependent data changes or the component is unmounted,
|
|
1014
|
+
* the listener function will automatically reload or destroy.
|
|
1015
|
+
*
|
|
1016
|
+
* @param type Types of mouse event
|
|
1017
|
+
* @param inputAction Callback function for listening
|
|
1018
|
+
*/
|
|
851
1019
|
function useScreenSpaceEventHandler(type, inputAction, options = {}) {
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
863
|
-
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
const stop = () => {
|
|
878
|
-
cleanup1();
|
|
879
|
-
cleanup2();
|
|
880
|
-
};
|
|
881
|
-
core.tryOnScopeDispose(stop);
|
|
882
|
-
return stop;
|
|
1020
|
+
const { modifier } = options;
|
|
1021
|
+
const viewer = useViewer();
|
|
1022
|
+
const isActive = (0, vue.toRef)(options.isActive ?? true);
|
|
1023
|
+
const handler = (0, vue.computed)(() => {
|
|
1024
|
+
if (viewer.value?.cesiumWidget?.canvas) return new cesium.ScreenSpaceEventHandler(viewer.value.cesiumWidget.canvas);
|
|
1025
|
+
});
|
|
1026
|
+
const cleanup1 = (0, vue.watch)(handler, (_value, previous) => {
|
|
1027
|
+
viewer.value?.cesiumWidget && previous?.destroy();
|
|
1028
|
+
});
|
|
1029
|
+
const cleanup2 = (0, vue.watchEffect)((onCleanup) => {
|
|
1030
|
+
const typeValue = (0, vue.toValue)(type);
|
|
1031
|
+
const modifierValue = (0, vue.toValue)(modifier);
|
|
1032
|
+
const handlerValue = (0, vue.toValue)(handler);
|
|
1033
|
+
if (!handlerValue || !isActive.value || !inputAction) return;
|
|
1034
|
+
if (isDef(typeValue)) {
|
|
1035
|
+
handlerValue.setInputAction(inputAction, typeValue, modifierValue);
|
|
1036
|
+
onCleanup(() => handlerValue.removeInputAction(typeValue, modifierValue));
|
|
1037
|
+
}
|
|
1038
|
+
});
|
|
1039
|
+
const stop = () => {
|
|
1040
|
+
cleanup1();
|
|
1041
|
+
cleanup2();
|
|
1042
|
+
};
|
|
1043
|
+
(0, __vueuse_core.tryOnScopeDispose)(stop);
|
|
1044
|
+
return stop;
|
|
883
1045
|
}
|
|
1046
|
+
|
|
1047
|
+
//#endregion
|
|
1048
|
+
//#region useGraphicEvent/useDrag.ts
|
|
1049
|
+
/**
|
|
1050
|
+
* Use graphic drag events with ease, and remove listener automatically on unmounted.
|
|
1051
|
+
*/
|
|
884
1052
|
function useDrag(listener) {
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
if (pick.value && motionEvent.value) {
|
|
941
|
-
execute(pick.value, motionEvent.value.endPosition, event.position);
|
|
942
|
-
}
|
|
943
|
-
position.value = void 0;
|
|
944
|
-
motionEvent.value = void 0;
|
|
945
|
-
}
|
|
946
|
-
);
|
|
947
|
-
const stop = () => {
|
|
948
|
-
stopLeftDownWatch();
|
|
949
|
-
stopMouseMoveWatch();
|
|
950
|
-
stopLeftUpWatch();
|
|
951
|
-
};
|
|
952
|
-
core.tryOnScopeDispose(stop);
|
|
953
|
-
return stop;
|
|
1053
|
+
const position = (0, vue.shallowRef)();
|
|
1054
|
+
const pick = useScenePick(position);
|
|
1055
|
+
const motionEvent = (0, vue.shallowRef)();
|
|
1056
|
+
const dragging = (0, vue.ref)(false);
|
|
1057
|
+
const viewer = useViewer();
|
|
1058
|
+
const cameraLocked = (0, vue.ref)(false);
|
|
1059
|
+
(0, vue.watch)(cameraLocked, (cameraLocked$1) => {
|
|
1060
|
+
viewer.value && (viewer.value.scene.screenSpaceCameraController.enableRotate = !cameraLocked$1);
|
|
1061
|
+
});
|
|
1062
|
+
const lockCamera = () => {
|
|
1063
|
+
cameraLocked.value = true;
|
|
1064
|
+
};
|
|
1065
|
+
const execute = (pick$1, startPosition, endPosition) => {
|
|
1066
|
+
listener({
|
|
1067
|
+
event: {
|
|
1068
|
+
startPosition: startPosition.clone(),
|
|
1069
|
+
endPosition: endPosition.clone()
|
|
1070
|
+
},
|
|
1071
|
+
pick: pick$1,
|
|
1072
|
+
dragging: dragging.value,
|
|
1073
|
+
lockCamera
|
|
1074
|
+
});
|
|
1075
|
+
(0, vue.nextTick)(() => {
|
|
1076
|
+
if (!dragging.value && cameraLocked.value) cameraLocked.value = false;
|
|
1077
|
+
});
|
|
1078
|
+
};
|
|
1079
|
+
const stopLeftDownWatch = useScreenSpaceEventHandler(cesium.ScreenSpaceEventType.LEFT_DOWN, (event) => {
|
|
1080
|
+
dragging.value = true;
|
|
1081
|
+
position.value = event.position.clone();
|
|
1082
|
+
});
|
|
1083
|
+
const stopMouseMoveWatch = useScreenSpaceEventHandler(cesium.ScreenSpaceEventType.MOUSE_MOVE, throttle(({ startPosition, endPosition }) => {
|
|
1084
|
+
motionEvent.value = {
|
|
1085
|
+
startPosition: motionEvent.value?.endPosition.clone() || startPosition.clone(),
|
|
1086
|
+
endPosition: endPosition.clone()
|
|
1087
|
+
};
|
|
1088
|
+
}, 8, false, true));
|
|
1089
|
+
(0, vue.watch)([pick, motionEvent], ([pick$1, motionEvent$1]) => {
|
|
1090
|
+
if (pick$1 && motionEvent$1) {
|
|
1091
|
+
const { startPosition, endPosition } = motionEvent$1;
|
|
1092
|
+
dragging.value && execute(pick$1, startPosition, endPosition);
|
|
1093
|
+
}
|
|
1094
|
+
});
|
|
1095
|
+
const stopLeftUpWatch = useScreenSpaceEventHandler(cesium.ScreenSpaceEventType.LEFT_UP, (event) => {
|
|
1096
|
+
dragging.value = false;
|
|
1097
|
+
if (pick.value && motionEvent.value) execute(pick.value, motionEvent.value.endPosition, event.position);
|
|
1098
|
+
position.value = void 0;
|
|
1099
|
+
motionEvent.value = void 0;
|
|
1100
|
+
});
|
|
1101
|
+
const stop = () => {
|
|
1102
|
+
stopLeftDownWatch();
|
|
1103
|
+
stopMouseMoveWatch();
|
|
1104
|
+
stopLeftUpWatch();
|
|
1105
|
+
};
|
|
1106
|
+
(0, __vueuse_core.tryOnScopeDispose)(stop);
|
|
1107
|
+
return stop;
|
|
954
1108
|
}
|
|
1109
|
+
|
|
1110
|
+
//#endregion
|
|
1111
|
+
//#region useGraphicEvent/useHover.ts
|
|
1112
|
+
/**
|
|
1113
|
+
* Use graphic hover events with ease, and remove listener automatically on unmounted.
|
|
1114
|
+
*/
|
|
955
1115
|
function useHover(listener) {
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
vue.watch(pick, (pick2, prevPick) => {
|
|
987
|
-
if (prevPick && motionEvent.value) {
|
|
988
|
-
const { startPosition, endPosition } = motionEvent.value;
|
|
989
|
-
execute(prevPick, startPosition, endPosition, false);
|
|
990
|
-
}
|
|
991
|
-
});
|
|
1116
|
+
const motionEvent = (0, vue.shallowRef)();
|
|
1117
|
+
const pick = useScenePick(() => motionEvent.value?.endPosition);
|
|
1118
|
+
const execute = (pick$1, startPosition, endPosition, hovering) => {
|
|
1119
|
+
listener({
|
|
1120
|
+
event: {
|
|
1121
|
+
startPosition: startPosition.clone(),
|
|
1122
|
+
endPosition: endPosition.clone()
|
|
1123
|
+
},
|
|
1124
|
+
pick: pick$1,
|
|
1125
|
+
hovering
|
|
1126
|
+
});
|
|
1127
|
+
};
|
|
1128
|
+
useScreenSpaceEventHandler(cesium.ScreenSpaceEventType.MOUSE_MOVE, ({ startPosition, endPosition }) => {
|
|
1129
|
+
if (!startPosition.equals(motionEvent.value?.startPosition) || !endPosition.equals(motionEvent.value?.endPosition)) motionEvent.value = {
|
|
1130
|
+
startPosition: startPosition.clone(),
|
|
1131
|
+
endPosition: endPosition.clone()
|
|
1132
|
+
};
|
|
1133
|
+
});
|
|
1134
|
+
(0, vue.watch)([pick, motionEvent], ([pick$1, motionEvent$1]) => {
|
|
1135
|
+
if (pick$1 && motionEvent$1) {
|
|
1136
|
+
const { startPosition, endPosition } = motionEvent$1;
|
|
1137
|
+
execute(pick$1, startPosition, endPosition, true);
|
|
1138
|
+
}
|
|
1139
|
+
});
|
|
1140
|
+
(0, vue.watch)(pick, (pick$1, prevPick) => {
|
|
1141
|
+
if (prevPick && motionEvent.value) {
|
|
1142
|
+
const { startPosition, endPosition } = motionEvent.value;
|
|
1143
|
+
execute(prevPick, startPosition, endPosition, false);
|
|
1144
|
+
}
|
|
1145
|
+
});
|
|
992
1146
|
}
|
|
1147
|
+
|
|
1148
|
+
//#endregion
|
|
1149
|
+
//#region useGraphicEvent/usePositioned.ts
|
|
1150
|
+
/**
|
|
1151
|
+
* @internal
|
|
1152
|
+
*/
|
|
993
1153
|
const EVENT_TYPE_RECORD = {
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1154
|
+
LEFT_DOWN: cesium.ScreenSpaceEventType.LEFT_DOWN,
|
|
1155
|
+
LEFT_UP: cesium.ScreenSpaceEventType.LEFT_UP,
|
|
1156
|
+
LEFT_CLICK: cesium.ScreenSpaceEventType.LEFT_CLICK,
|
|
1157
|
+
LEFT_DOUBLE_CLICK: cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
|
|
1158
|
+
RIGHT_DOWN: cesium.ScreenSpaceEventType.RIGHT_DOWN,
|
|
1159
|
+
RIGHT_UP: cesium.ScreenSpaceEventType.RIGHT_UP,
|
|
1160
|
+
RIGHT_CLICK: cesium.ScreenSpaceEventType.RIGHT_CLICK,
|
|
1161
|
+
MIDDLE_DOWN: cesium.ScreenSpaceEventType.MIDDLE_DOWN,
|
|
1162
|
+
MIDDLE_UP: cesium.ScreenSpaceEventType.MIDDLE_UP,
|
|
1163
|
+
MIDDLE_CLICK: cesium.ScreenSpaceEventType.MIDDLE_CLICK
|
|
1004
1164
|
};
|
|
1005
1165
|
function usePositioned(type, listener) {
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1166
|
+
const screenEvent = EVENT_TYPE_RECORD[type];
|
|
1167
|
+
const viewer = useViewer();
|
|
1168
|
+
useScreenSpaceEventHandler(screenEvent, (event) => {
|
|
1169
|
+
const position = event.position;
|
|
1170
|
+
const pick = viewer.value?.scene.pick(position);
|
|
1171
|
+
pick && position && listener({
|
|
1172
|
+
event: { position },
|
|
1173
|
+
pick
|
|
1174
|
+
});
|
|
1175
|
+
});
|
|
1014
1176
|
}
|
|
1177
|
+
|
|
1178
|
+
//#endregion
|
|
1179
|
+
//#region useGraphicEvent/index.ts
|
|
1015
1180
|
const GLOBAL_GRAPHIC_SYMBOL = Symbol("GLOBAL_GRAPHIC_SYMBOL");
|
|
1016
1181
|
const POSITIONED_EVENT_TYPES = [
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1182
|
+
"LEFT_DOWN",
|
|
1183
|
+
"LEFT_UP",
|
|
1184
|
+
"LEFT_CLICK",
|
|
1185
|
+
"LEFT_DOUBLE_CLICK",
|
|
1186
|
+
"RIGHT_DOWN",
|
|
1187
|
+
"RIGHT_UP",
|
|
1188
|
+
"RIGHT_CLICK",
|
|
1189
|
+
"MIDDLE_DOWN",
|
|
1190
|
+
"MIDDLE_UP",
|
|
1191
|
+
"MIDDLE_CLICK"
|
|
1027
1192
|
];
|
|
1193
|
+
/**
|
|
1194
|
+
* Handle graphic event listeners and cursor styles for Cesium graphics.
|
|
1195
|
+
* You don't need to overly worry about memory leaks from the function, as it automatically cleans up internally.
|
|
1196
|
+
*/
|
|
1028
1197
|
function useGraphicEvent() {
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
1060
|
-
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
graphics.forEach((graphic) => {
|
|
1122
|
-
var _a, _b, _c;
|
|
1123
|
-
(_b = (_a = collection.get(graphic)) == null ? void 0 : _a.get("HOVER")) == null ? void 0 : _b.forEach((fn) => {
|
|
1124
|
-
var _a2;
|
|
1125
|
-
return (_a2 = tryRun(fn)) == null ? void 0 : _a2(event);
|
|
1126
|
-
});
|
|
1127
|
-
if (!dragging.value) {
|
|
1128
|
-
(_c = cursorCollection.get(graphic)) == null ? void 0 : _c.forEach((map) => {
|
|
1129
|
-
map.forEach((fn) => {
|
|
1130
|
-
var _a2, _b2;
|
|
1131
|
-
const cursor = event.hovering ? tryRun(fn)(event) : "";
|
|
1132
|
-
(_b2 = (_a2 = viewer.value) == null ? void 0 : _a2.canvas.style) == null ? void 0 : _b2.setProperty("cursor", cursor);
|
|
1133
|
-
});
|
|
1134
|
-
});
|
|
1135
|
-
}
|
|
1136
|
-
});
|
|
1137
|
-
});
|
|
1138
|
-
useDrag((event) => {
|
|
1139
|
-
const graphics = resolvePick(event.pick).concat(GLOBAL_GRAPHIC_SYMBOL);
|
|
1140
|
-
dragging.value = event.dragging;
|
|
1141
|
-
graphics.forEach((graphic) => {
|
|
1142
|
-
var _a, _b, _c;
|
|
1143
|
-
(_b = (_a = collection.get(graphic)) == null ? void 0 : _a.get("DRAG")) == null ? void 0 : _b.forEach((fn) => tryRun(fn)(event));
|
|
1144
|
-
(_c = dragCursorCollection.get(graphic)) == null ? void 0 : _c.forEach((map) => {
|
|
1145
|
-
map.forEach((fn) => {
|
|
1146
|
-
var _a2, _b2;
|
|
1147
|
-
const cursor = event.dragging ? tryRun(fn)(event) : "";
|
|
1148
|
-
(_b2 = (_a2 = viewer.value) == null ? void 0 : _a2.canvas.style) == null ? void 0 : _b2.setProperty("cursor", cursor);
|
|
1149
|
-
});
|
|
1150
|
-
});
|
|
1151
|
-
});
|
|
1152
|
-
});
|
|
1153
|
-
return {
|
|
1154
|
-
addGraphicEvent,
|
|
1155
|
-
removeGraphicEvent,
|
|
1156
|
-
clearGraphicEvent
|
|
1157
|
-
};
|
|
1198
|
+
const collection = /* @__PURE__ */ new WeakMap();
|
|
1199
|
+
const cursorCollection = /* @__PURE__ */ new WeakMap();
|
|
1200
|
+
const dragCursorCollection = /* @__PURE__ */ new WeakMap();
|
|
1201
|
+
const removeGraphicEvent = (graphic, type, listener) => {
|
|
1202
|
+
const _graphic = graphic === "global" ? GLOBAL_GRAPHIC_SYMBOL : graphic;
|
|
1203
|
+
collection?.get(_graphic)?.get(type)?.delete(listener);
|
|
1204
|
+
cursorCollection?.get(_graphic)?.get(type)?.delete(listener);
|
|
1205
|
+
if (collection?.get(_graphic)?.get(type)?.size === 0) collection.get(_graphic).delete(type);
|
|
1206
|
+
if (collection.get(_graphic)?.size === 0) collection.delete(_graphic);
|
|
1207
|
+
cursorCollection?.get(_graphic)?.get(type)?.delete(listener);
|
|
1208
|
+
if (cursorCollection?.get(_graphic)?.get(type)?.size === 0) cursorCollection?.get(_graphic)?.delete(type);
|
|
1209
|
+
if (cursorCollection?.get(_graphic)?.size === 0) cursorCollection?.delete(_graphic);
|
|
1210
|
+
dragCursorCollection?.get(_graphic)?.get(type)?.delete(listener);
|
|
1211
|
+
if (dragCursorCollection?.get(_graphic)?.get(type)?.size === 0) dragCursorCollection?.get(_graphic)?.delete(type);
|
|
1212
|
+
if (dragCursorCollection?.get(_graphic)?.size === 0) dragCursorCollection?.delete(_graphic);
|
|
1213
|
+
};
|
|
1214
|
+
const addGraphicEvent = (graphic, type, listener, options = {}) => {
|
|
1215
|
+
const _graphic = graphic === "global" ? GLOBAL_GRAPHIC_SYMBOL : graphic;
|
|
1216
|
+
collection.get(_graphic) ?? collection.set(_graphic, /* @__PURE__ */ new Map());
|
|
1217
|
+
const eventTypeMap = collection.get(_graphic);
|
|
1218
|
+
eventTypeMap.get(type) ?? eventTypeMap.set(type, /* @__PURE__ */ new Set());
|
|
1219
|
+
const listeners = eventTypeMap.get(type);
|
|
1220
|
+
listeners.add(listener);
|
|
1221
|
+
let { cursor = "pointer", dragCursor } = options;
|
|
1222
|
+
if (isDef(cursor)) {
|
|
1223
|
+
const _cursor = isFunction(cursor) ? cursor : () => cursor;
|
|
1224
|
+
cursorCollection.get(_graphic) ?? cursorCollection.set(_graphic, /* @__PURE__ */ new Map());
|
|
1225
|
+
cursorCollection.get(_graphic).get(type) ?? cursorCollection.get(_graphic).set(type, /* @__PURE__ */ new Map());
|
|
1226
|
+
cursorCollection.get(_graphic).get(type).set(listener, _cursor);
|
|
1227
|
+
}
|
|
1228
|
+
if (type === "DRAG") dragCursor ??= (event) => event?.dragging ? "crosshair" : void 0;
|
|
1229
|
+
if (isDef(dragCursor)) {
|
|
1230
|
+
const _dragCursor = isFunction(dragCursor) ? dragCursor : () => dragCursor;
|
|
1231
|
+
dragCursorCollection.get(_graphic) ?? dragCursorCollection.set(_graphic, /* @__PURE__ */ new Map());
|
|
1232
|
+
dragCursorCollection.get(_graphic).get(type) ?? dragCursorCollection.get(_graphic).set(type, /* @__PURE__ */ new Map());
|
|
1233
|
+
dragCursorCollection.get(_graphic).get(type).set(listener, _dragCursor);
|
|
1234
|
+
}
|
|
1235
|
+
return () => removeGraphicEvent(graphic, type, listener);
|
|
1236
|
+
};
|
|
1237
|
+
const clearGraphicEvent = (graphic, type) => {
|
|
1238
|
+
const _graphic = graphic === "global" ? GLOBAL_GRAPHIC_SYMBOL : graphic;
|
|
1239
|
+
if (type === "all") {
|
|
1240
|
+
collection.delete(_graphic);
|
|
1241
|
+
cursorCollection.delete(_graphic);
|
|
1242
|
+
dragCursorCollection.delete(_graphic);
|
|
1243
|
+
return;
|
|
1244
|
+
}
|
|
1245
|
+
collection.get(_graphic)?.delete(type);
|
|
1246
|
+
if (collection.get(_graphic)?.size === 0) collection.delete(_graphic);
|
|
1247
|
+
cursorCollection?.get(_graphic)?.delete(type);
|
|
1248
|
+
dragCursorCollection?.get(_graphic)?.delete(type);
|
|
1249
|
+
if (cursorCollection?.get(_graphic)?.size === 0) cursorCollection?.delete(_graphic);
|
|
1250
|
+
if (dragCursorCollection?.get(_graphic)?.size === 0) dragCursorCollection?.delete(_graphic);
|
|
1251
|
+
};
|
|
1252
|
+
for (const type of POSITIONED_EVENT_TYPES) usePositioned(type, (event) => {
|
|
1253
|
+
const graphics = resolvePick(event.pick);
|
|
1254
|
+
graphics.concat(GLOBAL_GRAPHIC_SYMBOL).forEach((graphic) => {
|
|
1255
|
+
collection.get(graphic)?.get(type)?.forEach((fn) => tryRun(fn)?.(event));
|
|
1256
|
+
});
|
|
1257
|
+
});
|
|
1258
|
+
const dragging = (0, vue.ref)(false);
|
|
1259
|
+
const viewer = useViewer();
|
|
1260
|
+
useHover((event) => {
|
|
1261
|
+
const graphics = resolvePick(event.pick).concat(GLOBAL_GRAPHIC_SYMBOL);
|
|
1262
|
+
graphics.forEach((graphic) => {
|
|
1263
|
+
collection.get(graphic)?.get("HOVER")?.forEach((fn) => tryRun(fn)?.(event));
|
|
1264
|
+
if (!dragging.value) cursorCollection.get(graphic)?.forEach((map) => {
|
|
1265
|
+
map.forEach((fn) => {
|
|
1266
|
+
const cursor = event.hovering ? tryRun(fn)(event) : "";
|
|
1267
|
+
viewer.value?.canvas.style?.setProperty("cursor", cursor);
|
|
1268
|
+
});
|
|
1269
|
+
});
|
|
1270
|
+
});
|
|
1271
|
+
});
|
|
1272
|
+
useDrag((event) => {
|
|
1273
|
+
const graphics = resolvePick(event.pick).concat(GLOBAL_GRAPHIC_SYMBOL);
|
|
1274
|
+
dragging.value = event.dragging;
|
|
1275
|
+
graphics.forEach((graphic) => {
|
|
1276
|
+
collection.get(graphic)?.get("DRAG")?.forEach((fn) => tryRun(fn)(event));
|
|
1277
|
+
dragCursorCollection.get(graphic)?.forEach((map) => {
|
|
1278
|
+
map.forEach((fn) => {
|
|
1279
|
+
const cursor = event.dragging ? tryRun(fn)(event) : "";
|
|
1280
|
+
viewer.value?.canvas.style?.setProperty("cursor", cursor);
|
|
1281
|
+
});
|
|
1282
|
+
});
|
|
1283
|
+
});
|
|
1284
|
+
});
|
|
1285
|
+
return {
|
|
1286
|
+
addGraphicEvent,
|
|
1287
|
+
removeGraphicEvent,
|
|
1288
|
+
clearGraphicEvent
|
|
1289
|
+
};
|
|
1158
1290
|
}
|
|
1291
|
+
|
|
1292
|
+
//#endregion
|
|
1293
|
+
//#region useImageryLayer/index.ts
|
|
1159
1294
|
function useImageryLayer(data, options = {}) {
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
|
|
1163
|
-
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
}
|
|
1188
|
-
if (item == null ? void 0 : item.isDestroyed()) {
|
|
1189
|
-
console.warn("ImageryLayer is destroyed");
|
|
1190
|
-
return;
|
|
1191
|
-
}
|
|
1192
|
-
_collection == null ? void 0 : _collection.add(item);
|
|
1193
|
-
});
|
|
1194
|
-
onCleanup(() => {
|
|
1195
|
-
const destroy = vue.toValue(destroyOnRemove);
|
|
1196
|
-
list.forEach((item) => item && (_collection == null ? void 0 : _collection.remove(item, destroy)));
|
|
1197
|
-
});
|
|
1198
|
-
}
|
|
1199
|
-
});
|
|
1200
|
-
return result;
|
|
1295
|
+
const { destroyOnRemove, collection, isActive = true, evaluating } = options;
|
|
1296
|
+
const result = (0, __vueuse_core.computedAsync)(() => toPromiseValue(data), [], { evaluating });
|
|
1297
|
+
const viewer = useViewer();
|
|
1298
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
1299
|
+
const _isActive = (0, vue.toValue)(isActive);
|
|
1300
|
+
if (_isActive) {
|
|
1301
|
+
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
1302
|
+
const _collection = collection ?? viewer.value?.imageryLayers;
|
|
1303
|
+
if (collection?.isDestroyed()) return;
|
|
1304
|
+
list.forEach((item) => {
|
|
1305
|
+
if (!item) {
|
|
1306
|
+
console.warn("ImageryLayer is undefined");
|
|
1307
|
+
return;
|
|
1308
|
+
}
|
|
1309
|
+
if (item?.isDestroyed()) {
|
|
1310
|
+
console.warn("ImageryLayer is destroyed");
|
|
1311
|
+
return;
|
|
1312
|
+
}
|
|
1313
|
+
_collection?.add(item);
|
|
1314
|
+
});
|
|
1315
|
+
onCleanup(() => {
|
|
1316
|
+
const destroy = (0, vue.toValue)(destroyOnRemove);
|
|
1317
|
+
list.forEach((item) => item && _collection?.remove(item, destroy));
|
|
1318
|
+
});
|
|
1319
|
+
}
|
|
1320
|
+
});
|
|
1321
|
+
return result;
|
|
1201
1322
|
}
|
|
1323
|
+
|
|
1324
|
+
//#endregion
|
|
1325
|
+
//#region useImageryLayerScope/index.ts
|
|
1326
|
+
/**
|
|
1327
|
+
* Make `add` and `remove` operations of `ImageryLayerCollection` scoped,
|
|
1328
|
+
* automatically remove `ImageryLayer` instance when component is unmounted.
|
|
1329
|
+
*/
|
|
1202
1330
|
function useImageryLayerScope(options = {}) {
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
|
|
1212
|
-
|
|
1213
|
-
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
|
|
1217
|
-
|
|
1218
|
-
|
|
1219
|
-
|
|
1220
|
-
|
|
1221
|
-
|
|
1222
|
-
|
|
1223
|
-
|
|
1224
|
-
remove,
|
|
1225
|
-
removeWhere,
|
|
1226
|
-
removeScope
|
|
1227
|
-
};
|
|
1331
|
+
const { collection: _collection, destroyOnRemove } = options;
|
|
1332
|
+
const viewer = useViewer();
|
|
1333
|
+
const collection = (0, vue.computed)(() => {
|
|
1334
|
+
return (0, vue.toValue)(_collection) ?? viewer.value?.imageryLayers;
|
|
1335
|
+
});
|
|
1336
|
+
const addFn = (imageryLayer, index) => {
|
|
1337
|
+
if (!collection.value) throw new Error("collection is not defined");
|
|
1338
|
+
collection.value.add(imageryLayer, index);
|
|
1339
|
+
return imageryLayer;
|
|
1340
|
+
};
|
|
1341
|
+
const removeFn = (imageryLayer, destroy) => {
|
|
1342
|
+
return !!collection.value?.remove(imageryLayer, destroy);
|
|
1343
|
+
};
|
|
1344
|
+
const { scope, add, remove, removeWhere, removeScope } = useCollectionScope(addFn, removeFn, [destroyOnRemove]);
|
|
1345
|
+
return {
|
|
1346
|
+
scope,
|
|
1347
|
+
add,
|
|
1348
|
+
remove,
|
|
1349
|
+
removeWhere,
|
|
1350
|
+
removeScope
|
|
1351
|
+
};
|
|
1228
1352
|
}
|
|
1353
|
+
|
|
1354
|
+
//#endregion
|
|
1355
|
+
//#region usePostProcessStage/index.ts
|
|
1229
1356
|
function usePostProcessStage(data, options = {}) {
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
|
|
1244
|
-
|
|
1245
|
-
|
|
1246
|
-
}
|
|
1247
|
-
const _isActive = vue.toValue(isActive);
|
|
1248
|
-
if (_isActive) {
|
|
1249
|
-
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
1250
|
-
const _collection = collection ?? viewer.value.scene.postProcessStages;
|
|
1251
|
-
list.forEach((item) => item && _collection.add(item));
|
|
1252
|
-
onCleanup(() => {
|
|
1253
|
-
list.forEach((item) => item && _collection.remove(item));
|
|
1254
|
-
});
|
|
1255
|
-
}
|
|
1256
|
-
});
|
|
1257
|
-
return result;
|
|
1357
|
+
const { collection, isActive = true, evaluating } = options;
|
|
1358
|
+
const result = (0, __vueuse_core.computedAsync)(() => toPromiseValue(data), void 0, { evaluating });
|
|
1359
|
+
const viewer = useViewer();
|
|
1360
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
1361
|
+
if (!viewer.value) return;
|
|
1362
|
+
const _isActive = (0, vue.toValue)(isActive);
|
|
1363
|
+
if (_isActive) {
|
|
1364
|
+
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
1365
|
+
const _collection = collection ?? viewer.value.scene.postProcessStages;
|
|
1366
|
+
list.forEach((item) => item && _collection.add(item));
|
|
1367
|
+
onCleanup(() => {
|
|
1368
|
+
list.forEach((item) => item && _collection.remove(item));
|
|
1369
|
+
});
|
|
1370
|
+
}
|
|
1371
|
+
});
|
|
1372
|
+
return result;
|
|
1258
1373
|
}
|
|
1374
|
+
|
|
1375
|
+
//#endregion
|
|
1376
|
+
//#region usePostProcessStageScope/index.ts
|
|
1377
|
+
/**
|
|
1378
|
+
* Make `add` and `remove` operations of `PostProcessStageCollection` scoped,
|
|
1379
|
+
* automatically remove `PostProcessStage` instance when component is unmounted.
|
|
1380
|
+
*/
|
|
1259
1381
|
function usePostProcessStageScope(options = {}) {
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
remove,
|
|
1281
|
-
removeWhere,
|
|
1282
|
-
removeScope
|
|
1283
|
-
};
|
|
1382
|
+
const { collection: _collection } = options;
|
|
1383
|
+
const viewer = useViewer();
|
|
1384
|
+
const collection = (0, vue.computed)(() => {
|
|
1385
|
+
return (0, vue.toValue)(_collection) ?? viewer.value?.postProcessStages;
|
|
1386
|
+
});
|
|
1387
|
+
const addFn = (postProcessStage) => {
|
|
1388
|
+
if (!collection.value) throw new Error("collection is not defined");
|
|
1389
|
+
return collection.value.add(postProcessStage);
|
|
1390
|
+
};
|
|
1391
|
+
const removeFn = (postProcessStage) => {
|
|
1392
|
+
return !!collection.value?.remove(postProcessStage);
|
|
1393
|
+
};
|
|
1394
|
+
const { scope, add, remove, removeWhere, removeScope } = useCollectionScope(addFn, removeFn, []);
|
|
1395
|
+
return {
|
|
1396
|
+
scope,
|
|
1397
|
+
add,
|
|
1398
|
+
remove,
|
|
1399
|
+
removeWhere,
|
|
1400
|
+
removeScope
|
|
1401
|
+
};
|
|
1284
1402
|
}
|
|
1403
|
+
|
|
1404
|
+
//#endregion
|
|
1405
|
+
//#region usePrimitive/index.ts
|
|
1285
1406
|
function usePrimitive(data, options = {}) {
|
|
1286
|
-
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
const _isActive = vue.toValue(isActive);
|
|
1302
|
-
if (_isActive) {
|
|
1303
|
-
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
1304
|
-
const _collection = collection === "ground" ? (_a = viewer.value) == null ? void 0 : _a.scene.groundPrimitives : collection ?? ((_b = viewer.value) == null ? void 0 : _b.scene.primitives);
|
|
1305
|
-
list.forEach((item) => item && (_collection == null ? void 0 : _collection.add(item)));
|
|
1306
|
-
onCleanup(() => {
|
|
1307
|
-
!(_collection == null ? void 0 : _collection.isDestroyed()) && list.forEach((item) => item && (_collection == null ? void 0 : _collection.remove(item)));
|
|
1308
|
-
});
|
|
1309
|
-
}
|
|
1310
|
-
});
|
|
1311
|
-
return result;
|
|
1407
|
+
const { collection, isActive = true, evaluating } = options;
|
|
1408
|
+
const result = (0, __vueuse_core.computedAsync)(() => toPromiseValue(data), void 0, { evaluating });
|
|
1409
|
+
const viewer = useViewer();
|
|
1410
|
+
(0, vue.watchEffect)((onCleanup) => {
|
|
1411
|
+
const _isActive = (0, vue.toValue)(isActive);
|
|
1412
|
+
if (_isActive) {
|
|
1413
|
+
const list = Array.isArray(result.value) ? [...result.value] : [result.value];
|
|
1414
|
+
const _collection = collection === "ground" ? viewer.value?.scene.groundPrimitives : collection ?? viewer.value?.scene.primitives;
|
|
1415
|
+
list.forEach((item) => item && _collection?.add(item));
|
|
1416
|
+
onCleanup(() => {
|
|
1417
|
+
!_collection?.isDestroyed() && list.forEach((item) => item && _collection?.remove(item));
|
|
1418
|
+
});
|
|
1419
|
+
}
|
|
1420
|
+
});
|
|
1421
|
+
return result;
|
|
1312
1422
|
}
|
|
1423
|
+
|
|
1424
|
+
//#endregion
|
|
1425
|
+
//#region usePrimitiveScope/index.ts
|
|
1426
|
+
/**
|
|
1427
|
+
* Make `add` and `remove` operations of `PrimitiveCollection` scoped,
|
|
1428
|
+
* automatically remove `Primitive` instance when component is unmounted.
|
|
1429
|
+
*/
|
|
1313
1430
|
function usePrimitiveScope(options = {}) {
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
remove,
|
|
1335
|
-
removeWhere,
|
|
1336
|
-
removeScope
|
|
1337
|
-
};
|
|
1431
|
+
const { collection: _collection } = options;
|
|
1432
|
+
const viewer = useViewer();
|
|
1433
|
+
const collection = (0, vue.computed)(() => {
|
|
1434
|
+
return (0, vue.toValue)(_collection) ?? viewer.value?.scene.primitives;
|
|
1435
|
+
});
|
|
1436
|
+
const addFn = (primitive) => {
|
|
1437
|
+
if (!collection.value) throw new Error("collection is not defined");
|
|
1438
|
+
return collection.value.add(primitive);
|
|
1439
|
+
};
|
|
1440
|
+
const removeFn = (primitive) => {
|
|
1441
|
+
return !!collection.value?.remove(primitive);
|
|
1442
|
+
};
|
|
1443
|
+
const { scope, add, remove, removeWhere, removeScope } = useCollectionScope(addFn, removeFn, []);
|
|
1444
|
+
return {
|
|
1445
|
+
scope,
|
|
1446
|
+
add,
|
|
1447
|
+
remove,
|
|
1448
|
+
removeWhere,
|
|
1449
|
+
removeScope
|
|
1450
|
+
};
|
|
1338
1451
|
}
|
|
1452
|
+
|
|
1453
|
+
//#endregion
|
|
1454
|
+
//#region useScaleBar/index.ts
|
|
1339
1455
|
const distances = [
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
|
|
1374
|
-
|
|
1375
|
-
|
|
1456
|
+
.01,
|
|
1457
|
+
.05,
|
|
1458
|
+
.1,
|
|
1459
|
+
.5,
|
|
1460
|
+
1,
|
|
1461
|
+
2,
|
|
1462
|
+
3,
|
|
1463
|
+
5,
|
|
1464
|
+
10,
|
|
1465
|
+
20,
|
|
1466
|
+
30,
|
|
1467
|
+
50,
|
|
1468
|
+
100,
|
|
1469
|
+
200,
|
|
1470
|
+
300,
|
|
1471
|
+
500,
|
|
1472
|
+
1e3,
|
|
1473
|
+
2e3,
|
|
1474
|
+
3e3,
|
|
1475
|
+
5e3,
|
|
1476
|
+
1e4,
|
|
1477
|
+
2e4,
|
|
1478
|
+
3e4,
|
|
1479
|
+
5e4,
|
|
1480
|
+
1e5,
|
|
1481
|
+
2e5,
|
|
1482
|
+
3e5,
|
|
1483
|
+
5e5,
|
|
1484
|
+
1e6,
|
|
1485
|
+
2e6,
|
|
1486
|
+
3e6,
|
|
1487
|
+
5e6,
|
|
1488
|
+
1e7,
|
|
1489
|
+
2e7,
|
|
1490
|
+
3e7,
|
|
1491
|
+
5e7
|
|
1376
1492
|
].reverse();
|
|
1493
|
+
/**
|
|
1494
|
+
* Reactive generation of scale bars
|
|
1495
|
+
*/
|
|
1377
1496
|
function useScaleBar(options = {}) {
|
|
1378
|
-
|
|
1379
|
-
|
|
1380
|
-
|
|
1381
|
-
|
|
1382
|
-
|
|
1383
|
-
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1398
|
-
|
|
1399
|
-
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
}
|
|
1420
|
-
});
|
|
1421
|
-
const width = vue.computed(() => {
|
|
1422
|
-
if (distance.value && pixelDistance.value) {
|
|
1423
|
-
const value = distance.value / pixelDistance.value;
|
|
1424
|
-
return value;
|
|
1425
|
-
}
|
|
1426
|
-
return 0;
|
|
1427
|
-
});
|
|
1428
|
-
const distanceText = vue.computed(() => {
|
|
1429
|
-
if (distance.value) {
|
|
1430
|
-
return distance.value > 1e3 ? `${distance.value / 1e3 || 0}km` : `${distance.value || 0}m`;
|
|
1431
|
-
}
|
|
1432
|
-
});
|
|
1433
|
-
return {
|
|
1434
|
-
pixelDistance: vue.readonly(pixelDistance),
|
|
1435
|
-
width,
|
|
1436
|
-
distance,
|
|
1437
|
-
distanceText
|
|
1438
|
-
};
|
|
1497
|
+
const { maxPixel = 80, delay = 8 } = options;
|
|
1498
|
+
const maxPixelRef = (0, vue.computed)(() => (0, vue.toValue)(maxPixel));
|
|
1499
|
+
const viewer = useViewer();
|
|
1500
|
+
const canvasSize = (0, __vueuse_core.useElementSize)(() => viewer.value?.canvas);
|
|
1501
|
+
const pixelDistance = (0, vue.ref)();
|
|
1502
|
+
const setPixelDistance = async () => {
|
|
1503
|
+
await (0, vue.nextTick)();
|
|
1504
|
+
const scene = viewer.value?.scene;
|
|
1505
|
+
if (!scene) return;
|
|
1506
|
+
const left = scene.camera.getPickRay(new cesium.Cartesian2(Math.floor(canvasSize.width.value / 2), canvasSize.height.value - 1));
|
|
1507
|
+
const right = scene.camera.getPickRay(new cesium.Cartesian2(Math.floor(1 + canvasSize.width.value / 2), canvasSize.height.value - 1));
|
|
1508
|
+
if (!left || !right) return;
|
|
1509
|
+
const leftPosition = scene.globe.pick(left, scene);
|
|
1510
|
+
const rightPosition = scene.globe.pick(right, scene);
|
|
1511
|
+
if (!leftPosition || !rightPosition) return;
|
|
1512
|
+
const leftCartographic = scene.globe.ellipsoid.cartesianToCartographic(leftPosition);
|
|
1513
|
+
const rightCartographic = scene.globe.ellipsoid.cartesianToCartographic(rightPosition);
|
|
1514
|
+
const geodesic = new cesium.EllipsoidGeodesic(leftCartographic, rightCartographic);
|
|
1515
|
+
pixelDistance.value = geodesic.surfaceDistance;
|
|
1516
|
+
};
|
|
1517
|
+
(0, __vueuse_core.watchImmediate)(viewer, () => setPixelDistance());
|
|
1518
|
+
useCesiumEventListener(() => viewer.value?.camera.changed, throttle(setPixelDistance, delay));
|
|
1519
|
+
const distance = (0, vue.computed)(() => {
|
|
1520
|
+
if (pixelDistance.value) return distances.find((item) => pixelDistance.value * maxPixelRef.value > item);
|
|
1521
|
+
});
|
|
1522
|
+
const width = (0, vue.computed)(() => {
|
|
1523
|
+
if (distance.value && pixelDistance.value) {
|
|
1524
|
+
const value = distance.value / pixelDistance.value;
|
|
1525
|
+
return value;
|
|
1526
|
+
}
|
|
1527
|
+
return 0;
|
|
1528
|
+
});
|
|
1529
|
+
const distanceText = (0, vue.computed)(() => {
|
|
1530
|
+
if (distance.value) return distance.value > 1e3 ? `${distance.value / 1e3 || 0}km` : `${distance.value || 0}m`;
|
|
1531
|
+
});
|
|
1532
|
+
return {
|
|
1533
|
+
pixelDistance: (0, vue.readonly)(pixelDistance),
|
|
1534
|
+
width,
|
|
1535
|
+
distance,
|
|
1536
|
+
distanceText
|
|
1537
|
+
};
|
|
1439
1538
|
}
|
|
1539
|
+
|
|
1540
|
+
//#endregion
|
|
1541
|
+
//#region useSceneDrillPick/index.ts
|
|
1542
|
+
/**
|
|
1543
|
+
* Uses the `scene.drillPick` function to perform screen point picking,
|
|
1544
|
+
* return a computed property containing the pick result, or undefined if no object is picked.
|
|
1545
|
+
*
|
|
1546
|
+
* @param windowPosition The screen coordinates of the pick point.
|
|
1547
|
+
*/
|
|
1440
1548
|
function useSceneDrillPick(windowPosition, options = {}) {
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1445
|
-
|
|
1446
|
-
|
|
1447
|
-
|
|
1448
|
-
position.value,
|
|
1449
|
-
vue.toValue(limit),
|
|
1450
|
-
vue.toValue(width),
|
|
1451
|
-
vue.toValue(height)
|
|
1452
|
-
);
|
|
1453
|
-
}
|
|
1454
|
-
});
|
|
1455
|
-
return pick;
|
|
1549
|
+
const { width = 3, height = 3, limit, throttled = 8, isActive = true } = options;
|
|
1550
|
+
const viewer = useViewer();
|
|
1551
|
+
const position = (0, __vueuse_core.refThrottled)((0, vue.computed)(() => (0, vue.toValue)(windowPosition)), throttled, false, true);
|
|
1552
|
+
const pick = (0, vue.computed)(() => {
|
|
1553
|
+
if (position.value && (0, vue.toValue)(isActive)) return viewer.value?.scene.drillPick(position.value, (0, vue.toValue)(limit), (0, vue.toValue)(width), (0, vue.toValue)(height));
|
|
1554
|
+
});
|
|
1555
|
+
return pick;
|
|
1456
1556
|
}
|
|
1557
|
+
|
|
1558
|
+
//#endregion
|
|
1457
1559
|
exports.CREATE_VIEWER_COLLECTION = CREATE_VIEWER_COLLECTION;
|
|
1458
1560
|
exports.CREATE_VIEWER_INJECTION_KEY = CREATE_VIEWER_INJECTION_KEY;
|
|
1459
1561
|
exports.CesiumMaterial = CesiumMaterial;
|
|
@@ -1516,4 +1618,4 @@ exports.useSceneDrillPick = useSceneDrillPick;
|
|
|
1516
1618
|
exports.useScenePick = useScenePick;
|
|
1517
1619
|
exports.useScreenSpaceEventHandler = useScreenSpaceEventHandler;
|
|
1518
1620
|
exports.useViewer = useViewer;
|
|
1519
|
-
//# sourceMappingURL=index.cjs.map
|
|
1621
|
+
//# sourceMappingURL=index.cjs.map
|