@realsee/dnalogel 2.0.0-alpha.21 → 2.0.0-alpha.24

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # CHANGELOG
 
+## 2.0.0-alpha.24
+- 1.feat: PanoRulerPlugin 支持数据 reload。
+
+## 2.0.0-alpha.23
+- 1.fix: 修复 PanoFloorplanRadarPlugin reload 数据时报错
+- 2.fix: 修复 PanoFloorplanRadarPlugin reload 户型图数据后雷达图标位置没有适配
+
+## 2.0.0-alpha.22
+- 1.fix: 修复 PanoMeasurePlugin disable 状态下仍有背景色占位问题。
+
 ## 2.0.0-alpha.21
 - 1.fix: 修复 PanoMeasurePlugin 仅初始化 UI 面板仍占位为题。
 

package/dist/PanoMeasurePlugin/index.js

@@ -5407,6 +5407,7 @@ class MeasureController {
         this.container.style.pointerEvents = 'none';
         this.container.style.width = '100%';
         this.container.style.height = '100%';
+        this.container.style.opacity = '0';
         this.container.style.background = 'rgba(0, 0, 0, 0.15)';
         this.controllerParams = {
             five: this.five,
@@ -5452,6 +5453,8 @@ class MeasureController {
             return;
         this.hasOpen = true;
         this.five.scene.add(this.group);
+        // 修改透明度
+        this.container.style.opacity = '1';
         // 隐藏点位和鼠标聚焦环
         this.five.helperVisible = false;
         this.controller = new WatchController(this.controllerParams);
@@ -5467,6 +5470,8 @@ class MeasureController {
     disable() {
         var _a, _b, _c, _d;
         this.hasOpen = false;
+        // 修改透明度
+        this.container.style.opacity = '0';
         // 展示点位和鼠标聚焦环
         (_a = this.controller) === null || _a === void 0 ? void 0 : _a.dispose();
         (_b = this.useUIController) === null || _b === void 0 ? void 0 : _b.hide();
@@ -5519,7 +5524,7 @@ class MeasureController {
     }
 }
 
-const PanoMeasurePlugin = function MeasurePlugin(five, params) {
+const PanoMeasurePlugin = function PanoMeasurePlugin(five, params) {
     return new MeasureController(five, params);
 };
 

package/dist/PanoRulerPlugin/index.js

@@ -296,9 +296,9 @@ const PanoRulerPlugin = (five$1, params) => {
     $rule.appendChild(style);
     const __rule = {};
     const _load = (roomInfo, roomRules) => {
-        if (state.loaded) {
-            throw new Error('标尺被重复初始化！');
-        }
+        // if (state.loaded) {
+        //     throw new Error('标尺被重复初始化！')
+        // }
         const roomHeightInfo = getRoomHeightInfo(roomInfo, five$1);
         const work = five$1.work;
         if (!work)
@@ -374,6 +374,7 @@ const PanoRulerPlugin = (five$1, params) => {
             }
         }
         state.loaded = true;
+        freshRule();
         return true;
     };
     const load = async (_roomInfo, _roomRules, options) => {
@@ -382,6 +383,7 @@ const PanoRulerPlugin = (five$1, params) => {
         if (!roomInfo || !roomRules) {
             throw new Error('标尺数据依赖不齐全！');
         }
+        state.loaded = false;
         state.options = Object.assign({}, state.options, options || {});
         if (five$1.model.loaded) {
             return _load(roomInfo, roomRules);

package/dist/floorplan/PanoFloorplanRadarPlugin/Controller.d.ts

@@ -14,8 +14,7 @@ export default class PanoFloorplanRadarPluginController {
     private wrapperSelector;
     private data?;
     private wrapper;
-    private extraObjects?;
-    private originExtraObjects?;
+    private extraObjects;
     private configs;
     constructor(five: Five, params?: PanoFloorplanRadarPluginControllerParameter);
     dispose: () => void;

package/dist/floorplan/PanoFloorplanRadarPlugin/index.js

@@ -75,58 +75,54 @@ function create_fragment$8(ctx) {
 	};
 }
 
+function getCameraRotateTransform(longitude) {
+	// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
+	const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
+
+	return `rotate(${rotate}deg)`;
+}
+
 function instance$8($$self, $$props, $$invalidate) {
+	let positionTransform;
+	let rotateTransform;
 	let { five } = $$props;
 	let { pxmm } = $$props;
 	let { floorplanData } = $$props;
 	let { cameraImageUrl } = $$props;
+	let panoIndex = five.getCurrentState().panoIndex;
+	let longitude = five.getCurrentState().longitude;
 
 	/** 获取相机在当前 Five 状态下的位移 */
-	function getCameraPositionTransform(panoIndex) {
-		const observer = floorplanData.observers[panoIndex];
+	function getCameraPositionTransform(floorplanData, panoIndex) {
 		const bounding = floorplanData.bounding;
+		const floorplanObserver = floorplanData.observers[panoIndex];
+		if (!floorplanObserver) return '';
 		const clientWidth = (bounding.max.x - bounding.min.x) * pxmm;
 		const clientHeight = (bounding.max.y - bounding.min.y) * pxmm;
-		if (!observer) return '';
-		const left = Math.floor(observer.positionInImage.x * clientWidth);
-		const top = Math.floor(observer.positionInImage.y * clientHeight);
+		const left = Math.floor(floorplanObserver.positionInImage.x * clientWidth);
+		const top = Math.floor(floorplanObserver.positionInImage.y * clientHeight);
 		return `translate(${left}px, ${top}px)`;
 	}
 
-	/** 获取相机在当前 Five 状态下的旋转 */
-	function getCameraRotationTransform() {
-		const { longitude } = five.getCurrentState();
-
-		// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
-		const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
-
-		return `rotate(${rotate}deg)`;
+	function onFivePanoWillArrive(_panoIndex) {
+		$$invalidate(6, panoIndex = _panoIndex);
 	}
 
-	const changePosition = panoIndex => {
-		$$invalidate(2, positionTransform = getCameraPositionTransform(panoIndex));
-	};
-
-	const changeRotate = throttle(
-		() => {
-			$$invalidate(1, rotateTransform = getCameraRotationTransform());
+	const onFiveCameraDirectionUpdate = throttle(
+		pose => {
+			$$invalidate(7, longitude = pose.longitude);
 		},
 		1000 / 60
 	);
 
-	// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
-	let rotateTransform = getCameraRotationTransform();
-
-	let positionTransform = getCameraPositionTransform(five.getCurrentState().panoIndex);
-
 	svelte.onMount(() => {
-		five.on('panoWillArrive', changePosition);
-		five.on('cameraDirectionUpdate', changeRotate);
+		five.on('panoWillArrive', onFivePanoWillArrive);
+		five.on('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	svelte.onDestroy(() => {
-		five.off('panoWillArrive', changePosition);
-		five.off('cameraDirectionUpdate', changeRotate);
+		five.off('panoWillArrive', onFivePanoWillArrive);
+		five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	$$self.$$set = $$props => {
@@ -136,7 +132,27 @@ function instance$8($$self, $$props, $$invalidate) {
 		if ('cameraImageUrl' in $$props) $$invalidate(0, cameraImageUrl = $$props.cameraImageUrl);
 	};
 
-	return [cameraImageUrl, rotateTransform, positionTransform, five, pxmm, floorplanData];
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*floorplanData, panoIndex*/ 96) {
+			// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
+			$$invalidate(2, positionTransform = getCameraPositionTransform(floorplanData, panoIndex));
+		}
+
+		if ($$self.$$.dirty & /*longitude*/ 128) {
+			$$invalidate(1, rotateTransform = getCameraRotateTransform(longitude));
+		}
+	};
+
+	return [
+		cameraImageUrl,
+		rotateTransform,
+		positionTransform,
+		five,
+		pxmm,
+		floorplanData,
+		panoIndex,
+		longitude
+	];
 }
 
 class Camera extends internal.SvelteComponent {
@@ -1531,13 +1547,7 @@ class PanoFloorplanRadarPluginController {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "originExtraObjects", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
+            value: []
         });
         Object.defineProperty(this, "configs", {
             enumerable: true,
@@ -1598,7 +1608,6 @@ class PanoFloorplanRadarPluginController {
         this.render();
     }
     setExtraObjectsWith3DPositions(data) {
-        this.originExtraObjects = data;
         if (!this.data)
             return;
         this.extraObjects = formatExtraObjects(data, this.five, this.data);
@@ -1613,9 +1622,6 @@ class PanoFloorplanRadarPluginController {
         }
         if (!this.data || !this.wrapper)
             return;
-        if (!this.extraObjects && this.originExtraObjects) {
-            this.extraObjects = formatExtraObjects(this.originExtraObjects, this.five, this.data);
-        }
         const props = {
             five: this.five,
             floorplanData: this.data,

package/dist/index.es.js

@@ -4675,58 +4675,54 @@ function create_fragment$7(ctx) {
 	};
 }
 
+function getCameraRotateTransform(longitude) {
+	// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
+	const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
+
+	return `rotate(${rotate}deg)`;
+}
+
 function instance$7($$self, $$props, $$invalidate) {
+	let positionTransform;
+	let rotateTransform;
 	let { five } = $$props;
 	let { pxmm } = $$props;
 	let { floorplanData } = $$props;
 	let { cameraImageUrl } = $$props;
+	let panoIndex = five.getCurrentState().panoIndex;
+	let longitude = five.getCurrentState().longitude;
 
 	/** 获取相机在当前 Five 状态下的位移 */
-	function getCameraPositionTransform(panoIndex) {
-		const observer = floorplanData.observers[panoIndex];
+	function getCameraPositionTransform(floorplanData, panoIndex) {
 		const bounding = floorplanData.bounding;
+		const floorplanObserver = floorplanData.observers[panoIndex];
+		if (!floorplanObserver) return '';
 		const clientWidth = (bounding.max.x - bounding.min.x) * pxmm;
 		const clientHeight = (bounding.max.y - bounding.min.y) * pxmm;
-		if (!observer) return '';
-		const left = Math.floor(observer.positionInImage.x * clientWidth);
-		const top = Math.floor(observer.positionInImage.y * clientHeight);
+		const left = Math.floor(floorplanObserver.positionInImage.x * clientWidth);
+		const top = Math.floor(floorplanObserver.positionInImage.y * clientHeight);
 		return `translate(${left}px, ${top}px)`;
 	}
 
-	/** 获取相机在当前 Five 状态下的旋转 */
-	function getCameraRotationTransform() {
-		const { longitude } = five.getCurrentState();
-
-		// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
-		const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
-
-		return `rotate(${rotate}deg)`;
+	function onFivePanoWillArrive(_panoIndex) {
+		$$invalidate(6, panoIndex = _panoIndex);
 	}
 
-	const changePosition = panoIndex => {
-		$$invalidate(2, positionTransform = getCameraPositionTransform(panoIndex));
-	};
-
-	const changeRotate = throttle(
-		() => {
-			$$invalidate(1, rotateTransform = getCameraRotationTransform());
+	const onFiveCameraDirectionUpdate = throttle(
+		pose => {
+			$$invalidate(7, longitude = pose.longitude);
 		},
 		1000 / 60
 	);
 
-	// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
-	let rotateTransform = getCameraRotationTransform();
-
-	let positionTransform = getCameraPositionTransform(five.getCurrentState().panoIndex);
-
 	onMount(() => {
-		five.on('panoWillArrive', changePosition);
-		five.on('cameraDirectionUpdate', changeRotate);
+		five.on('panoWillArrive', onFivePanoWillArrive);
+		five.on('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	onDestroy(() => {
-		five.off('panoWillArrive', changePosition);
-		five.off('cameraDirectionUpdate', changeRotate);
+		five.off('panoWillArrive', onFivePanoWillArrive);
+		five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	$$self.$$set = $$props => {
@@ -4736,7 +4732,27 @@ function instance$7($$self, $$props, $$invalidate) {
 		if ('cameraImageUrl' in $$props) $$invalidate(0, cameraImageUrl = $$props.cameraImageUrl);
 	};
 
-	return [cameraImageUrl, rotateTransform, positionTransform, five, pxmm, floorplanData];
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*floorplanData, panoIndex*/ 96) {
+			// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
+			$$invalidate(2, positionTransform = getCameraPositionTransform(floorplanData, panoIndex));
+		}
+
+		if ($$self.$$.dirty & /*longitude*/ 128) {
+			$$invalidate(1, rotateTransform = getCameraRotateTransform(longitude));
+		}
+	};
+
+	return [
+		cameraImageUrl,
+		rotateTransform,
+		positionTransform,
+		five,
+		pxmm,
+		floorplanData,
+		panoIndex,
+		longitude
+	];
 }
 
 class Camera extends SvelteComponent {
@@ -5443,13 +5459,7 @@ class PanoFloorplanRadarPluginController {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "originExtraObjects", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
+            value: []
         });
         Object.defineProperty(this, "configs", {
             enumerable: true,
@@ -5510,7 +5520,6 @@ class PanoFloorplanRadarPluginController {
         this.render();
     }
     setExtraObjectsWith3DPositions(data) {
-        this.originExtraObjects = data;
         if (!this.data)
             return;
         this.extraObjects = formatExtraObjects(data, this.five, this.data);
@@ -5525,9 +5534,6 @@ class PanoFloorplanRadarPluginController {
         }
         if (!this.data || !this.wrapper)
             return;
-        if (!this.extraObjects && this.originExtraObjects) {
-            this.extraObjects = formatExtraObjects(this.originExtraObjects, this.five, this.data);
-        }
         const props = {
             five: this.five,
             floorplanData: this.data,
@@ -7092,9 +7098,9 @@ const PanoRulerPlugin = (five, params) => {
     $rule.appendChild(style);
     const __rule = {};
     const _load = (roomInfo, roomRules) => {
-        if (state.loaded) {
-            throw new Error('标尺被重复初始化！');
-        }
+        // if (state.loaded) {
+        //     throw new Error('标尺被重复初始化！')
+        // }
         const roomHeightInfo = getRoomHeightInfo(roomInfo, five);
         const work = five.work;
         if (!work)
@@ -7170,6 +7176,7 @@ const PanoRulerPlugin = (five, params) => {
             }
         }
         state.loaded = true;
+        freshRule();
         return true;
     };
     const load = async (_roomInfo, _roomRules, options) => {
@@ -7178,6 +7185,7 @@ const PanoRulerPlugin = (five, params) => {
         if (!roomInfo || !roomRules) {
             throw new Error('标尺数据依赖不齐全！');
         }
+        state.loaded = false;
         state.options = Object.assign({}, state.options, options || {});
         if (five.model.loaded) {
             return _load(roomInfo, roomRules);
@@ -13052,6 +13060,7 @@ class MeasureController {
         this.container.style.pointerEvents = 'none';
         this.container.style.width = '100%';
         this.container.style.height = '100%';
+        this.container.style.opacity = '0';
         this.container.style.background = 'rgba(0, 0, 0, 0.15)';
         this.controllerParams = {
             five: this.five,
@@ -13097,6 +13106,8 @@ class MeasureController {
             return;
         this.hasOpen = true;
         this.five.scene.add(this.group);
+        // 修改透明度
+        this.container.style.opacity = '1';
         // 隐藏点位和鼠标聚焦环
         this.five.helperVisible = false;
         this.controller = new WatchController(this.controllerParams);
@@ -13112,6 +13123,8 @@ class MeasureController {
     disable() {
         var _a, _b, _c, _d;
         this.hasOpen = false;
+        // 修改透明度
+        this.container.style.opacity = '0';
         // 展示点位和鼠标聚焦环
         (_a = this.controller) === null || _a === void 0 ? void 0 : _a.dispose();
         (_b = this.useUIController) === null || _b === void 0 ? void 0 : _b.hide();
@@ -13164,7 +13177,7 @@ class MeasureController {
     }
 }
 
-const PanoMeasurePlugin = function MeasurePlugin(five, params) {
+const PanoMeasurePlugin = function PanoMeasurePlugin(five, params) {
     return new MeasureController(five, params);
 };
 

package/dist/index.js

@@ -4702,58 +4702,54 @@ function create_fragment$7(ctx) {
 	};
 }
 
+function getCameraRotateTransform(longitude) {
+	// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
+	const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
+
+	return `rotate(${rotate}deg)`;
+}
+
 function instance$7($$self, $$props, $$invalidate) {
+	let positionTransform;
+	let rotateTransform;
 	let { five } = $$props;
 	let { pxmm } = $$props;
 	let { floorplanData } = $$props;
 	let { cameraImageUrl } = $$props;
+	let panoIndex = five.getCurrentState().panoIndex;
+	let longitude = five.getCurrentState().longitude;
 
 	/** 获取相机在当前 Five 状态下的位移 */
-	function getCameraPositionTransform(panoIndex) {
-		const observer = floorplanData.observers[panoIndex];
+	function getCameraPositionTransform(floorplanData, panoIndex) {
 		const bounding = floorplanData.bounding;
+		const floorplanObserver = floorplanData.observers[panoIndex];
+		if (!floorplanObserver) return '';
 		const clientWidth = (bounding.max.x - bounding.min.x) * pxmm;
 		const clientHeight = (bounding.max.y - bounding.min.y) * pxmm;
-		if (!observer) return '';
-		const left = Math.floor(observer.positionInImage.x * clientWidth);
-		const top = Math.floor(observer.positionInImage.y * clientHeight);
+		const left = Math.floor(floorplanObserver.positionInImage.x * clientWidth);
+		const top = Math.floor(floorplanObserver.positionInImage.y * clientHeight);
 		return `translate(${left}px, ${top}px)`;
 	}
 
-	/** 获取相机在当前 Five 状态下的旋转 */
-	function getCameraRotationTransform() {
-		const { longitude } = five.getCurrentState();
-
-		// 为什么要加 45 ==> 因为 UI 给的图初始角度是 -45
-		const rotate = Math.floor(longitude / Math.PI * 180) * -1 + 45;
-
-		return `rotate(${rotate}deg)`;
+	function onFivePanoWillArrive(_panoIndex) {
+		$$invalidate(6, panoIndex = _panoIndex);
 	}
 
-	const changePosition = panoIndex => {
-		$$invalidate(2, positionTransform = getCameraPositionTransform(panoIndex));
-	};
-
-	const changeRotate = throttle(
-		() => {
-			$$invalidate(1, rotateTransform = getCameraRotationTransform());
+	const onFiveCameraDirectionUpdate = throttle(
+		pose => {
+			$$invalidate(7, longitude = pose.longitude);
 		},
 		1000 / 60
 	);
 
-	// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
-	let rotateTransform = getCameraRotationTransform();
-
-	let positionTransform = getCameraPositionTransform(five.getCurrentState().panoIndex);
-
 	svelte.onMount(() => {
-		five.on('panoWillArrive', changePosition);
-		five.on('cameraDirectionUpdate', changeRotate);
+		five.on('panoWillArrive', onFivePanoWillArrive);
+		five.on('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	svelte.onDestroy(() => {
-		five.off('panoWillArrive', changePosition);
-		five.off('cameraDirectionUpdate', changeRotate);
+		five.off('panoWillArrive', onFivePanoWillArrive);
+		five.off('cameraDirectionUpdate', onFiveCameraDirectionUpdate);
 	});
 
 	$$self.$$set = $$props => {
@@ -4763,7 +4759,27 @@ function instance$7($$self, $$props, $$invalidate) {
 		if ('cameraImageUrl' in $$props) $$invalidate(0, cameraImageUrl = $$props.cameraImageUrl);
 	};
 
-	return [cameraImageUrl, rotateTransform, positionTransform, five, pxmm, floorplanData];
+	$$self.$$.update = () => {
+		if ($$self.$$.dirty & /*floorplanData, panoIndex*/ 96) {
+			// 初始状态，不能等 mount 之后再计算，那样第一次 camera 展示的时候也会有动画
+			$$invalidate(2, positionTransform = getCameraPositionTransform(floorplanData, panoIndex));
+		}
+
+		if ($$self.$$.dirty & /*longitude*/ 128) {
+			$$invalidate(1, rotateTransform = getCameraRotateTransform(longitude));
+		}
+	};
+
+	return [
+		cameraImageUrl,
+		rotateTransform,
+		positionTransform,
+		five,
+		pxmm,
+		floorplanData,
+		panoIndex,
+		longitude
+	];
 }
 
 class Camera extends internal.SvelteComponent {
@@ -5470,13 +5486,7 @@ class PanoFloorplanRadarPluginController {
             enumerable: true,
             configurable: true,
             writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "originExtraObjects", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
+            value: []
         });
         Object.defineProperty(this, "configs", {
             enumerable: true,
@@ -5537,7 +5547,6 @@ class PanoFloorplanRadarPluginController {
         this.render();
     }
     setExtraObjectsWith3DPositions(data) {
-        this.originExtraObjects = data;
         if (!this.data)
             return;
         this.extraObjects = formatExtraObjects(data, this.five, this.data);
@@ -5552,9 +5561,6 @@ class PanoFloorplanRadarPluginController {
         }
         if (!this.data || !this.wrapper)
             return;
-        if (!this.extraObjects && this.originExtraObjects) {
-            this.extraObjects = formatExtraObjects(this.originExtraObjects, this.five, this.data);
-        }
         const props = {
             five: this.five,
             floorplanData: this.data,
@@ -7119,9 +7125,9 @@ const PanoRulerPlugin = (five$1, params) => {
     $rule.appendChild(style);
     const __rule = {};
     const _load = (roomInfo, roomRules) => {
-        if (state.loaded) {
-            throw new Error('标尺被重复初始化！');
-        }
+        // if (state.loaded) {
+        //     throw new Error('标尺被重复初始化！')
+        // }
         const roomHeightInfo = getRoomHeightInfo(roomInfo, five$1);
         const work = five$1.work;
         if (!work)
@@ -7197,6 +7203,7 @@ const PanoRulerPlugin = (five$1, params) => {
             }
         }
         state.loaded = true;
+        freshRule();
         return true;
     };
     const load = async (_roomInfo, _roomRules, options) => {
@@ -7205,6 +7212,7 @@ const PanoRulerPlugin = (five$1, params) => {
         if (!roomInfo || !roomRules) {
             throw new Error('标尺数据依赖不齐全！');
         }
+        state.loaded = false;
         state.options = Object.assign({}, state.options, options || {});
         if (five$1.model.loaded) {
             return _load(roomInfo, roomRules);
@@ -13079,6 +13087,7 @@ class MeasureController {
         this.container.style.pointerEvents = 'none';
         this.container.style.width = '100%';
         this.container.style.height = '100%';
+        this.container.style.opacity = '0';
         this.container.style.background = 'rgba(0, 0, 0, 0.15)';
         this.controllerParams = {
             five: this.five,
@@ -13124,6 +13133,8 @@ class MeasureController {
             return;
         this.hasOpen = true;
         this.five.scene.add(this.group);
+        // 修改透明度
+        this.container.style.opacity = '1';
         // 隐藏点位和鼠标聚焦环
         this.five.helperVisible = false;
         this.controller = new WatchController(this.controllerParams);
@@ -13139,6 +13150,8 @@ class MeasureController {
     disable() {
         var _a, _b, _c, _d;
         this.hasOpen = false;
+        // 修改透明度
+        this.container.style.opacity = '0';
         // 展示点位和鼠标聚焦环
         (_a = this.controller) === null || _a === void 0 ? void 0 : _a.dispose();
         (_b = this.useUIController) === null || _b === void 0 ? void 0 : _b.hide();
@@ -13191,7 +13204,7 @@ class MeasureController {
     }
 }
 
-const PanoMeasurePlugin = function MeasurePlugin(five, params) {
+const PanoMeasurePlugin = function PanoMeasurePlugin(five, params) {
     return new MeasureController(five, params);
 };