@realsee/dnalogel 2.0.0-alpha.34 → 2.0.0-alpha.35

package/dist/PanoSpatialTagPlugin/Plugin.d.ts

@@ -15,6 +15,8 @@ export interface PanoSpatialTagPluginParameterType {
     minRad?: number;
     nearTolerance?: number;
     upsideHeight?: number;
+    minDistance?: number;
+    maxDistance?: number;
 }
 export interface PanoSpatialTagPluginExportType {
     load: (data: PanoSpatialTagPluginData) => void;

package/dist/PanoSpatialTagPlugin/index.js

@@ -423,7 +423,7 @@ function create_fragment(ctx) {
 			div3 = internal.element("div");
 			div2 = internal.element("div");
 			internal.attr(div0, "class", "PanoSpatialTagPlugin__tag-shadow svelte-eb8bdm");
-			internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+			internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			internal.attr(i0, "class", "PanoSpatialTagPlugin__tag-flagpole svelte-eb8bdm");
 			internal.set_style(i0, "width", /*lineWidthZoom*/ ctx[4] + "rem");
 			internal.attr(i1, "class", "PanoSpatialTagPlugin__tag-line1 svelte-eb8bdm");
@@ -463,7 +463,7 @@ function create_fragment(ctx) {
 		},
 		p(ctx, [dirty]) {
 			if (dirty & /*contentWidth, contentZoom, contentHeight, upsideDown*/ 394) {
-				internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+				internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			}
 
 			if (dirty & /*lineWidthZoom*/ 16) {
@@ -885,22 +885,22 @@ class Template {
 }
 
 const MESH_SIZE = 0.001;
-const RAY_ORIGIN_Y = 1.4;
 const RAY_TOLERANT_DISTANCE = 0.01;
 const BLUR_IMAGE_URL = 'https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png';
-const MIN_DISTANCE = 1.2;
-const MAX_DISTANCE = 3.5;
 /**
  * 空间游走标签插件
  */
 const PanoSpatialTagPlugin = (five$1, params) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     let wrapper = params === null || params === void 0 ? void 0 : params.container;
+    let centerY = 1.4;
     const wait = (_a = params === null || params === void 0 ? void 0 : params.wait) !== null && _a !== void 0 ? _a : 200;
     const maxNumberOnScreen = (_b = params === null || params === void 0 ? void 0 : params.maxNumberOnScreen) !== null && _b !== void 0 ? _b : 3;
     const minRad = (_c = params === null || params === void 0 ? void 0 : params.minRad) !== null && _c !== void 0 ? _c : Math.PI / 4;
     const nearTolerance = (_d = params === null || params === void 0 ? void 0 : params.nearTolerance) !== null && _d !== void 0 ? _d : 100;
     const upsideHeight = (_e = params === null || params === void 0 ? void 0 : params.upsideHeight) !== null && _e !== void 0 ? _e : 1.6;
+    const minDistance = (_f = params === null || params === void 0 ? void 0 : params.minDistance) !== null && _f !== void 0 ? _f : 1.2;
+    const maxDistance = (_g = params === null || params === void 0 ? void 0 : params.maxDistance) !== null && _g !== void 0 ? _g : 3.5;
     // const foldPercent = params?.foldPercent ?? 20
     const css3DRender = CSS3DRenderPlugin(five$1);
     const container = document.createElement('div');
@@ -954,8 +954,8 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
         frustum.setFromProjectionMatrix(projScreenMatrix);
         state.tags.forEach(tag => {
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(tag.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(tag.position);
+            if (distance < minDistance || distance > maxDistance)
                 return tag.destroying = true;
             if (!frustum.containsPoint(tag.position))
                 return tag.destroying = true;
@@ -967,16 +967,16 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         state.tags.forEach(tag => {
             if (tag.destroying) {
                 tag.app.$set({
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
                     destroying: tag.destroying,
                 });
             }
             else {
                 tag.app.$set({
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
-                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
+                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - minDistance) / maxDistance * 0.6,
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
                 });
             }
         });
@@ -1049,8 +1049,8 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         const points = state.points.reduce((result, point) => {
             if (state.tags.find(tag => point.id === tag.id && !tag.destroying))
                 return result;
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(point.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(point.position);
+            if (distance < minDistance || distance > maxDistance)
                 return result;
             if (!frustum.containsPoint(point.position))
                 return result;
@@ -1110,10 +1110,12 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                     Math.pow((mouse.y - _mouse.y) / 2 * clientHeight, 2)) > nearTolerance;
             }))
                 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.bvhs.loaded ?
-                five$1.model.intersectRaycaster(raycaster) :
-                raycaster.intersectObjects(five$1.model.children, true);
+            const raycaster = new THREE__namespace.Raycaster(camera.position.clone().setY(centerY), point.position.clone().sub(camera.position.clone().setY(centerY)).normalize(), 0, point.distance + RAY_TOLERANT_DISTANCE);
+            const [intersect] = state.intersectObjects ?
+                raycaster.intersectObjects(state.intersectObjects, true) :
+                (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) {
@@ -1133,9 +1135,9 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                     props: {
                         id,
                         content: state.render(state.template, replacement),
-                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / MAX_DISTANCE),
-                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                        contentZoom: 0.1 + camera.position.distanceTo(position) / MAX_DISTANCE,
+                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / maxDistance),
+                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - minDistance) / maxDistance * 0.6,
+                        contentZoom: 0.1 + camera.position.distanceTo(position) / maxDistance,
                         upsideDown: position.y > upsideHeight,
                         folded: state.folded,
                         events: state.events,
@@ -1180,6 +1182,13 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         if (data.folded === true)
             state.folded = data.folded;
     };
+    /** 设置射线碰撞检测objects
+     *
+     */
+    const setIntersectObjects = (objects) => {
+        state.intersectObjects = objects;
+        updateTags();
+    };
     /** 标签启用
      * 启用插件并重新计算展示标签
      */
@@ -1239,6 +1248,22 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                 tag.app.$set({ folded: true });
         });
     };
