@realsee/dnalogel 2.0.0-alpha.26-beta → 2.0.0-alpha.28-beta

package/dist/index.umd.js

@@ -578,17 +578,19 @@
 
     /* src/ModelRoomLabelPlugin/RoomLabelItems.svelte generated by Svelte v3.47.0 */
 
+    const { Map: Map_1 } = internal.globals;
+
     function add_css$l(target) {
     	internal.append_styles(target, "svelte-9eg4zi", ".room-labels-container.svelte-9eg4zi{width:100%;height:100%;position:relative;color:#fff}");
     }
 
     function get_each_context$9(ctx, list, i) {
     	const child_ctx = ctx.slice();
-    	child_ctx[9] = list[i];
+    	child_ctx[12] = list[i];
     	return child_ctx;
     }
 
-    // (70:2) {#each roomLabels as roomLableItem (roomLableItem.id)}
+    // (82:2) {#each roomLabels as roomLableItem (roomLableItem.id)}
     function create_each_block$9(key_1, ctx) {
     	let first;
     	let roomlabelitem;
@@ -596,7 +598,7 @@
 
     	roomlabelitem = new RoomLabelItem({
     			props: {
-    				roomLabel: /*roomLableItem*/ ctx[9],
+    				roomLabel: /*roomLableItem*/ ctx[12],
     				five: /*five*/ ctx[1]
     			}
     		});
@@ -617,7 +619,7 @@
     		p(new_ctx, dirty) {
     			ctx = new_ctx;
     			const roomlabelitem_changes = {};
-    			if (dirty & /*roomLabels*/ 1) roomlabelitem_changes.roomLabel = /*roomLableItem*/ ctx[9];
+    			if (dirty & /*roomLabels*/ 1) roomlabelitem_changes.roomLabel = /*roomLableItem*/ ctx[12];
     			if (dirty & /*five*/ 2) roomlabelitem_changes.five = /*five*/ ctx[1];
     			roomlabelitem.$set(roomlabelitem_changes);
     		},
@@ -640,11 +642,11 @@
     function create_fragment$p(ctx) {
     	let div;
     	let each_blocks = [];
-    	let each_1_lookup = new Map();
+    	let each_1_lookup = new Map_1();
     	let div_resize_listener;
     	let current;
     	let each_value = /*roomLabels*/ ctx[0];
-    	const get_key = ctx => /*roomLableItem*/ ctx[9].id;
+    	const get_key = ctx => /*roomLableItem*/ ctx[12].id;
 
     	for (let i = 0; i < each_value.length; i += 1) {
     		let child_ctx = get_each_context$9(ctx, each_value, i);
@@ -661,7 +663,7 @@
     			}
 
     			internal.attr(div, "class", "room-labels-container svelte-9eg4zi");
-    			internal.add_render_callback(() => /*div_elementresize_handler*/ ctx[4].call(div));
+    			internal.add_render_callback(() => /*div_elementresize_handler*/ ctx[6].call(div));
     		},
     		m(target, anchor) {
     			internal.insert(target, div, anchor);
@@ -670,7 +672,7 @@
     				each_blocks[i].m(div, null);
     			}
 
-    			div_resize_listener = internal.add_resize_listener(div, /*div_elementresize_handler*/ ctx[4].bind(div));
+    			div_resize_listener = internal.add_resize_listener(div, /*div_elementresize_handler*/ ctx[6].bind(div));
     			current = true;
     		},
     		p(ctx, [dirty]) {
@@ -710,22 +712,17 @@
     }
 
     function instance$p($$self, $$props, $$invalidate) {
+    	let rendererSize;
     	let { five } = $$props;
     	let { roomLabels } = $$props;
     	let containerWidth;
     	let containerHeight;
+    	let shownFloor = null;
 
-    	function getLabelVisible(five, roomLabelItem) {
-    		// 先看是不是在当前展示的楼层上
-    		const isLabelInFloor = five.model.shownFloor === null || roomLabelItem.floorIndex === five.model.shownFloor;
-
-    		if (!isLabelInFloor) return false;
-
-    		// 再看是不是被模型遮挡
+    	function getLabelVisible(item) {
     		const raycaster = new THREE.Raycaster();
-
     		const cameraPosition = five.camera.position.clone();
-    		const position = new THREE.Vector3(roomLabelItem.position.x, roomLabelItem.position.y, roomLabelItem.position.z);
+    		const position = new THREE.Vector3(item.position.x, item.position.y, item.position.z);
     		const vectorDistance = position.distanceTo(cameraPosition);
     		raycaster.set(cameraPosition.clone(), position.clone().sub(cameraPosition).normalize());
     		const [intersection] = five.model.intersectRaycaster(raycaster);
@@ -733,53 +730,60 @@
     		return true;
     	}
 
-    	function getLabelTransform(five, roomLabelItem) {
-    		const position = new THREE.Vector3(roomLabelItem.position.x, roomLabelItem.position.y, roomLabelItem.position.z);
+    	function getLabelTransform(item, rendererSize) {
+    		const position = new THREE.Vector3(item.position.x, item.position.y, item.position.z);
     		const mouse = position.clone().project(five.camera);
-    		const xOffset = Math.ceil((mouse.x + 1) / 2 * containerWidth);
-    		const yOffset = Math.ceil((-mouse.y + 1) / 2 * containerHeight);
+    		const xOffset = Math.ceil((mouse.x + 1) / 2 * rendererSize.x);
+    		const yOffset = Math.ceil((-mouse.y + 1) / 2 * rendererSize.y);
     		return `translate(${xOffset}px, ${yOffset}px)`;
     	}
 
-    	function getFormatedRoomLabels(five, labels) {
-    		const newLabels = labels.map(roomLabelItem => {
-    			// 计算是否可见，如果不可见，不会更新位置
-    			const visible = getLabelVisible(five, roomLabelItem);
+    	function getFormatedRoomLabels(rendererSize) {
+    		// 因为 item distance 需要重复计算，所以缓存一下
+    		const distanceMap = new Map();
+
+    		function getItemDistance(item) {
+    			const cacheDistance = distanceMap.get(item.id);
+    			if (cacheDistance) return cacheDistance;
+    			const { x, y, z } = item.position;
+    			const distance = new THREE.Vector3(x, y, z).clone().distanceTo(five.camera.position);
+    			distanceMap.set(item.id, distance);
+    			return distance;
+    		}
 
-    			if (!visible) return Object.assign(Object.assign({}, roomLabelItem), { visible });
+    		const formatedItems = roomLabels.map(item => {
+    			const visible = getLabelVisible(item);
 
-    			// 更新位置
-    			const transform = getLabelTransform(five, roomLabelItem);
+    			const transform = visible
+    			? getLabelTransform(item, rendererSize)
+    			: item.transform;
 
-    			return Object.assign(Object.assign({}, roomLabelItem), { visible, transform });
-    		});
+    			const itemDistance = getItemDistance(item);
 
-    		const sortedRoomLabelItems = newLabels.filter(({ visible }) => visible).map(roomLabelItem => ({
-    			roomLabelItem,
-    			distance: new THREE.Vector3(...Object.values(roomLabelItem.position)).clone().distanceTo(five.camera.position)
-    		})).sort((a, b) => a.distance - b.distance);
+    			// visible === true 的 item 中，distance 比自己小的 item 个数
+    			const minItemLen = roomLabels.filter(item => item.visible && getItemDistance(item) < itemDistance).length;
 
-    		return newLabels.map(roomLabelItem => {
-    			const sortIndex = sortedRoomLabelItems.findIndex(item => item.roomLabelItem.id === roomLabelItem.id);
-    			if (sortIndex !== undefined) return Object.assign(Object.assign({}, roomLabelItem), { zIndex: sortIndex * 10 });
-    			return roomLabelItem;
+    			const zIndex = minItemLen * 10;
+    			return Object.assign(Object.assign({}, item), { visible, transform, zIndex });
     		});
+
+    		return formatedItems;
     	}
 
     	function onFiveCameraUpdate() {
-    		$$invalidate(0, roomLabels = getFormatedRoomLabels(five, roomLabels));
+    		$$invalidate(0, roomLabels = getFormatedRoomLabels(rendererSize));
+    	}
+
+    	function onFiveModelShownFloorChange(floorIndex) {
+    		$$invalidate(4, shownFloor = floorIndex);
     	}
 
     	five.on('cameraUpdate', onFiveCameraUpdate);
-    	five.on('modelShownFloorChange', onFiveCameraUpdate);
+    	five.on('modelShownFloorChange', onFiveModelShownFloorChange);
 
     	svelte.onDestroy(() => {
     		five.off('cameraUpdate', onFiveCameraUpdate);
-    		five.off('modelShownFloorChange', onFiveCameraUpdate);
-    	});
-
-    	svelte.onMount(() => {
-    		onFiveCameraUpdate();
+    		five.off('modelShownFloorChange', onFiveModelShownFloorChange);
     	});
 
     	function div_elementresize_handler() {
@@ -794,7 +798,39 @@
     		if ('roomLabels' in $$props) $$invalidate(0, roomLabels = $$props.roomLabels);
     	};
 
-    	return [roomLabels, five, containerWidth, containerHeight, div_elementresize_handler];
+    	$$self.$$.update = () => {
+    		if ($$self.$$.dirty & /*containerWidth, containerHeight*/ 12) {
+    			$$invalidate(5, rendererSize = { x: containerWidth, y: containerHeight });
+    		}
+
+    		if ($$self.$$.dirty & /*rendererSize*/ 32) {
+    			{
+    				// rendererSize 变化时，触发 reRender
+    				$$invalidate(0, roomLabels = getFormatedRoomLabels(rendererSize));
+    			}
+    		}
+
+    		if ($$self.$$.dirty & /*roomLabels, shownFloor*/ 17) {
+    			{
+    				// shownFloor 变化时，更新 item visible
+    				$$invalidate(0, roomLabels = roomLabels.map(item => {
+    					const isLabelInFloor = shownFloor === null || item.floorIndex === shownFloor;
+    					const visible = isLabelInFloor ? item.visible : false;
+    					return Object.assign(Object.assign({}, item), { visible });
+    				}));
+    			}
+    		}
+    	};
+
+    	return [
+    		roomLabels,
+    		five,
+    		containerWidth,
+    		containerHeight,
+    		shownFloor,
+    		rendererSize,
+    		div_elementresize_handler
+    	];
     }
 
     class RoomLabelItems extends internal.SvelteComponent {
@@ -963,6 +999,10 @@
     const ModelRoomLabelPlugin = (five) => {
         return new ModelRoomLabelController(five);
     };
+    const modelRoomLabelPluginServerParams = {
+        name: 'ModelRoomLabelPlugin',
+        version: 0,
+    };
 
     exports.FLOOR_PLAN_ATTACHED_TO = void 0;
     (function (FLOOR_PLAN_ATTACHED_TO) {
@@ -6651,20 +6691,20 @@
     /**
      * 运镜效果
      */
-    var CameraMovementEffect;
+    exports.CameraMovementEffect = void 0;
     (function (CameraMovementEffect) {
         CameraMovementEffect["Move"] = "Move";
         CameraMovementEffect["Rotate"] = "Rotate";
-    })(CameraMovementEffect || (CameraMovementEffect = {}));
+    })(exports.CameraMovementEffect || (exports.CameraMovementEffect = {}));
     /**
      * 旋转类型
      */
-    var Rotation;
+    exports.Rotation = void 0;
     (function (Rotation) {
         Rotation["Clockwise"] = "Clockwise";
         Rotation["Anticlockwise"] = "Anticlockwise";
         Rotation["Loop"] = "Loop";
-    })(Rotation || (Rotation = {}));
+    })(exports.Rotation || (exports.Rotation = {}));
 
     const PI_2 = Math.PI * 2;
     /**
@@ -6695,18 +6735,18 @@
         from = formatLongitude(from);
         to = formatLongitude(to);
         // 逆时针旋转，初始值必须是较大的值
-        if (rotation === Rotation.Anticlockwise && from < to)
+        if (rotation === exports.Rotation.Anticlockwise && from < to)
             from += PI_2;
         // 顺时针旋转，结束值必须是较大值
-        if (rotation === Rotation.Clockwise && to < from)
+        if (rotation === exports.Rotation.Clockwise && to < from)
             to += PI_2;
         // Loop 旋转，找锐角旋转
         // 如果 to 比 from 大 180°，逆时针转
         // 如果 from 比 to 大 180°，顺时针转
-        if (rotation === Rotation.Loop && to - from > PI)
-            return getLongitudeParams(from, to, Rotation.Anticlockwise);
-        if (rotation === Rotation.Loop && from - to > PI)
-            return getLongitudeParams(from, to, Rotation.Clockwise);
+        if (rotation === exports.Rotation.Loop && to - from > PI)
+            return getLongitudeParams(from, to, exports.Rotation.Anticlockwise);
+        if (rotation === exports.Rotation.Loop && from - to > PI)
+            return getLongitudeParams(from, to, exports.Rotation.Clockwise);
         return { from, to };
     };
     /**
@@ -6756,7 +6796,7 @@
             const fromLatitude = formatLatitude(currentFiveState.latitude);
             const toLatitude = formatLatitude(args.latitude);
             // longitude
-            const { from: fromLongitude, to: toLongitude } = getLongitudeParams(currentFiveState.longitude, args.longitude, args.rotation || Rotation.Loop);
+            const { from: fromLongitude, to: toLongitude } = getLongitudeParams(currentFiveState.longitude, args.longitude, args.rotation || exports.Rotation.Loop);
             // fov
             const fromFov = currentFiveState.fov;
             const toFov = args.fov;
@@ -6814,7 +6854,7 @@
                     .onUpdate(onUpdate)
                     .onComplete(onComplete)
                     .onDestroy(onDestroy);
-                if (args.rotation === Rotation.Loop) {
+                if (args.rotation === exports.Rotation.Loop) {
                     tween.repeat(Infinity).yoyo(true);
                 }
                 /**
@@ -7785,6 +7825,11 @@
         }
     }
 
+    const panoCompassPluginServerParams = {
+        name: 'PanoCompassPlugin',
+        version: 0,
+    };
+
     /** 交换数组元素 */
     function exchange(array, index1, index2) {
         const value = array[index1];
@@ -14074,7 +14119,9 @@
                 }))
                     continue;
                 const raycaster = new THREE__namespace.Raycaster(camera.position.clone().setY(RAY_ORIGIN_Y), point.position.clone().sub(camera.position.clone().setY(RAY_ORIGIN_Y)).normalize(), 0, point.distance + RAY_TOLERANT_DISTANCE);
-                const [intersect] = five$1.model.intersectRaycaster(raycaster);
+                const [intersect] = five$1.model.bvhs.loaded ?
+                    five$1.model.intersectRaycaster(raycaster) :
+                    raycaster.intersectObjects(five$1.model.children, true);
                 if (!intersect)
                     continue;
                 if (point.distance - intersect.distance < RAY_TOLERANT_DISTANCE) {
@@ -14115,10 +14162,10 @@
             return newTags;
         };
         /** 标签数据加载
-        * @param data.points {Array} 标签数据
-        * @param data.enabled {Boolean} 插件是否启用
-        * @param data.folded {Boolean} 标签是否默认展开
-        */
+         * @param data.points {Array} 标签数据
+         * @param data.enabled {Boolean} 插件是否启用
+         * @param data.folded {Boolean} 标签是否默认展开
+         */
         const load = (data) => {
             state.points = data.points.map(point => {
                 var _a, _b;
@@ -14142,16 +14189,16 @@
                 state.folded = data.folded;
         };
         /** 标签启用
-        * 启用插件并重新计算展示标签
-        */
+         * 启用插件并重新计算展示标签
+         */
         const enable = () => {
             state.enabled = true;
             updateTags();
         };
         /** 插件禁用
-        * 1. 禁用同时会清除已展示的标签
-        * 2. 再次启用时会重新计算展示标签
-        */
+         * 1. 禁用同时会清除已展示的标签
+         * 2. 再次启用时会重新计算展示标签
+         */
         const disable = () => {
             state.enabled = false;
             origins.$set({ origins: [] });
@@ -14163,9 +14210,9 @@
             state.tags = [];
         };
         /** 展开所有标签
-        * 1. 展开所有收起的标签
-        * 2. 新标签会默认展开
-        */
+         * 1. 展开所有收起的标签
+         * 2. 新标签会默认展开
+         */
         const unfoldAll = () => {
             state.folded = false;
             state.tags.forEach(tag => {
@@ -14173,9 +14220,9 @@
             });
         };
         /** 收起所有标签
-        * 1. 收起所有展开的标签
-        * 2. 新标签会默认收起
-        */
+         * 1. 收起所有展开的标签
+         * 2. 新标签会默认收起
+         */
         const foldAll = () => {
             state.folded = true;
             state.tags.forEach(tag => {
@@ -14183,8 +14230,8 @@
             });
         };
         /** 展开单个标签
-        * @param id {Number | String} 标签ID
-        */
+         * @param id {Number | String} 标签ID
+         */
         const unfold = (id) => {
             state.tags.forEach(tag => {
                 if (tag.id === id)
@@ -14192,8 +14239,8 @@
             });
         };
         /** 收起单个标签
-        * @param id {Number | String} 标签ID
-        */
+         * @param id {Number | String} 标签ID
+         */
         const fold = (id) => {
             state.tags.forEach(tag => {
                 if (tag.id === id)
@@ -14227,7 +14274,7 @@
             five$1.on('cameraUpdate', onCameraUpdate);
         }
         else {
-            five$1.once('modelBvhLoaded', () => {
+            five$1.once('modelLoaded', () => {
                 if (!wrapper)
                     wrapper = five$1.getElement().parentElement;
                 wrapper.appendChild(container);
@@ -14253,13 +14300,13 @@
         };
     };
 
-    var DISPLAY_STRATEGY_TYPE;
+    exports.DISPLAY_STRATEGY_TYPE = void 0;
     (function (DISPLAY_STRATEGY_TYPE) {
         DISPLAY_STRATEGY_TYPE["SMALL"] = "small";
         DISPLAY_STRATEGY_TYPE["MIDLLE"] = "middle";
         DISPLAY_STRATEGY_TYPE["LARGE"] = "large";
         DISPLAY_STRATEGY_TYPE["EXTRA_LARGE"] = "x-large";
-    })(DISPLAY_STRATEGY_TYPE || (DISPLAY_STRATEGY_TYPE = {}));
+    })(exports.DISPLAY_STRATEGY_TYPE || (exports.DISPLAY_STRATEGY_TYPE = {}));
 
     /* src/ModelItemLabelPlugin/ItemLabelItem.svelte generated by Svelte v3.47.0 */
 
@@ -14399,7 +14446,7 @@
     	return child_ctx;
     }
 
-    // (162:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
+    // (163:1) {#each renderItemLabels as itemLabelItem (itemLabelItem.id)}
     function create_each_block(key_1, ctx) {
     	let first;
     	let itemlabelitem;
@@ -14600,13 +14647,13 @@
 
     	function getStrokeLength(itemSpaceHeight, type) {
     		switch (type) {
-    			case DISPLAY_STRATEGY_TYPE.SMALL:
+    			case exports.DISPLAY_STRATEGY_TYPE.SMALL:
     				return Math.ceil(-27.78 * itemSpaceHeight + 85);
-    			case DISPLAY_STRATEGY_TYPE.MIDLLE:
+    			case exports.DISPLAY_STRATEGY_TYPE.MIDLLE:
     				return Math.ceil(-38.9 * itemSpaceHeight + 130);
-    			case DISPLAY_STRATEGY_TYPE.LARGE:
+    			case exports.DISPLAY_STRATEGY_TYPE.LARGE:
     				return Math.ceil(-44.44 * itemSpaceHeight + 140);
-    			case DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
+    			case exports.DISPLAY_STRATEGY_TYPE.EXTRA_LARGE:
     				return Math.ceil(-92.59 * itemSpaceHeight + 300);
     		}
     	}
@@ -14782,7 +14829,7 @@
             app: undefined,
             hooks: new five.Subscribe(),
             modelOcclusionEnable: (_a = params === null || params === void 0 ? void 0 : params.modelOcclusionEnable) !== null && _a !== void 0 ? _a : true,
-            displayStrategyType: (_b = params === null || params === void 0 ? void 0 : params.displayStrategyType) !== null && _b !== void 0 ? _b : DISPLAY_STRATEGY_TYPE.SMALL,
+            displayStrategyType: (_b = params === null || params === void 0 ? void 0 : params.displayStrategyType) !== null && _b !== void 0 ? _b : exports.DISPLAY_STRATEGY_TYPE.SMALL,
         };
         pluginState.container.setAttribute('class', 'model-item-label-plugin-container');
         pluginState.container.style.cssText = `
@@ -14886,13 +14933,18 @@
         };
     };
 
-    var DIRECTION;
+    const modelItemLabelPluginServerParams = {
+        name: 'ModelItemLabelPlugin',
+        version: 0,
+    };
+
+    exports.DIRECTION = void 0;
     (function (DIRECTION) {
         DIRECTION["TOP_LEFT"] = "topLeft";
         DIRECTION["TOP_RIGHT"] = "topRight";
         DIRECTION["BOTTOM_LEFT"] = "bottomLeft";
         DIRECTION["BOTTOM_RIGHT"] = "bottomRight";
-    })(DIRECTION || (DIRECTION = {}));
+    })(exports.DIRECTION || (exports.DIRECTION = {}));
 
     function parseModelTVVideoPoints(points) {
         if (points.length === 0)
@@ -14901,7 +14953,7 @@
             return points;
         let newPoints = [];
         points.map(point => {
-            const newPoint = [point[DIRECTION.TOP_LEFT], point[DIRECTION.BOTTOM_LEFT], point[DIRECTION.BOTTOM_RIGHT], point[DIRECTION.TOP_RIGHT]];
+            const newPoint = [point[exports.DIRECTION.TOP_LEFT], point[exports.DIRECTION.BOTTOM_LEFT], point[exports.DIRECTION.BOTTOM_RIGHT], point[exports.DIRECTION.TOP_RIGHT]];
             newPoints.push(newPoint);
         });
         return newPoints;
@@ -15175,6 +15227,9 @@
     exports.PanoRulerPlugin = PanoRulerPlugin;
     exports.PanoSpatialTagPlugin = PanoSpatialTagPlugin;
     exports.TopviewFloorplanPlugin = TopviewFloorplanPlugin;
+    exports.modelItemLabelPluginServerParams = modelItemLabelPluginServerParams;
+    exports.modelRoomLabelPluginServerParams = modelRoomLabelPluginServerParams;
+    exports.panoCompassPluginServerParams = panoCompassPluginServerParams;
 
     Object.defineProperty(exports, '__esModule', { value: true });