vesium 1.0.1-beta.64 → 1.0.1-beta.68

package/dist/index.cjs

@@ -99,8 +99,8 @@ function useCesiumEventListener(event, listener, options = {}) {
 		const events = Array.isArray(_event) ? _event : [_event];
 		if (events) {
 			if (events.length && isActive.value) {
-				const stopFns = events.map((event$1) => {
-					const e = (0, vue.toValue)(event$1);
+				const stopFns = events.map((event) => {
+					const e = (0, vue.toValue)(event);
 					return e?.addEventListener(listener, e);
 				});
 				onCleanup(() => stopFns.forEach((stop) => stop?.()));
@@ -341,49 +341,42 @@ function useElementOverlay(target, position, options = {}) {
 		}
 	});
 	const canvasBounding = (0, _vueuse_core.useElementBounding)(() => viewer.value?.canvas.parentElement);
-	const targetBounding = (0, _vueuse_core.useElementBounding)(target);
+	const targetSize = (0, _vueuse_core.useElementSize)(target, void 0, { box: "border-box" });
 	const finalOffset = (0, vue.computed)(() => {
 		const _offset = (0, vue.toValue)(offset);
-		let x$1 = _offset?.x ?? 0;
+		let x = _offset?.x ?? 0;
 		const _horizontal = (0, vue.toValue)(horizontal);
-		if (_horizontal === "center") x$1 -= targetBounding.width.value / 2;
-		else if (_horizontal === "right") x$1 -= targetBounding.width.value;
-		let y$1 = _offset?.y ?? 0;
+		if (_horizontal === "center") x -= targetSize.width.value / 2;
+		else if (_horizontal === "right") x -= targetSize.width.value;
+		let y = _offset?.y ?? 0;
 		const _vertical = (0, vue.toValue)(vertical);
-		if (_vertical === "center") y$1 -= targetBounding.height.value / 2;
-		else if (_vertical === "bottom") y$1 -= targetBounding.height.value;
+		if (_vertical === "center") y -= targetSize.height.value / 2;
+		else if (_vertical === "bottom") y -= targetSize.height.value;
 		return {
-			x: x$1,
-			y: y$1
+			x,
+			y
 		};
 	});
-	const location = (0, vue.computed)(() => {
-		const data = {
-			x: coord.value?.x ?? 0,
-			y: coord.value?.y ?? 0
-		};
-		if ((0, vue.toValue)(referenceWindow)) {
-			data.x += canvasBounding.x.value;
-			data.y += canvasBounding.y.value;
-		}
-		return {
-			x: finalOffset.value.x + data.x,
-			y: finalOffset.value.y + data.y
-		};
+	const x = (0, vue.computed)(() => {
+		let v = coord.value?.x ?? 0;
+		if ((0, vue.toValue)(referenceWindow)) v += canvasBounding.x.value;
+		return +(v + finalOffset.value.x).toFixed(1);
 	});
-	const x = (0, vue.computed)(() => location.value.x);
-	const y = (0, vue.computed)(() => location.value.y);
-	const style = (0, vue.computed)(() => ({
-		left: `${x.value?.toFixed(2)}px`,
-		top: `${y.value?.toFixed(2)}px`
-	}));
+	const y = (0, vue.computed)(() => {
+		let v = coord.value?.y ?? 0;
+		if ((0, vue.toValue)(referenceWindow)) v += canvasBounding.y.value;
+		return +(v + finalOffset.value.y).toFixed(1);
+	});
+	const style = (0, vue.computed)(() => `left:${x.value}px;top:${y.value}px;`);
 	(0, vue.watchEffect)(() => {
-		const element = (0, vue.toValue)(target);
-		if (element && (0, vue.toValue)(options.applyStyle ?? true)) {
-			element.style?.setProperty?.("left", style.value.left);
-			element.style?.setProperty?.("top", style.value.top);
+		const applyStyle = (0, vue.toValue)(options.applyStyle ?? true);
+		if (!applyStyle) return;
+		const element = (0, _vueuse_core.unrefElement)(target);
+		if (element && applyStyle) {
+			element.style?.setProperty?.("left", `${x.value}px`);
+			element.style?.setProperty?.("top", `${y.value}px`);
 		}
-	});
+	}, { flush: "post" });
 	return {
 		x,
 		y,
@@ -521,19 +514,19 @@ function useDrag(listener) {
 	const dragging = (0, vue.ref)(false);
 	const viewer = useViewer();
 	const cameraLocked = (0, vue.ref)(false);
-	(0, vue.watch)(cameraLocked, (cameraLocked$1) => {
-		viewer.value && (viewer.value.scene.screenSpaceCameraController.enableRotate = !cameraLocked$1);
+	(0, vue.watch)(cameraLocked, (cameraLocked) => {
+		viewer.value && (viewer.value.scene.screenSpaceCameraController.enableRotate = !cameraLocked);
 	});
 	const lockCamera = () => {
 		cameraLocked.value = true;
 	};
-	const execute = (pick$1, startPosition, endPosition) => {
+	const execute = (pick, startPosition, endPosition) => {
 		listener({
 			event: {
 				startPosition: startPosition.clone(),
 				endPosition: endPosition.clone()
 			},
-			pick: pick$1,
+			pick,
 			dragging: dragging.value,
 			lockCamera
 		});
@@ -551,10 +544,10 @@ function useDrag(listener) {
 			endPosition: endPosition.clone()
 		};
 	}, 8, false, true));
-	(0, vue.watch)([pick, motionEvent], ([pick$1, motionEvent$1]) => {
-		if (pick$1 && motionEvent$1) {
-			const { startPosition, endPosition } = motionEvent$1;
-			dragging.value && execute(pick$1, startPosition, endPosition);
+	(0, vue.watch)([pick, motionEvent], ([pick, motionEvent]) => {
+		if (pick && motionEvent) {
+			const { startPosition, endPosition } = motionEvent;
+			dragging.value && execute(pick, startPosition, endPosition);
 		}
 	});
 	const stopLeftUpWatch = useScreenSpaceEventHandler(cesium.ScreenSpaceEventType.LEFT_UP, (event) => {
@@ -580,13 +573,13 @@ function useDrag(listener) {
 function useHover(listener) {
 	const motionEvent = (0, vue.shallowRef)();
 	const pick = useScenePick(() => motionEvent.value?.endPosition);
-	const execute = (pick$1, startPosition, endPosition, hovering) => {
+	const execute = (pick, startPosition, endPosition, hovering) => {
 		listener({
 			event: {
 				startPosition: startPosition.clone(),
 				endPosition: endPosition.clone()
 			},
-			pick: pick$1,
+			pick,
 			hovering
 		});
 	};
@@ -596,13 +589,13 @@ function useHover(listener) {
 			endPosition: endPosition.clone()
 		};
 	});
-	(0, vue.watch)([pick, motionEvent], ([pick$1, motionEvent$1]) => {
-		if (pick$1 && motionEvent$1) {
-			const { startPosition, endPosition } = motionEvent$1;
-			execute(pick$1, startPosition, endPosition, true);
+	(0, vue.watch)([pick, motionEvent], ([pick, motionEvent]) => {
+		if (pick && motionEvent) {
+			const { startPosition, endPosition } = motionEvent;
+			execute(pick, startPosition, endPosition, true);
 		}
 	});
-	(0, vue.watch)(pick, (pick$1, prevPick) => {
+	(0, vue.watch)(pick, (pick, prevPick) => {
 		if (prevPick && motionEvent.value) {
 			const { startPosition, endPosition } = motionEvent.value;
 			execute(prevPick, startPosition, endPosition, false);
@@ -754,13 +747,14 @@ function useGraphicEvent() {
 //#endregion
 //#region useImageryLayer/index.ts
 function useImageryLayer(data, options = {}) {
-	const { destroyOnRemove, collection, isActive = true, evaluating } = options;
+	const { destroyOnRemove, collection, isActive = true, evaluating, index } = options;
 	const result = (0, _vueuse_core.computedAsync)(() => toPromiseValue(data), [], { evaluating });
 	const viewer = useViewer();
 	(0, vue.watchEffect)((onCleanup) => {
 		if ((0, vue.toValue)(isActive)) {
 			const list = Array.isArray(result.value) ? [...result.value] : [result.value];
 			const _collection = collection ?? viewer.value?.imageryLayers;
+			const _index = (0, vue.toValue)(index);
 			if (collection?.isDestroyed()) return;
 			list.forEach((item) => {
 				if (!item) {
@@ -771,7 +765,7 @@ function useImageryLayer(data, options = {}) {
 					console.warn("ImageryLayer is destroyed");
 					return;
 				}
-				_collection?.add(item);
+				_collection?.add(item, _index);
 			});
 			onCleanup(() => {
 				const destroy = (0, vue.toValue)(destroyOnRemove);
@@ -851,9 +845,9 @@ function usePostProcessStageScope(options = {}) {
 		addEffect(instance) {
 			if (!collection.value) throw new Error("collection is not defined");
 			if ((0, _vesium_shared.isPromise)(instance)) return new Promise((resolve, reject) => {
-				instance.then((instance$1) => {
-					collection.value.add(instance$1);
-					resolve(instance$1);
+				instance.then((instance) => {
+					collection.value.add(instance);
+					resolve(instance);
 				}).catch((error) => reject(error));
 			});
 			else return collection.value.add(instance);
@@ -901,7 +895,7 @@ function usePrimitiveScope(options = {}) {
 		addEffect(instance, ...args) {
 			if (!collection.value) throw new Error("collection is not defined");
 			if ((0, _vesium_shared.isPromise)(instance)) return new Promise((resolve, reject) => {
-				instance.then((instance$1) => resolve(collection.value.add(instance$1, ...args))).catch((error) => reject(error));
+				instance.then((instance) => resolve(collection.value.add(instance, ...args))).catch((error) => reject(error));
 			});
 			else return collection.value.add(instance, ...args);
 		},