+    const onResize = () => {
+        five$1.once('renderFrame', updateOrigins);
+    };
+    const onModelLoaded = () => {
+        if (!wrapper)
+            wrapper = five$1.getElement().parentElement;
+        if (wrapper)
+            wrapper.appendChild(container);
+        state.forbidden = false;
+        centerY = five$1.model.bounding.getCenter(new THREE__namespace.Vector3()).y;
+        updateTags();
+        five$1.on('panoWillArrive', onPanoWillArrive);
+        five$1.on('panoArrived', onPanoArrived);
+        five$1.on('modeChange', onModeChange);
+        five$1.on('cameraUpdate', onCameraUpdate);
+    };
     const dispose = () => {
         blurImage = null;
         css3DRender.disposeAll();
@@ -1249,40 +1274,24 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         });
         state.origins = [];
         state.tags = [];
+        five$1.off('modelLoaded', onModelLoaded);
+        five$1.off('renderFrame', updateOrigins);
         five$1.off('panoWillArrive', onPanoWillArrive);
         five$1.off('panoArrived', onPanoArrived);
         five$1.off('modeChange', onModeChange);
         five$1.off('cameraUpdate', onCameraUpdate);
+        five$1.off('dispose', dispose);
+        window.removeEventListener('resize', onResize, false);
     };
