@realsee/dnalogel 2.0.3 → 2.0.4-dev.1

package/dist/PanoSpatialTagPlugin/index.js

@@ -1,1307 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var THREE = require('three');
-var five = require('@realsee/five');
-var CSS3DRenderer = require('three/examples/jsm/renderers/CSS3DRenderer');
-var internal = require('svelte/internal');
-var store = require('svelte/store');
-var svelte = require('svelte');
-
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n["default"] = e;
-    return Object.freeze(n);
-}
-
-var THREE__namespace = /*#__PURE__*/_interopNamespace(THREE);
-
-function evenNumber(num, config) {
-    const roundNum = Math.round(num);
-    return roundNum % 2 === 0 ? roundNum : roundNum + Number((config === null || config === void 0 ? void 0 : config.smaller) ? -1 : 1);
-}
-
-function centerPoint(point1, point2) {
-    return new THREE.Vector3((point1.x + point2.x) / 2, (point1.y + point2.y) / 2, (point1.z + point2.z) / 2);
-}
-
-const transformPositionToVector3 = ({ x, y, z }) => new THREE.Vector3(x, y, z);
-
-/**
- * @description: 究极简陋的 ResizeObserver polyfill
- */
-function createResizeObserver(func, element) {
-    if (!element || typeof ResizeObserver === 'undefined') {
-        return {
-            observe: () => window.addEventListener('resize', func),
-            unobserve: () => window.removeEventListener('resize', func),
-        };
-    }
-    else {
-        const observer = new ResizeObserver(func);
-        return {
-            observe: () => observer.observe(element),
-            unobserve: () => observer.unobserve(element),
-        };
-    }
-}
-
-/**
- * **CSS3DRenderPlugin** 提供矩形区域（三维空间四个坐标点），你可以在此矩形区域中渲染 DOM 内容。
- * 实现原理参考[CSS3DRenderer](https://threejs.org/docs/index.html?q=CSS3D#examples/en/renderers/CSS3DRenderer)。
- *
- * @returns
- */
-const CSS3DRenderPlugin = (five) => {
-    const state = { disposeCallbacks: [] };
-    const create3DDomContainer = (...params) => {
-        var _a, _b, _c;
-        const points = params[0].map((point) => (point instanceof THREE.Vector3 ? point : transformPositionToVector3(point)));
-        const config = params[1];
-        if ((points === null || points === void 0 ? void 0 : points.length) < 4)
-            return console.error('points must be equal or greater than than 4');
-        if (!((_a = five === null || five === void 0 ? void 0 : five.model) === null || _a === void 0 ? void 0 : _a.loaded))
-            return console.error('five.model.loaded is: ', (_b = five === null || five === void 0 ? void 0 : five.model) === null || _b === void 0 ? void 0 : _b.loaded);
-        const fiveElement = five.getElement();
-        if (!fiveElement)
-            return console.error('five.getElement() is ' + fiveElement);
-        const disposers = [];
-        const ratio = (config === null || config === void 0 ? void 0 : config.ratio) || 0.00216;
-        if (ratio <= 0.00215)
-            console.warn('if you need click css3DElement on safari, ratio must be greater than 0.00215');
-        const dpr = (config === null || config === void 0 ? void 0 : config.dpr) || 1;
-        const mode = (config === null || config === void 0 ? void 0 : config.mode) || 'front';
-        const autoRender = (_c = config === null || config === void 0 ? void 0 : config.autoRender) !== null && _c !== void 0 ? _c : true;
-        const behindFiveContainer = (config === null || config === void 0 ? void 0 : config.behindFiveContainer) || fiveElement.parentElement || document.body;
-        const container = (config === null || config === void 0 ? void 0 : config.container) || document.createElement('div');
-        container.classList.add('__Dnalogel-plugin--CSS3DRenderPlugin');
-        // 获取css3DObject, 如果mode为behind的话，一起获取mesh
-        const { css3DObject, mesh } = createObject(points, { ratio, dpr, container, mode });
-        // ======= INIT START =======
-        let resizeObserver;
-        const frontModeUnInited = mode === 'front' && !state.frontMode;
-        const behindModeUnInited = mode === 'behind' && !state.behindMode;
-        const inited = !(frontModeUnInited || behindModeUnInited);
-        if (behindModeUnInited) {
-            state.behindMode = { scene: new THREE.Scene(), css3DRenderer: new CSS3DRenderer.CSS3DRenderer() };
-        }
-        if (frontModeUnInited) {
-            state.frontMode = { scene: new THREE.Scene(), css3DRenderer: new CSS3DRenderer.CSS3DRenderer() };
-        }
-        const stateMode = mode === 'behind' ? state.behindMode : state.frontMode;
-        const { scene, css3DRenderer } = stateMode;
-        const render = (() => {
-            if (!inited) {
-                const css3DRendererSetSize = () => {
-                    // 这里evenNumber策略是遇到奇数会加1，不知道为啥会触发滚动条显示，导致fiveElement变小，fiveElement变小又触发了这里的resize，宽高变小，滚动条消失，然后又触发resize。。。无限循环
-                    // 为了规避上面这种情况，evenNumber设置了一个参数，遇到奇数可选择减一
-                    const rendererWidth = evenNumber(fiveElement.clientWidth, { smaller: true });
-                    const rendererHeight = evenNumber(fiveElement.clientHeight, { smaller: true });
-                    css3DRenderer.setSize(rendererWidth, rendererHeight);
-                };
-                css3DRendererSetSize();
-                resizeObserver = createResizeObserver(css3DRendererSetSize, fiveElement);
-                css3DRenderer.domElement.style.position = 'absolute';
-                css3DRenderer.domElement.style.top = '0';
-                css3DRenderer.domElement.style.userSelect = 'none';
-                css3DRenderer.domElement.style.pointerEvents = 'none';
-                const renderEveryFrame = () => {
-                    const requestAnimationFrameId = requestAnimationFrame(renderEveryFrame);
-                    stateMode.requestAnimationFrameId = requestAnimationFrameId;
-                    css3DRenderer.render(scene, five.camera);
-                };
-                return () => {
-                    var _a;
-                    scene.add(css3DObject);
-                    (_a = resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.observe) === null || _a === void 0 ? void 0 : _a.call(resizeObserver);
-                    renderEveryFrame();
-                    if (mode === 'behind' && mesh) {
-                        five.scene.add(mesh);
-                        disposers.push(() => mesh && five.scene.remove(mesh));
-                    }
-                };
-            }
-            else {
-                return () => {
-                    scene.add(css3DObject);
-                };
-            }
-        })();
-        if (frontModeUnInited) {
-            const wrapper = fiveElement.parentElement || document.body;
-            wrapper.appendChild(css3DRenderer.domElement);
-        }
-        if (behindModeUnInited) {
-            const wrapper = behindFiveContainer;
-            wrapper.appendChild(css3DRenderer.domElement);
-        }
-        // ======= INIT END =======
-        const dispose = () => {
-            var _a;
-            disposers.forEach((d) => d === null || d === void 0 ? void 0 : d());
-            scene.remove(css3DObject);
-            if (scene.children.length === 0) {
-                if (typeof stateMode.requestAnimationFrameId === 'number') {
-                    cancelAnimationFrame(stateMode.requestAnimationFrameId);
-                }
-                css3DRenderer.domElement.remove();
-                if (mode === 'front')
-                    state.frontMode = undefined;
-                if (mode === 'behind')
-                    state.behindMode = undefined;
-                if (!state.behindMode && !state.frontMode) {
-                    (_a = resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.unobserve) === null || _a === void 0 ? void 0 : _a.call(resizeObserver);
-                }
-            }
-            return true;
-        };
-        const idx = state.disposeCallbacks.findIndex((item) => item === dispose);
-        if (idx !== -1) {
-            state.disposeCallbacks.splice(idx, 1);
-        }
-        else {
-            state.disposeCallbacks.push(dispose);
-        }
-        if (autoRender)
-            render();
-        return { container, dispose, css3DObject, render: autoRender ? undefined : render };
-    };
-    const createObject = (points, config) => {
-        const { ratio, dpr, container: element, mode } = config;
-        const planeWidth = points[0].distanceTo(points[1]);
-        const planeHeight = points[1].distanceTo(points[2]);
-        const domWidthPx = evenNumber((planeWidth / ratio) * dpr);
-        const domHeightPx = evenNumber((planeHeight / ratio) * dpr);
-        const css3DObject = new CSS3DRenderer.CSS3DObject(element);
-        css3DObject.scale.set(ratio, ratio, ratio);
-        element.style.width = domWidthPx + 'px';
-        element.style.height = domHeightPx + 'px';
-        element.style.pointerEvents = 'none';
-        const centerPosition = centerPoint(points[0], points[2]);
-        const vector01 = points[1].clone().sub(points[0]); // 点0 -> 点1 的向量
-        const vector12 = points[2].clone().sub(points[1]); // 点1 -> 点2 的向量
-        // 旋转
-        const rotateXAngle = new THREE.Vector3(0, 1, 0).angleTo(new THREE.Vector3(0, vector12.y, vector12.z));
-        const rotateYAngle = new THREE.Vector3(1, 0, 0).angleTo(new THREE.Vector3(vector01.x, 0, vector01.z));
-        const rotateZAngle = vector01.angleTo(new THREE.Vector3(vector01.x, 0, vector01.z));
-        /**
-         * [0,1,0] => [0,0,1]  为rotate Worldx正方向
-         * [0,0,1] => [0,1,0]  为rotate Worldy正方向
-         * [0,1,1] => [-1,0,0] 为rotate Worldz正方向
-         */
-        const rotateX = (vector12.z > 0 ? -1 : 1) * rotateXAngle;
-        const rotateY = (vector01.z < 0 ? 1 : -1) * rotateYAngle;
-        const rotateZ = ((vector01.x > 0 && vector01.y < 0) || (vector01.x < 0 && vector01.y > 0) ? -1 : 1) * rotateZAngle;
-        css3DObject.rotateOnWorldAxis(new THREE.Vector3(1, 0, 0), rotateX); // x
-        css3DObject.rotateOnWorldAxis(new THREE.Vector3(0, 1, 0), rotateY); // y
-        css3DObject.rotateOnWorldAxis(new THREE.Vector3(0, 0, 1), rotateZ); // z
-        css3DObject.position.set(centerPosition.x, centerPosition.y, centerPosition.z);
-        let mesh;
-        if (mode === 'behind') {
-            const material = new THREE__namespace.MeshBasicMaterial({
-                opacity: 0,
-                transparent: false,
-                side: THREE__namespace.DoubleSide,
-            });
-            const geometry = new THREE__namespace.PlaneGeometry(domWidthPx, domHeightPx);
-            mesh = new THREE__namespace.Mesh(geometry, material);
-            mesh.name = 'CSS3DRenderPlugin-mesh';
-            mesh.position.copy(css3DObject.position);
-            mesh.rotation.copy(css3DObject.rotation);
-            mesh.scale.copy(css3DObject.scale);
-        }
-        return { css3DObject, mesh };
-    };
-    return {
-        create3DDomContainer,
-        disposeAll: () => {
-            state.disposeCallbacks.forEach((d) => d === null || d === void 0 ? void 0 : d());
-            state.disposeCallbacks = [];
-        },
-    };
-};
-
-const currentTarget = store.writable(null);
-
-/* src/PanoSpatialTagPlugin/Components/origins.svelte generated by Svelte v3.50.1 */
-
-function add_css$1(target) {
-	internal.append_styles(target, "svelte-1kuu68s", ".PanoSpatialTagPlugin__tag-origin.svelte-1kuu68s{position:absolute;width:0.5rem;height:0.5rem;border-radius:50%;background:#fff;box-shadow:0 0 .6rem #fff;transform:translate(-50%, -50%) scale(1);transform-origin:center center;-webkit-animation:svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin 1.2s forwards;animation:svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin 1.2s forwards;pointer-events:auto}.PanoSpatialTagPlugin__tag-origin.svelte-1kuu68s:after{content:'';position:absolute;top:50%;height:50%;width:2rem;height:2rem;transform:translate(-50%, -50%)}.PanoSpatialTagPlugin__tag-origin-destroy.svelte-1kuu68s{transform:translate(-50%, -50%) scale(0.6);-webkit-animation:svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin-destroy 1.2s forwards .7s;animation:svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin-destroy 1.2s forwards .7s}@-webkit-keyframes svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin{0%{transform:translate(-50%, -50%) scale(1);opacity:0}100%{transform:translate(-50%, -50%) scale(0.6);opacity:1 }}@keyframes svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin{0%{transform:translate(-50%, -50%) scale(1);opacity:0}100%{transform:translate(-50%, -50%) scale(0.6);opacity:1 }}@-webkit-keyframes svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin-destroy{0%{transform:translate(-50%, -50%) scale(0.6);opacity:1}10%{transform:translate(-50%, -50%) scale(1);opacity:0.9}100%{transform:translate(-50%, -50%) scale(1);opacity:0}}@keyframes svelte-1kuu68s-PanoSpatialTagPlugin__tag-origin-destroy{0%{transform:translate(-50%, -50%) scale(0.6);opacity:1}10%{transform:translate(-50%, -50%) scale(1);opacity:0.9}100%{transform:translate(-50%, -50%) scale(1);opacity:0}}");
-}
-
-function get_each_context(ctx, list, i) {
-	const child_ctx = ctx.slice();
-	child_ctx[3] = list[i];
-	return child_ctx;
-}
-
-// (8:0) {#each origins as origin}
-function create_each_block(ctx) {
-	let i;
-	let style_top = `${/*origin*/ ctx[3].top}%`;
-	let style_left = `${/*origin*/ ctx[3].left}%`;
-	let mounted;
-	let dispose;
-
-	function click_handler() {
-		return /*click_handler*/ ctx[2](/*origin*/ ctx[3]);
-	}
-
-	return {
-		c() {
-			i = internal.element("i");
-			internal.attr(i, "class", "svelte-1kuu68s");
-			internal.toggle_class(i, "PanoSpatialTagPlugin__tag-origin", true);
-			internal.toggle_class(i, "PanoSpatialTagPlugin__tag-origin-destroy", /*origin*/ ctx[3].destroying);
-			internal.set_style(i, "top", style_top, false);
-			internal.set_style(i, "left", style_left, false);
-			internal.set_style(i, "visibility", /*origin*/ ctx[3].front ? 'visible' : 'hidden', false);
-		},
-		m(target, anchor) {
-			internal.insert(target, i, anchor);
-
-			if (!mounted) {
-				dispose = internal.listen(i, "click", click_handler);
-				mounted = true;
-			}
-		},
-		p(new_ctx, dirty) {
-			ctx = new_ctx;
-
-			if (dirty & /*origins*/ 1) {
-				internal.toggle_class(i, "PanoSpatialTagPlugin__tag-origin-destroy", /*origin*/ ctx[3].destroying);
-			}
-
-			if (dirty & /*origins*/ 1 && style_top !== (style_top = `${/*origin*/ ctx[3].top}%`)) {
-				internal.set_style(i, "top", style_top, false);
-			}
-
-			if (dirty & /*origins*/ 1 && style_left !== (style_left = `${/*origin*/ ctx[3].left}%`)) {
-				internal.set_style(i, "left", style_left, false);
-			}
-
-			if (dirty & /*origins*/ 1) {
-				internal.set_style(i, "visibility", /*origin*/ ctx[3].front ? 'visible' : 'hidden', false);
-			}
-		},
-		d(detaching) {
-			if (detaching) internal.detach(i);
-			mounted = false;
-			dispose();
-		}
-	};
-}
-
-function create_fragment$1(ctx) {
-	let each_1_anchor;
-	let each_value = /*origins*/ ctx[0];
-	let each_blocks = [];
-
-	for (let i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
-	}
-
-	return {
-		c() {
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				each_blocks[i].c();
-			}
-
-			each_1_anchor = internal.empty();
-		},
-		m(target, anchor) {
-			for (let i = 0; i < each_blocks.length; i += 1) {
-				each_blocks[i].m(target, anchor);
-			}
-
-			internal.insert(target, each_1_anchor, anchor);
-		},
-		p(ctx, [dirty]) {
-			if (dirty & /*origins, handleClick*/ 3) {
-				each_value = /*origins*/ ctx[0];
-				let i;
-
-				for (i = 0; i < each_value.length; i += 1) {
-					const child_ctx = get_each_context(ctx, each_value, i);
-
-					if (each_blocks[i]) {
-						each_blocks[i].p(child_ctx, dirty);
-					} else {
-						each_blocks[i] = create_each_block(child_ctx);
-						each_blocks[i].c();
-						each_blocks[i].m(each_1_anchor.parentNode, each_1_anchor);
-					}
-				}
-
-				for (; i < each_blocks.length; i += 1) {
-					each_blocks[i].d(1);
-				}
-
-				each_blocks.length = each_value.length;
-			}
-		},
-		i: internal.noop,
-		o: internal.noop,
-		d(detaching) {
-			internal.destroy_each(each_blocks, detaching);
-			if (detaching) internal.detach(each_1_anchor);
-		}
-	};
-}
-
-function instance$1($$self, $$props, $$invalidate) {
-	let { origins } = $$props;
-
-	const handleClick = id => {
-		currentTarget.update(() => `${id}-PanoSpatialTagPlugin-${Date.now()}`);
-	};
-
-	const click_handler = origin => handleClick(origin.id);
-
-	$$self.$$set = $$props => {
-		if ('origins' in $$props) $$invalidate(0, origins = $$props.origins);
-	};
-
-	return [origins, handleClick, click_handler];
-}
-
-class Origins extends internal.SvelteComponent {
-	constructor(options) {
-		super();
-		internal.init(this, options, instance$1, create_fragment$1, internal.safe_not_equal, { origins: 0 }, add_css$1);
-	}
-}
-
-/* src/PanoSpatialTagPlugin/Components/tag.svelte generated by Svelte v3.50.1 */
-
-function add_css(target) {
-	internal.append_styles(target, "svelte-eb8bdm", ".PanoSpatialTagPlugin__tag-x.svelte-eb8bdm.svelte-eb8bdm{position:absolute;top:0;left:0;display:block;white-space:nowrap;box-sizing:border-box;width:25rem;height:14rem;color:#FFF;transform:translate(0, -100%);transition:height .5s linear}.PanoSpatialTagPlugin__tag-shadow.svelte-eb8bdm.svelte-eb8bdm{content:'';position:absolute;width:30rem;height:30rem;top:-15rem;left:-15rem;z-index:-1;opacity:0;transition:opacity .8s .6s;background:url('https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png');background-size:30rem 30rem}.PanoSpatialTagPlugin__tag-line.svelte-eb8bdm.svelte-eb8bdm{position:absolute;left:-1rem;width:2rem;height:100%;overflow:hidden}.PanoSpatialTagPlugin__tag-flagpole.svelte-eb8bdm.svelte-eb8bdm{position:absolute;top:0;left:1rem;height:calc(100% - 1.5rem);width:.15rem;background:linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, .1));box-shadow:0 .1rem .5rem rgba(0, 0, 0, .2);opacity:0;transform:translate(-50%, 60%) scaleY(0);transition:transform .4s cubic-bezier(.44,.44,.74,.98) , opacity .4s cubic-bezier(.44,.44,.74,.98), width .5s linear, height .5s linear ;transform-origin:center bottom}.PanoSpatialTagPlugin__tag-line1.svelte-eb8bdm.svelte-eb8bdm{position:absolute;top:0;left:0.3rem;height:1.8rem;width:.1rem;background:#fff;opacity:0;transform:translate(-50%, 200%) scaleY(0);transform-origin:center top}.PanoSpatialTagPlugin__tag-line2.svelte-eb8bdm.svelte-eb8bdm{position:absolute;top:0;left:0.5rem;height:1.8rem;width:.1rem;background:#fff;opacity:0;transform:translate(-50%, 200%) scaleY(0);transform-origin:center top}.PanoSpatialTagPlugin__tag-show.svelte-eb8bdm .PanoSpatialTagPlugin__tag-line1.svelte-eb8bdm{-webkit-animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1 linear .5s forwards .45s;animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1 linear .5s forwards .45s}.PanoSpatialTagPlugin__tag-show.svelte-eb8bdm .PanoSpatialTagPlugin__tag-line2.svelte-eb8bdm{-webkit-animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2 linear .5s forwards .65s;animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2 linear .5s forwards .65s}.PanoSpatialTagPlugin__tag-x.PanoSpatialTagPlugin__tag-upside-down.svelte-eb8bdm.svelte-eb8bdm{transform:translate(0, 0)}.PanoSpatialTagPlugin__tag-upside-down.svelte-eb8bdm .PanoSpatialTagPlugin__tag-line.svelte-eb8bdm{transform:scaleY(-1)}.PanoSpatialTagPlugin__tag-animate.svelte-eb8bdm.svelte-eb8bdm{position:relative;height:100%;overflow:hidden;transform-origin:left top;transition:transform .5s linear}.PanoSpatialTagPlugin__tag-upside-down.svelte-eb8bdm .PanoSpatialTagPlugin__tag-animate.svelte-eb8bdm{transform-origin:left bottom}.PanoSpatialTagPlugin__tag-content.svelte-eb8bdm.svelte-eb8bdm{position:absolute;display:inline-block;transform:translate(-100%, 0);transition:transform .9s cubic-bezier(0,.65,.16,1.08) .6s;padding-left:.5rem;font-size:1rem}.PanoSpatialTagPlugin__tag-upside-down.svelte-eb8bdm .PanoSpatialTagPlugin__tag-content.svelte-eb8bdm{bottom:0}.PanoSpatialTagPlugin__tag-show.svelte-eb8bdm .PanoSpatialTagPlugin__tag-flagpole.svelte-eb8bdm{opacity:1;transform:translate(-50%, 0) scaleY(1)}.PanoSpatialTagPlugin__tag-upside-down.svelte-eb8bdm .PanoSpatialTagPlugin__tag-shadow.svelte-eb8bdm{top:unset;bottom:-15rem}.PanoSpatialTagPlugin__tag-show.svelte-eb8bdm .PanoSpatialTagPlugin__tag-shadow.svelte-eb8bdm{opacity:.32}.PanoSpatialTagPlugin__tag-show.svelte-eb8bdm .PanoSpatialTagPlugin__tag-content.svelte-eb8bdm{transform:translate(0, 0)}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-flagpole.svelte-eb8bdm{opacity:0;transform:translate(-50%, 60%) scaleY(0);transition:transform .5s .55s, opacity .4s .55s}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-shadow.svelte-eb8bdm{opacity:0;transition:opacity .8s}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-content.svelte-eb8bdm{transform:translate(-100%, 0);transition:transform .6s cubic-bezier(.53,.06,.88,.59)}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-content .svelte-eb8bdm{pointer-events:none}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-line1.svelte-eb8bdm{opacity:0.5;transform:translate(-50%, 10%) scaleY(0);-webkit-animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1-hide linear .28s forwards .3s;animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1-hide linear .28s forwards .3s}.PanoSpatialTagPlugin__tag-hide.svelte-eb8bdm .PanoSpatialTagPlugin__tag-line2.svelte-eb8bdm{opacity:0.5;transform:translate(-50%, 0) scaleY(0);-webkit-animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2-hide linear .28s forwards .45s;animation:svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2-hide linear .28s forwards .45s}@-webkit-keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1{0%{opacity:0;transform:translate(-50%, 250%) scaleY(1)}50%{opacity:0.5;transform:translate(-50%, 135%) scaleY(1)}100%{opacity:0.5;transform:translate(-50%, 20%) scaleY(0)}}@keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1{0%{opacity:0;transform:translate(-50%, 250%) scaleY(1)}50%{opacity:0.5;transform:translate(-50%, 135%) scaleY(1)}100%{opacity:0.5;transform:translate(-50%, 20%) scaleY(0)}}@-webkit-keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2{0%{opacity:0;transform:translate(-50%, 250%) scaleY(1)}50%{opacity:0.5;transform:translate(-50%, 125%) scaleY(1)}100%{opacity:0.5;transform:translate(-50%, 0) scaleY(0)}}@keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2{0%{opacity:0;transform:translate(-50%, 250%) scaleY(1)}50%{opacity:0.5;transform:translate(-50%, 125%) scaleY(1)}100%{opacity:0.5;transform:translate(-50%, 0) scaleY(0)}}@-webkit-keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1-hide{0%{opacity:0.5;transform:translate(-50%, 10%) scaleY(0)}50%{opacity:0.2;transform:translate(-50%, 105%) scaleY(1)}100%{opacity:0;transform:translate(-50%, 200%) scaleY(0)}}@keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line1-hide{0%{opacity:0.5;transform:translate(-50%, 10%) scaleY(0)}50%{opacity:0.2;transform:translate(-50%, 105%) scaleY(1)}100%{opacity:0;transform:translate(-50%, 200%) scaleY(0)}}@-webkit-keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2-hide{0%{opacity:0.5;transform:translate(-50%, 0) scaleY(0)}50%{opacity:0.2;transform:translate(-50%, 100%) scaleY(1)}100%{opacity:0;transform:translate(-50%, 200%) scaleY(0)}}@keyframes svelte-eb8bdm-PanoSpatialTagPlugin__tag-line2-hide{0%{opacity:0.5;transform:translate(-50%, 0) scaleY(0)}50%{opacity:0.2;transform:translate(-50%, 100%) scaleY(1)}100%{opacity:0;transform:translate(-50%, 200%) scaleY(0)}}");
-}
-
-function create_fragment(ctx) {
-	let div4;
-	let div0;
-	let t0;
-	let div1;
-	let i0;
-	let t1;
-	let i1;
-	let t2;
-	let i2;
-	let t3;
-	let div3;
-	let div2;
-	let div4_id_value;
-	let mounted;
-	let dispose;
-
-	return {
-		c() {
-			div4 = internal.element("div");
-			div0 = internal.element("div");
-			t0 = internal.space();
-			div1 = internal.element("div");
-			i0 = internal.element("i");
-			t1 = internal.space();
-			i1 = internal.element("i");
-			t2 = internal.space();
-			i2 = internal.element("i");
-			t3 = internal.space();
-			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) 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");
-			internal.attr(i2, "class", "PanoSpatialTagPlugin__tag-line2 svelte-eb8bdm");
-			internal.attr(div1, "class", "PanoSpatialTagPlugin__tag-line svelte-eb8bdm");
-			internal.attr(div2, "class", "PanoSpatialTagPlugin__tag-content svelte-eb8bdm");
-			internal.attr(div3, "class", "PanoSpatialTagPlugin__tag-animate svelte-eb8bdm");
-			internal.set_style(div3, "transform", "scale(" + /*contentZoom*/ ctx[3] * 3 + ")");
-			internal.attr(div4, "id", div4_id_value = 'PanoSpatialTagPlugin__' + /*id*/ ctx[0]);
-			internal.set_style(div4, "height", 20 * /*lineHeightZoom*/ ctx[5] + "rem");
-			internal.attr(div4, "class", "svelte-eb8bdm");
-			internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-x", true);
-			internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-upside-down", /*upsideDown*/ ctx[1]);
-			internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-show", /*show*/ ctx[10]);
-			internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-hide", /*show*/ ctx[10] === false || /*destroying*/ ctx[6]);
-		},
-		m(target, anchor) {
-			internal.insert(target, div4, anchor);
-			internal.append(div4, div0);
-			internal.append(div4, t0);
-			internal.append(div4, div1);
-			internal.append(div1, i0);
-			internal.append(div1, t1);
-			internal.append(div1, i1);
-			internal.append(div1, t2);
-			internal.append(div1, i2);
-			internal.append(div4, t3);
-			internal.append(div4, div3);
-			internal.append(div3, div2);
-			div2.innerHTML = /*content*/ ctx[2];
-			/*div2_binding*/ ctx[16](div2);
-
-			if (!mounted) {
-				dispose = internal.listen(div2, "click", /*handleClickContent*/ ctx[11]);
-				mounted = true;
-			}
-		},
-		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) scale(" + 1 / /*contentZoom*/ ctx[3] + ")");
-			}
-
-			if (dirty & /*lineWidthZoom*/ 16) {
-				internal.set_style(i0, "width", /*lineWidthZoom*/ ctx[4] + "rem");
-			}
-
-			if (dirty & /*content*/ 4) div2.innerHTML = /*content*/ ctx[2];
-			if (dirty & /*contentZoom*/ 8) {
-				internal.set_style(div3, "transform", "scale(" + /*contentZoom*/ ctx[3] * 3 + ")");
-			}
-
-			if (dirty & /*id*/ 1 && div4_id_value !== (div4_id_value = 'PanoSpatialTagPlugin__' + /*id*/ ctx[0])) {
-				internal.attr(div4, "id", div4_id_value);
-			}
-
-			if (dirty & /*lineHeightZoom*/ 32) {
-				internal.set_style(div4, "height", 20 * /*lineHeightZoom*/ ctx[5] + "rem");
-			}
-
-			if (dirty & /*upsideDown*/ 2) {
-				internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-upside-down", /*upsideDown*/ ctx[1]);
-			}
-
-			if (dirty & /*show*/ 1024) {
-				internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-show", /*show*/ ctx[10]);
-			}
-
-			if (dirty & /*show, destroying*/ 1088) {
-				internal.toggle_class(div4, "PanoSpatialTagPlugin__tag-hide", /*show*/ ctx[10] === false || /*destroying*/ ctx[6]);
-			}
-		},
-		i: internal.noop,
-		o: internal.noop,
-		d(detaching) {
-			if (detaching) internal.detach(div4);
-			/*div2_binding*/ ctx[16](null);
-			mounted = false;
-			dispose();
-		}
-	};
-}
-
-function instance($$self, $$props, $$invalidate) {
-	let { id } = $$props;
-	let { upsideDown } = $$props;
-	let { content } = $$props;
-	let { contentZoom } = $$props;
-	let { lineWidthZoom } = $$props;
-	let { lineHeightZoom } = $$props;
-	let { destroying = false } = $$props;
-	let { folded } = $$props;
-	let { dispose } = $$props;
-	let { events } = $$props;
-	let { hooks } = $$props;
-	let contentWidth = 0;
-	let contentHeight = 0;
-	let contentDom;
-	let show;
-
-	let timeoutId = setTimeout(
-		() => {
-			if (!folded) $$invalidate(10, show = true);
-			timeoutId = undefined;
-		},
-		100
-	);
-
-	const handleClickContent = event => {
-		const eventsName = Object.keys(events);
-		let node = event.target;
-
-		while (node) {
-			const classNames = node.getAttribute('class');
-
-			if (!classNames) {
-				node = node.parentNode;
-				continue;
-			}
-
-			if (classNames.includes('PanoSpatialTagPlugin__tag-content')) {
-				node = null;
-				break;
-			}
-
-			eventsName.forEach(key => {
-				if (classNames.includes(key)) events[key](id);
-			});
-
-			node = node.parentNode;
-		}
-	};
-
-	svelte.onMount(() => {
-		hooks.emit('initTag', { id });
-	});
-
-	const unsubscribe = currentTarget.subscribe(str => {
-		if (str === null) return;
-		const [currentId, date] = str.split('-PanoSpatialTagPlugin-');
-
-		if (id === currentId) {
-			hooks.emit('clickOrigin', { id, show });
-
-			if (!timeoutId) {
-				$$invalidate(10, show = folded);
-				$$invalidate(12, folded = !folded);
-
-				timeoutId = setTimeout(
-					() => {
-						timeoutId = undefined;
-					},
-					1500
-				);
-			}
-		}
-	});
-
-	svelte.afterUpdate(() => {
-		$$invalidate(7, contentWidth = contentDom.offsetWidth);
-		$$invalidate(8, contentHeight = contentDom.offsetHeight);
-		if (timeoutId) return;
-		$$invalidate(10, show = !folded);
-	});
-
-	svelte.onDestroy(() => {
-		hooks.emit('destroyTag', { id });
-		unsubscribe();
-		dispose();
-	});
-
-	function div2_binding($$value) {
-		internal.binding_callbacks[$$value ? 'unshift' : 'push'](() => {
-			contentDom = $$value;
-			$$invalidate(9, contentDom);
-		});
-	}
-
-	$$self.$$set = $$props => {
-		if ('id' in $$props) $$invalidate(0, id = $$props.id);
-		if ('upsideDown' in $$props) $$invalidate(1, upsideDown = $$props.upsideDown);
-		if ('content' in $$props) $$invalidate(2, content = $$props.content);
-		if ('contentZoom' in $$props) $$invalidate(3, contentZoom = $$props.contentZoom);
-		if ('lineWidthZoom' in $$props) $$invalidate(4, lineWidthZoom = $$props.lineWidthZoom);
-		if ('lineHeightZoom' in $$props) $$invalidate(5, lineHeightZoom = $$props.lineHeightZoom);
-		if ('destroying' in $$props) $$invalidate(6, destroying = $$props.destroying);
-		if ('folded' in $$props) $$invalidate(12, folded = $$props.folded);
-		if ('dispose' in $$props) $$invalidate(13, dispose = $$props.dispose);
-		if ('events' in $$props) $$invalidate(14, events = $$props.events);
-		if ('hooks' in $$props) $$invalidate(15, hooks = $$props.hooks);
-	};
-
-	return [
-		id,
-		upsideDown,
-		content,
-		contentZoom,
-		lineWidthZoom,
-		lineHeightZoom,
-		destroying,
-		contentWidth,
-		contentHeight,
-		contentDom,
-		show,
-		handleClickContent,
-		folded,
-		dispose,
-		events,
-		hooks,
-		div2_binding
-	];
-}
-
-class Tag extends internal.SvelteComponent {
-	constructor(options) {
-		super();
-
-		internal.init(
-			this,
-			options,
-			instance,
-			create_fragment,
-			internal.safe_not_equal,
-			{
-				id: 0,
-				upsideDown: 1,
-				content: 2,
-				contentZoom: 3,
-				lineWidthZoom: 4,
-				lineHeightZoom: 5,
-				destroying: 6,
-				folded: 12,
-				dispose: 13,
-				events: 14,
-				hooks: 15
-			},
-			add_css
-		);
-	}
-}
-
-const pluginStyle = {
-    position: 'absolute',
-    top: '0px',
-    left: '0px',
-    width: '100%',
-    height: '100%',
-    pointerEvents: 'none',
-};
-
-const DEFAULT_OPEN_DELIMITER = '<';
-const DEFAULT_CLOSE_DELIMITER = '>';
-const DEFAULT_DELIMITER = '%';
-const DEFAULT_LOCALS_NAME = 'locals';
-const REGEX_STRING = '(<%%|%%>|<%=|<%-|<%_|<%#|<%|%>|-%>|_%>)';
-const ENCODE_HTML_RULES = {
-    '&': '&amp',
-    '<': '&lt',
-    '>': '&gt',
-    '"': '&#34',
-    "'": '&#39'
-};
-const TEMPLATE_MODES = {
-    EVAL: 'eval',
-    ESCAPED: 'escaped',
-    RAW: 'raw',
-    COMMENT: 'comment',
-    LITERAL: 'literal',
-};
-function stripSemi(str) {
-    return str.replace(/;(\s*$)/, '$1');
-}
-function render(template, data) {
-    const templ = new Template(template);
-    return templ.compileFunction()(data);
-}
-class Template {
-    constructor(text) {
-        Object.defineProperty(this, "templateText", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: void 0
-        });
-        Object.defineProperty(this, "mode", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: null
-        });
-        Object.defineProperty(this, "truncate", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: false
-        });
-        Object.defineProperty(this, "currentLine", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: 1
-        });
-        Object.defineProperty(this, "source", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: ''
-        });
-        Object.defineProperty(this, "regex", {
-            enumerable: true,
-            configurable: true,
-            writable: true,
-            value: new RegExp(REGEX_STRING)
-        });
-        this.templateText = text;
-    }
-    compileFunction() {
-        let src;
-        const prepended = '  var __output = "";\n' +
-            '  function __append(s) { if (s !== undefined && s !== null) __output += s }\n' +
-            '  with (' + DEFAULT_LOCALS_NAME + ' || {}) {' + '\n';
-        const appended = '  }' + '\n  return __output;' + '\n';
-        const escapeFn = function (markup) {
-            return markup == undefined
-                ? ''
-                : String(markup)
-                    .replace(/[&<>'"]/g, function (c) {
-                    return ENCODE_HTML_RULES[c] || c;
-                });
-        };
-        this._generateSource();
-        this.source = prepended + this.source + appended;
-        src = this.source;
-        src = 'escapeFn = escapeFn || ' + escapeFn.toString() + ';' + '\n' + src;
-        return new Function(DEFAULT_LOCALS_NAME + ', escapeFn', src);
-    }
-    _generateSource() {
-        this.templateText =
-            this.templateText.replace(/[ \t]*<%_/gm, '<%_').replace(/_%>[ \t]*/gm, '_%>');
-        const matches = this._parseTemplateText();
-        const d = DEFAULT_DELIMITER;
-        const o = DEFAULT_OPEN_DELIMITER;
-        const c = DEFAULT_CLOSE_DELIMITER;
-        if (matches && matches.length) {
-            matches.forEach((line, index) => {
-                let closing;
-                if (line.indexOf(o + d) === 0
-                    && line.indexOf(o + d + d) !== 0) {
-                    closing = matches[index + 2];
-                    if (!(closing == d + c || closing == '-' + d + c || closing == '_' + d + c)) {
-                        throw new Error('Could not find matching close tag for "' + line + '".');
-                    }
-                }
-                this._scanLine(line);
-            });
-        }
-    }
-    _parseTemplateText() {
-        let str = this.templateText;
-        const pat = this.regex;
-        let result = pat.exec(str);
-        const arr = [];
-        let firstPos;
-        while (result) {
-            firstPos = result.index;
-            if (firstPos !== 0) {
-                arr.push(str.substring(0, firstPos));
-                str = str.slice(firstPos);
-            }
-            arr.push(result[0]);
-            str = str.slice(result[0].length);
-            result = pat.exec(str);
-        }
-        if (str) {
-            arr.push(str);
-        }
-        return arr;
-    }
-    _addOutput(line) {
-        if (this.truncate) {
-            line = line.replace(/^(?:\r\n|\r|\n)/, '');
-            this.truncate = false;
-        }
-        if (!line)
-            return line;
-        line = line.replace(/\\/g, '\\\\');
-        line = line.replace(/\n/g, '\\n');
-        line = line.replace(/\r/g, '\\r');
-        line = line.replace(/"/g, '\\"');
-        this.source += '    ; __append("' + line + '")' + '\n';
-    }
-    _scanLine(line) {
-        const d = DEFAULT_DELIMITER;
-        const o = DEFAULT_OPEN_DELIMITER;
-        const c = DEFAULT_CLOSE_DELIMITER;
-        line.split('\n').length - 1;
-        switch (line) {
-            case o + d:
-            case o + d + '_':
-                this.mode = TEMPLATE_MODES.EVAL;
-                break;
-            case o + d + '=':
-                this.mode = TEMPLATE_MODES.ESCAPED;
-                break;
-            case o + d + '-':
-                this.mode = TEMPLATE_MODES.RAW;
-                break;
-            case o + d + '#':
-                this.mode = TEMPLATE_MODES.COMMENT;
-                break;
-            case o + d + d:
-                this.mode = TEMPLATE_MODES.LITERAL;
-                this.source += '    ; __append("' + line.replace(o + d + d, o + d) + '")' + '\n';
-                break;
-            case d + d + c:
-                this.mode = TEMPLATE_MODES.LITERAL;
-                this.source += '    ; __append("' + line.replace(d + d + c, d + c) + '")' + '\n';
-                break;
-            case d + c:
-            case '-' + d + c:
-            case '_' + d + c:
-                if (this.mode == TEMPLATE_MODES.LITERAL) {
-                    this._addOutput(line);
-                }
-                this.mode = null;
-                this.truncate = line.indexOf('-') === 0 || line.indexOf('_') === 0;
-                break;
-            default:
-                if (this.mode) {
-                    switch (this.mode) {
-                        case TEMPLATE_MODES.EVAL:
-                        case TEMPLATE_MODES.ESCAPED:
-                        case TEMPLATE_MODES.RAW:
-                            if (line.lastIndexOf('//') > line.lastIndexOf('\n')) {
-                                line += '\n';
-                            }
-                    }
-                    switch (this.mode) {
-                        case TEMPLATE_MODES.EVAL:
-                            this.source += '    ; ' + line + '\n';
-                            break;
-                        case TEMPLATE_MODES.ESCAPED:
-                            this.source += '    ; __append(escapeFn(' + stripSemi(line) + '))' + '\n';
-                            break;
-                        case TEMPLATE_MODES.RAW:
-                            this.source += '    ; __append(' + stripSemi(line) + ')' + '\n';
-                            break;
-                        case TEMPLATE_MODES.COMMENT:
-                            break;
-                        case TEMPLATE_MODES.LITERAL:
-                            this._addOutput(line);
-                            break;
-                    }
-                }
-                else {
-                    this._addOutput(line);
-                }
-        }
-    }
-}
-
-const MESH_SIZE = 0.001;
-const RAY_TOLERANT_DISTANCE = 0.01;
-const BLUR_IMAGE_URL = 'https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png';
-/**
- * 空间游走标签插件
- */
-const PanoSpatialTagPlugin = (five$1, params) => {
-    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');
-    container.classList.add('PanoSpatialTagPlugin');
-    Object.assign(container.style, pluginStyle);
-    const hooks = new five.Subscribe();
-    let blurImage = new Image();
-    blurImage.src = BLUR_IMAGE_URL;
-    const state = {
-        points: [],
-        origins: [],
-        tags: [],
-        template: '',
-        events: {},
-        render,
-        folded: false,
-        enabled: true,
-        forbidden: true,
-    };
-    const origins = new Origins({
-        target: container,
-        props: { origins: state.origins },
-    });
-    const onCameraUpdate = (pose, userAction) => {
-        updateOrigins();
-        if (userAction) {
-            updateTags();
-            // state.tags.forEach(tag => {
-            //   const mouse = tag.position.clone().project(five.camera)
-            //   const top = ( - mouse.y + 1 ) / 2 * 100
-            // })
-        }
-    };
-    const onPanoArrived = () => {
-        if (state.forbidden) {
-            state.forbidden = false;
-            updateTags();
-        }
-    };
-    const onPanoWillArrive = (pano, pose) => {
-        if (state.tags.length === 0)
-            return;
-        const rotateRad = pose.longitude - five$1.state.longitude;
-        const camera = five$1.camera.clone();
-        camera.position.copy(pose.offset);
-        camera.rotateOnWorldAxis(new THREE__namespace.Vector3(0, 1, 0), rotateRad);
-        camera.updateProjectionMatrix();
-        camera.updateMatrixWorld(true);
-        const frustum = new THREE__namespace.Frustum();
-        const projScreenMatrix = new THREE__namespace.Matrix4();
-        projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
-        frustum.setFromProjectionMatrix(projScreenMatrix);
-        state.tags.forEach(tag => {
-            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;
-            const v = tag.position.clone().sub(camera.position).setY(0);
-            if (v.angleTo(tag.normal) > Math.PI / 2 - minRad &&
-                v.angleTo(tag.normal) < Math.PI / 2 + minRad)
-                return tag.destroying = true;
-        });
-        state.tags.forEach(tag => {
-            if (tag.destroying) {
-                tag.app.$set({
-                    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) / maxDistance),
-                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - minDistance) / maxDistance * 0.6,
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
-                });
-            }
-        });
-        setTimeout(() => {
-            state.tags.forEach(tag => {
-                if (tag.destroying) {
-                    tag.app.$destroy();
-                    tag = null;
-                }
-            });
-            state.tags = state.tags.filter(tag => !tag.destroying);
-            updateOrigins();
-        }, 1900);
-    };
-    const onModeChange = (mode) => {
-        if (mode !== five.Five.Mode.Panorama && !state.forbidden) {
-            origins.$set({ origins: [] });
-            state.tags.forEach(tag => {
-                tag.app.$destroy();
-                tag = null;
-            });
-            state.origins = [];
-            state.tags = [];
-            state.forbidden = true;
-        }
-    };
-    const updateOrigins = () => {
-        if (state.forbidden || !state.enabled)
-            return;
-        const camera = five$1.camera;
-        const direction = camera.getWorldDirection(new THREE__namespace.Vector3());
-        state.origins = state.tags.map(tag => {
-            const mouse = tag.position.clone().project(camera);
-            const front = tag.position.clone().sub(camera.position).setY(0)
-                .angleTo(direction.setY(0)) < Math.PI / 2;
-            return {
-                id: tag.id,
-                front,
-                left: (mouse.x + 1) / 2 * 100,
-                top: (-mouse.y + 1) / 2 * 100,
-                destroying: tag.destroying,
-            };
-        });
-        origins.$set({ origins: state.origins });
-    };
-    const updateTags = () => {
-        if (state.forbidden || !state.enabled)
-            return;
-        if (state.timeoutId)
-            clearTimeout(state.timeoutId);
-        state.timeoutId = setTimeout(() => {
-            state.timeoutId = undefined;
-            const newTags = getNewTags();
-            if (newTags.length) {
-                state.tags = state.tags.concat(newTags);
-                updateOrigins();
-            }
-        }, wait);
-    };
-    const getNewTags = () => {
-        const { clientWidth, clientHeight } = five$1.getElement();
-        const newTags = [];
-        const camera = five$1.camera;
-        const frustum = new THREE__namespace.Frustum();
-        const projScreenMatrix = new THREE__namespace.Matrix4();
-        const direction = camera.getWorldDirection(new THREE__namespace.Vector3());
-        projScreenMatrix.multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse);
-        frustum.setFromProjectionMatrix(projScreenMatrix);
-        const frontTagLength = state.tags.filter(tag => frustum.containsPoint(tag.position) && !tag.destroying).length;
-        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(centerY).distanceTo(point.position);
-            if (distance < minDistance || distance > maxDistance)
-                return result;
-            if (!frustum.containsPoint(point.position))
-                return result;
-            const v = point.position.clone().sub(camera.position).setY(0);
-            if (v.angleTo(point.normal) > Math.PI / 2 - minRad &&
-                v.angleTo(point.normal) < Math.PI / 2 + minRad)
-                return result;
-            const mouse = point.position.clone().project(camera);
-            if (!state.tags.every(tag => {
-                if (tag.position.clone().sub(camera.position).setY(0)
-                    .angleTo(direction.setY(0)) > Math.PI / 2)
-                    return true;
-                const _mouse = tag.position.clone().project(camera);
-                return Math.sqrt(Math.pow((mouse.x - _mouse.x) / 2 * clientWidth, 2) +
-                    Math.pow((mouse.y - _mouse.y) / 2 * clientHeight, 2)) > nearTolerance;
-            }))
-                return result;
-            const newPoint = {
-                id: point.id,
-                position: point.position,
-                normal: point.normal,
-                replacement: point.replacement,
-                weight: point.weight,
-                distance,
-            };
-            let index;
-            for (let i = 0, l = result.length; i < l; i++) {
-                const anotherPoint = result[i];
-                if (newPoint.weight > anotherPoint.weight) {
-                    index = i;
-                    break;
-                }
-                if (newPoint.distance < anotherPoint.distance) {
-                    index = i;
-                    break;
-                }
-            }
-            if (index !== undefined)
-                result.splice(index, 0, newPoint);
-            else
-                result.push(newPoint);
-            return result;
-        }, []);
-        for (let i = 0, l = points.length; i < l; i++) {
-            if (frontTagLength + newTags.length >= maxNumberOnScreen)
-                break;
-            const point = points[i];
-            if (newTags.find(tag => point.id === tag.id))
-                continue;
-            const mouse = point.position.clone().project(camera);
-            if (!state.tags.concat(newTags).every(tag => {
-                if (tag.position.clone().sub(camera.position).setY(0)
-                    .angleTo(direction.setY(0)) > Math.PI / 2)
-                    return true;
-                const _mouse = tag.position.clone().project(camera);
-                return Math.sqrt(Math.pow((mouse.x - _mouse.x) / 2 * clientWidth, 2) +
-                    Math.pow((mouse.y - _mouse.y) / 2 * clientHeight, 2)) > nearTolerance;
-            }))
-                continue;
-            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) {
-                const { position, normal, id, replacement } = point;
-                const plane = new THREE__namespace.Plane().setFromNormalAndCoplanarPoint(normal, position);
-                const right = position.clone().sub(camera.position)
-                    .cross(new THREE__namespace.Vector3(0, 1, 0)).setLength(MESH_SIZE);
-                const square = [
-                    position.clone(),
-                    position.clone().add(right),
-                    position.clone().add(new THREE__namespace.Vector3(0, MESH_SIZE, 0)).add(right),
-                    position.clone().add(new THREE__namespace.Vector3(0, MESH_SIZE, 0)),
-                ].map(v => plane.projectPoint(v, new THREE__namespace.Vector3()));
-                const { container, dispose } = css3DRender.create3DDomContainer(square) || {};
-                const app = new Tag({
-                    target: container,
-                    props: {
-                        id,
-                        content: state.render(state.template, replacement),
-                        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,
-                        hooks,
-                        dispose,
-                    },
-                });
-                newTags.push({
-                    position,
-                    normal,
-                    id,
-                    app,
-                });
-            }
-        }
-        return newTags;
-    };
-    /** 标签数据加载
-     * @param data.points {Array} 标签数据
-     * @param data.enabled {Boolean} 插件是否启用
-     * @param data.folded {Boolean} 标签是否默认展开
-     */
-    const load = (data) => {
-        state.points = data.points.map(point => {
-            var _a, _b;
-            return {
-                id: point.id,
-                position: new THREE__namespace.Vector3().fromArray(point.position),
-                normal: new THREE__namespace.Vector3().fromArray(point.normal),
-                replacement: (_a = point.replacement) !== null && _a !== void 0 ? _a : {},
-                weight: (_b = point.weight) !== null && _b !== void 0 ? _b : -1,
-            };
-        });
-        if (data.render)
-            state.render = data.render;
-        if (data.template)
-            state.template = data.template;
-        if (data.events)
-            state.events = data.events;
-        if (data.enabled === false)
-            state.enabled = data.enabled;
-        if (data.folded === true)
-            state.folded = data.folded;
-    };
-    /** 设置射线碰撞检测objects
-     *
-     */
-    const setIntersectObjects = (objects) => {
-        state.intersectObjects = objects;
-        updateTags();
-    };
-    /** 标签启用
-     * 启用插件并重新计算展示标签
-     */
-    const enable = () => {
-        state.enabled = true;
-        updateTags();
-    };
-    /** 插件禁用
-     * 1. 禁用同时会清除已展示的标签
-     * 2. 再次启用时会重新计算展示标签
-     */
-    const disable = () => {
-        state.enabled = false;
-        origins.$set({ origins: [] });
-        state.tags.forEach(tag => {
-            tag.app.$destroy();
-            tag = null;
-        });
-        state.origins = [];
-        state.tags = [];
-    };
-    /** 展开所有标签
-     * 1. 展开所有收起的标签
-     * 2. 新标签会默认展开
-     */
-    const unfoldAll = () => {
-        state.folded = false;
-        state.tags.forEach(tag => {
-            tag.app.$set({ folded: state.folded });
-        });
-    };
-    /** 收起所有标签
-     * 1. 收起所有展开的标签
-     * 2. 新标签会默认收起
-     */
-    const foldAll = () => {
-        state.folded = true;
-        state.tags.forEach(tag => {
-            tag.app.$set({ folded: state.folded });
-        });
-    };
-    /** 展开单个标签
-     * @param id {Number | String} 标签ID
-     */
-    const unfold = (id) => {
-        state.tags.forEach(tag => {
-            if (tag.id === id)
-                tag.app.$set({ folded: false });
-        });
-    };
-    /** 收起单个标签
-     * @param id {Number | String} 标签ID
-     */
-    const fold = (id) => {
-        state.tags.forEach(tag => {
-            if (tag.id === id)
-                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();
-        origins.$destroy();
-        state.tags.forEach(tag => {
-            tag.app.$destroy();
-            tag = null;
-        });
-        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);
-    };
-    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,
-        fold,
-        enable,
-        disable,
-        hooks,
-        dispose,
-    };
-};
-
-exports.PanoSpatialTagPlugin = PanoSpatialTagPlugin;
-exports["default"] = PanoSpatialTagPlugin;