-    if ((_f = five$1 === null || five$1 === void 0 ? void 0 : five$1.model) === null || _f === void 0 ? void 0 : _f.loaded) {
-        if (!wrapper)
-            wrapper = five$1.getElement().parentElement;
-        if (wrapper)
-            wrapper.appendChild(container);
-        state.forbidden = false;
-        updateTags();
-        five$1.on('panoWillArrive', onPanoWillArrive);
-        five$1.on('panoArrived', onPanoArrived);
-        five$1.on('modeChange', onModeChange);
-        five$1.on('cameraUpdate', onCameraUpdate);
-    }
-    else {
-        five$1.once('modelLoaded', () => {
-            if (!wrapper)
-                wrapper = five$1.getElement().parentElement;
-            if (wrapper)
-                wrapper.appendChild(container);
-            state.forbidden = false;
-            updateTags();
-            five$1.on('panoWillArrive', onPanoWillArrive);
-            five$1.on('panoArrived', onPanoArrived);
-            five$1.on('modeChange', onModeChange);
-            five$1.on('cameraUpdate', onCameraUpdate);
-        });
-    }
+    window.addEventListener('resize', onResize, false);
+    if ((_h = five$1 === null || five$1 === void 0 ? void 0 : five$1.model) === null || _h === void 0 ? void 0 : _h.loaded)
+        onModelLoaded();
+    else
+        five$1.once('modelLoaded', onModelLoaded);
     five$1.on('dispose', dispose);
     return {
         load,
+        setIntersectObjects,
         unfoldAll,
         foldAll,
         unfold,

package/dist/index.es.js

@@ -11964,7 +11964,7 @@ function create_fragment$4(ctx) {
 			div3 = element("div");
 			div2 = element("div");
 			attr(div0, "class", "PanoSpatialTagPlugin__tag-shadow svelte-eb8bdm");
-			set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+			set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			attr(i0, "class", "PanoSpatialTagPlugin__tag-flagpole svelte-eb8bdm");
 			set_style(i0, "width", /*lineWidthZoom*/ ctx[4] + "rem");
 			attr(i1, "class", "PanoSpatialTagPlugin__tag-line1 svelte-eb8bdm");
@@ -12004,7 +12004,7 @@ function create_fragment$4(ctx) {
 		},
 		p(ctx, [dirty]) {
 			if (dirty & /*contentWidth, contentZoom, contentHeight, upsideDown*/ 394) {
-				set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+				set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			}
 
 			if (dirty & /*lineWidthZoom*/ 16) {
@@ -12426,22 +12426,22 @@ class Template {
 }
 
 const MESH_SIZE = 0.001;
-const RAY_ORIGIN_Y = 1.4;
 const RAY_TOLERANT_DISTANCE = 0.01;
 const BLUR_IMAGE_URL = 'https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png';
-const MIN_DISTANCE = 1.2;
-const MAX_DISTANCE = 3.5;
 /**
  * 空间游走标签插件
  */
 const PanoSpatialTagPlugin = (five, params) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     let wrapper = params === null || params === void 0 ? void 0 : params.container;
+    let centerY = 1.4;
     const wait = (_a = params === null || params === void 0 ? void 0 : params.wait) !== null && _a !== void 0 ? _a : 200;
     const maxNumberOnScreen = (_b = params === null || params === void 0 ? void 0 : params.maxNumberOnScreen) !== null && _b !== void 0 ? _b : 3;
     const minRad = (_c = params === null || params === void 0 ? void 0 : params.minRad) !== null && _c !== void 0 ? _c : Math.PI / 4;
     const nearTolerance = (_d = params === null || params === void 0 ? void 0 : params.nearTolerance) !== null && _d !== void 0 ? _d : 100;
     const upsideHeight = (_e = params === null || params === void 0 ? void 0 : params.upsideHeight) !== null && _e !== void 0 ? _e : 1.6;
+    const minDistance = (_f = params === null || params === void 0 ? void 0 : params.minDistance) !== null && _f !== void 0 ? _f : 1.2;
+    const maxDistance = (_g = params === null || params === void 0 ? void 0 : params.maxDistance) !== null && _g !== void 0 ? _g : 3.5;
     // const foldPercent = params?.foldPercent ?? 20
     const css3DRender = CSS3DRenderPlugin(five);
     const container = document.createElement('div');
@@ -12495,8 +12495,8 @@ const PanoSpatialTagPlugin = (five, params) => {
         projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
         frustum.setFromProjectionMatrix(projScreenMatrix);
         state.tags.forEach(tag => {
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(tag.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(tag.position);
+            if (distance < minDistance || distance > maxDistance)
                 return tag.destroying = true;
             if (!frustum.containsPoint(tag.position))
                 return tag.destroying = true;
@@ -12508,16 +12508,16 @@ const PanoSpatialTagPlugin = (five, params) => {
         state.tags.forEach(tag => {
             if (tag.destroying) {
                 tag.app.$set({
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
                     destroying: tag.destroying,
                 });
             }
             else {
                 tag.app.$set({
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
-                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
+                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - minDistance) / maxDistance * 0.6,
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
                 });
             }
         });
@@ -12590,8 +12590,8 @@ const PanoSpatialTagPlugin = (five, params) => {
         const points = state.points.reduce((result, point) => {
             if (state.tags.find(tag => point.id === tag.id && !tag.destroying))
                 return result;
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(point.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(point.position);
+            if (distance < minDistance || distance > maxDistance)
                 return result;
             if (!frustum.containsPoint(point.position))
                 return result;
@@ -12651,10 +12651,12 @@ const PanoSpatialTagPlugin = (five, params) => {
                     Math.pow((mouse.y - _mouse.y) / 2 * clientHeight, 2)) > nearTolerance;
             }))
                 continue;
-            const raycaster = new THREE.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.model.bvhs.loaded ?
-                five.model.intersectRaycaster(raycaster) :
-                raycaster.intersectObjects(five.model.children, true);
+            const raycaster = new THREE.Raycaster(camera.position.clone().setY(centerY), point.position.clone().sub(camera.position.clone().setY(centerY)).normalize(), 0, point.distance + RAY_TOLERANT_DISTANCE);
+            const [intersect] = state.intersectObjects ?
+                raycaster.intersectObjects(state.intersectObjects, true) :
+                (five.model.bvhs.loaded ?
+                    five.model.intersectRaycaster(raycaster) :
+                    raycaster.intersectObjects(five.model.children, true));
             if (!intersect)
                 continue;
             if (point.distance - intersect.distance < RAY_TOLERANT_DISTANCE) {
@@ -12674,9 +12676,9 @@ const PanoSpatialTagPlugin = (five, params) => {
                     props: {
                         id,
                         content: state.render(state.template, replacement),
-                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / MAX_DISTANCE),
-                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                        contentZoom: 0.1 + camera.position.distanceTo(position) / MAX_DISTANCE,
+                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / maxDistance),
+                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - minDistance) / maxDistance * 0.6,
+                        contentZoom: 0.1 + camera.position.distanceTo(position) / maxDistance,
                         upsideDown: position.y > upsideHeight,
                         folded: state.folded,
                         events: state.events,
@@ -12721,6 +12723,13 @@ const PanoSpatialTagPlugin = (five, params) => {
         if (data.folded === true)
             state.folded = data.folded;
     };
+    /** 设置射线碰撞检测objects
+     *
+     */
+    const setIntersectObjects = (objects) => {
+        state.intersectObjects = objects;
+        updateTags();
+    };
     /** 标签启用
      * 启用插件并重新计算展示标签
      */
@@ -12780,6 +12789,22 @@ const PanoSpatialTagPlugin = (five, params) => {
                 tag.app.$set({ folded: true });
         });
     };
+    const onResize = () => {
+        five.once('renderFrame', updateOrigins);
+    };
+    const onModelLoaded = () => {
+        if (!wrapper)
+            wrapper = five.getElement().parentElement;
+        if (wrapper)
+            wrapper.appendChild(container);
+        state.forbidden = false;
+        centerY = five.model.bounding.getCenter(new THREE.Vector3()).y;
+        updateTags();
+        five.on('panoWillArrive', onPanoWillArrive);
+        five.on('panoArrived', onPanoArrived);
+        five.on('modeChange', onModeChange);
+        five.on('cameraUpdate', onCameraUpdate);
+    };
     const dispose = () => {
         blurImage = null;
         css3DRender.disposeAll();
@@ -12790,40 +12815,24 @@ const PanoSpatialTagPlugin = (five, params) => {
         });
         state.origins = [];
         state.tags = [];
+        five.off('modelLoaded', onModelLoaded);
+        five.off('renderFrame', updateOrigins);
         five.off('panoWillArrive', onPanoWillArrive);
         five.off('panoArrived', onPanoArrived);
         five.off('modeChange', onModeChange);
         five.off('cameraUpdate', onCameraUpdate);
+        five.off('dispose', dispose);
+        window.removeEventListener('resize', onResize, false);
     };
-    if ((_f = five === null || five === void 0 ? void 0 : five.model) === null || _f === void 0 ? void 0 : _f.loaded) {
-        if (!wrapper)
-            wrapper = five.getElement().parentElement;
-        if (wrapper)
-            wrapper.appendChild(container);
-        state.forbidden = false;
-        updateTags();
-        five.on('panoWillArrive', onPanoWillArrive);
-        five.on('panoArrived', onPanoArrived);
-        five.on('modeChange', onModeChange);
-        five.on('cameraUpdate', onCameraUpdate);
-    }
-    else {
-        five.once('modelLoaded', () => {
-            if (!wrapper)
-                wrapper = five.getElement().parentElement;
-            if (wrapper)
-                wrapper.appendChild(container);
-            state.forbidden = false;
-            updateTags();
-            five.on('panoWillArrive', onPanoWillArrive);
-            five.on('panoArrived', onPanoArrived);
-            five.on('modeChange', onModeChange);
-            five.on('cameraUpdate', onCameraUpdate);
-        });
-    }
+    window.addEventListener('resize', onResize, false);
+    if ((_h = five === null || five === void 0 ? void 0 : five.model) === null || _h === void 0 ? void 0 : _h.loaded)
+        onModelLoaded();
+    else
+        five.once('modelLoaded', onModelLoaded);
     five.on('dispose', dispose);
     return {
         load,
+        setIntersectObjects,
         unfoldAll,
         foldAll,
         unfold,

package/dist/index.js

@@ -11992,7 +11992,7 @@ function create_fragment$4(ctx) {
 			div3 = internal.element("div");
 			div2 = internal.element("div");
 			internal.attr(div0, "class", "PanoSpatialTagPlugin__tag-shadow svelte-eb8bdm");
-			internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+			internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			internal.attr(i0, "class", "PanoSpatialTagPlugin__tag-flagpole svelte-eb8bdm");
 			internal.set_style(i0, "width", /*lineWidthZoom*/ ctx[4] + "rem");
 			internal.attr(i1, "class", "PanoSpatialTagPlugin__tag-line1 svelte-eb8bdm");
@@ -12032,7 +12032,7 @@ function create_fragment$4(ctx) {
 		},
 		p(ctx, [dirty]) {
 			if (dirty & /*contentWidth, contentZoom, contentHeight, upsideDown*/ 394) {
-				internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px)");
+				internal.set_style(div0, "transform", "translate(" + /*contentWidth*/ ctx[7] / 2 * /*contentZoom*/ ctx[3] * 3 + "px, " + /*contentHeight*/ ctx[8] / 2 * (/*upsideDown*/ ctx[1] ? -1 : 1) * /*contentZoom*/ ctx[3] * 3 + "px) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
 			}
 
 			if (dirty & /*lineWidthZoom*/ 16) {
@@ -12454,22 +12454,22 @@ class Template {
 }
 
 const MESH_SIZE = 0.001;
-const RAY_ORIGIN_Y = 1.4;
 const RAY_TOLERANT_DISTANCE = 0.01;
 const BLUR_IMAGE_URL = 'https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png';
-const MIN_DISTANCE = 1.2;
-const MAX_DISTANCE = 3.5;
 /**
  * 空间游走标签插件
  */
 const PanoSpatialTagPlugin = (five$1, params) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     let wrapper = params === null || params === void 0 ? void 0 : params.container;
+    let centerY = 1.4;
     const wait = (_a = params === null || params === void 0 ? void 0 : params.wait) !== null && _a !== void 0 ? _a : 200;
     const maxNumberOnScreen = (_b = params === null || params === void 0 ? void 0 : params.maxNumberOnScreen) !== null && _b !== void 0 ? _b : 3;
     const minRad = (_c = params === null || params === void 0 ? void 0 : params.minRad) !== null && _c !== void 0 ? _c : Math.PI / 4;
     const nearTolerance = (_d = params === null || params === void 0 ? void 0 : params.nearTolerance) !== null && _d !== void 0 ? _d : 100;
     const upsideHeight = (_e = params === null || params === void 0 ? void 0 : params.upsideHeight) !== null && _e !== void 0 ? _e : 1.6;
+    const minDistance = (_f = params === null || params === void 0 ? void 0 : params.minDistance) !== null && _f !== void 0 ? _f : 1.2;
+    const maxDistance = (_g = params === null || params === void 0 ? void 0 : params.maxDistance) !== null && _g !== void 0 ? _g : 3.5;
     // const foldPercent = params?.foldPercent ?? 20
     const css3DRender = CSS3DRenderPlugin(five$1);
     const container = document.createElement('div');
@@ -12523,8 +12523,8 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
         frustum.setFromProjectionMatrix(projScreenMatrix);
         state.tags.forEach(tag => {
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(tag.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(tag.position);
+            if (distance < minDistance || distance > maxDistance)
                 return tag.destroying = true;
             if (!frustum.containsPoint(tag.position))
                 return tag.destroying = true;
@@ -12536,16 +12536,16 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         state.tags.forEach(tag => {
             if (tag.destroying) {
                 tag.app.$set({
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
                     destroying: tag.destroying,
                 });
             }
             else {
                 tag.app.$set({
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
-                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
+                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - minDistance) / maxDistance * 0.6,
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
                 });
             }
         });
@@ -12618,8 +12618,8 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         const points = state.points.reduce((result, point) => {
             if (state.tags.find(tag => point.id === tag.id && !tag.destroying))
                 return result;
-            const distance = camera.position.clone().setY(RAY_ORIGIN_Y).distanceTo(point.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            const distance = camera.position.clone().setY(centerY).distanceTo(point.position);
+            if (distance < minDistance || distance > maxDistance)
                 return result;
             if (!frustum.containsPoint(point.position))
                 return result;
@@ -12679,10 +12679,12 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                     Math.pow((mouse.y - _mouse.y) / 2 * clientHeight, 2)) > nearTolerance;
             }))
                 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.bvhs.loaded ?
-                five$1.model.intersectRaycaster(raycaster) :
-                raycaster.intersectObjects(five$1.model.children, true);
+            const raycaster = new THREE__namespace.Raycaster(camera.position.clone().setY(centerY), point.position.clone().sub(camera.position.clone().setY(centerY)).normalize(), 0, point.distance + RAY_TOLERANT_DISTANCE);
+            const [intersect] = state.intersectObjects ?
+                raycaster.intersectObjects(state.intersectObjects, true) :
+                (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) {
@@ -12702,9 +12704,9 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                     props: {
                         id,
                         content: state.render(state.template, replacement),
-                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / MAX_DISTANCE),
-                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                        contentZoom: 0.1 + camera.position.distanceTo(position) / MAX_DISTANCE,
+                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / maxDistance),
+                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - minDistance) / maxDistance * 0.6,
+                        contentZoom: 0.1 + camera.position.distanceTo(position) / maxDistance,
                         upsideDown: position.y > upsideHeight,
                         folded: state.folded,
                         events: state.events,
@@ -12749,6 +12751,13 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         if (data.folded === true)
             state.folded = data.folded;
     };
+    /** 设置射线碰撞检测objects
+     *
+     */
+    const setIntersectObjects = (objects) => {
+        state.intersectObjects = objects;
+        updateTags();
+    };
     /** 标签启用
      * 启用插件并重新计算展示标签
      */
@@ -12808,6 +12817,22 @@ const PanoSpatialTagPlugin = (five$1, params) => {
                 tag.app.$set({ folded: true });
         });
     };
+    const onResize = () => {
+        five$1.once('renderFrame', updateOrigins);
+    };
+    const onModelLoaded = () => {
+        if (!wrapper)
+            wrapper = five$1.getElement().parentElement;
+        if (wrapper)
+            wrapper.appendChild(container);
+        state.forbidden = false;
+        centerY = five$1.model.bounding.getCenter(new THREE__namespace.Vector3()).y;
+        updateTags();
+        five$1.on('panoWillArrive', onPanoWillArrive);
+        five$1.on('panoArrived', onPanoArrived);
+        five$1.on('modeChange', onModeChange);
+        five$1.on('cameraUpdate', onCameraUpdate);
+    };
     const dispose = () => {
         blurImage = null;
         css3DRender.disposeAll();
@@ -12818,40 +12843,24 @@ const PanoSpatialTagPlugin = (five$1, params) => {
         });
         state.origins = [];
         state.tags = [];
+        five$1.off('modelLoaded', onModelLoaded);
+        five$1.off('renderFrame', updateOrigins);
         five$1.off('panoWillArrive', onPanoWillArrive);
         five$1.off('panoArrived', onPanoArrived);
         five$1.off('modeChange', onModeChange);
         five$1.off('cameraUpdate', onCameraUpdate);
+        five$1.off('dispose', dispose);
+        window.removeEventListener('resize', onResize, false);
     };
-    if ((_f = five$1 === null || five$1 === void 0 ? void 0 : five$1.model) === null || _f === void 0 ? void 0 : _f.loaded) {
-        if (!wrapper)
-            wrapper = five$1.getElement().parentElement;
-        if (wrapper)
-            wrapper.appendChild(container);
-        state.forbidden = false;
-        updateTags();
-        five$1.on('panoWillArrive', onPanoWillArrive);
-        five$1.on('panoArrived', onPanoArrived);
-        five$1.on('modeChange', onModeChange);
-        five$1.on('cameraUpdate', onCameraUpdate);
-    }
-    else {
-        five$1.once('modelLoaded', () => {
-            if (!wrapper)
-                wrapper = five$1.getElement().parentElement;
-            if (wrapper)
-                wrapper.appendChild(container);
-            state.forbidden = false;
-            updateTags();
-            five$1.on('panoWillArrive', onPanoWillArrive);
-            five$1.on('panoArrived', onPanoArrived);
-            five$1.on('modeChange', onModeChange);
-            five$1.on('cameraUpdate', onCameraUpdate);
-        });
-    }
+    window.addEventListener('resize', onResize, false);
+    if ((_h = five$1 === null || five$1 === void 0 ? void 0 : five$1.model) === null || _h === void 0 ? void 0 : _h.loaded)
+        onModelLoaded();
+    else
+        five$1.once('modelLoaded', onModelLoaded);
     five$1.on('dispose', dispose);
     return {
         load,
+        setIntersectObjects,
         unfoldAll,
         foldAll,
         unfold,