@aibee/owlly 1.0.26 → 1.0.29

package/lib/owlly/controller/panorama-controller.js

@@ -0,0 +1,1943 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import TWEEN from '@tweenjs/tween.js';
+import { Externals } from '../stage/externals';
+import { OrbitControls } from '../../external/orbit-controls';
+import { Controller } from './controller';
+import { PanoramaGroup } from '../element/panorama-group';
+import { Events } from '../utils/events';
+import { FloorModel } from '../element/floor-model';
+import { CubeTextureCache } from '../utils/cube-texture-cache';
+import { TextureCache } from '../utils/texture-cache';
+// import { OwllyEvents } from '../utils/events';
+const ROTATION_LOCK_BOUNDARY = 3 / 180 * Math.PI;
+/**
+ * 在升级至瓦片后, 停止使用该控制器
+ */
+class PanoramaController extends Controller {
+    /**
+     *
+     * @param view 绑定的View
+     * @param panoramaGroups 全景图组数组，至少需要有一个元素
+     * @param showModel 可选，是否一开始就显示模型
+     * @example
+     * ``` typescript
+     * panoCtl = new PanoramaController(view, panoMgr);
+     * panoCtl.setMouseClickEnabled(true);
+     * stage.bindController(panoCtl);
+     * panoCtl.lookFromPanorama(0, new Vector3(-1, 0, 0));
+     */
+    constructor(view, panoramaGroups, showModel) {
+        super();
+        const { THREE } = Externals.getInstance();
+        this.hidePanoramas = false;
+        this.showModel = showModel === undefined || showModel;
+        this.panoramaGroupChanged = true;
+        this.touches = {
+            s: [new THREE.Vector2(), new THREE.Vector2()],
+            c: [new THREE.Vector2(), new THREE.Vector2()],
+            state: 'idle',
+            dist: 0,
+            fov: 60,
+        };
+        this.touchStartHandler = (event) => {
+            // event.preventDefault();
+            const l = event.touches.length;
+            const tl = event.targetTouches.length;
+            for (let i = 0; i < Math.min(l, 2); i++) {
+                const t = event.touches[i];
+                this.touches.s[i] = new THREE.Vector2(t.clientX, t.clientY);
+            }
+            this.touches.state = 'down';
+            if (tl > 1 && this.view.camera instanceof THREE.PerspectiveCamera) {
+                this.touches.state = 'zoom';
+                this.touches.dist = this.touches.s[0].distanceTo(this.touches.s[1]);
+                this.touches.fov = this.view.camera.fov;
+            }
+        };
+        this.touchMoveHandler = (event) => {
+            if (!this.view.camera || !(this.view.camera instanceof THREE.PerspectiveCamera))
+                return;
+            if (this.touches.state === 'idle')
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            const l = event.touches.length;
+            for (let i = 0; i < Math.min(l, 2); i++) {
+                const t = event.touches[i];
+                this.touches.c[i] = new THREE.Vector2(t.clientX, t.clientY);
+            }
+            if (this.touches.state === 'down' && this.touches.c[0].distanceToSquared(this.touches.s[0]) > 100) {
+                this.touches.state = 'move';
+            }
+            else if (this.touches.state === 'zoom') {
+                const distDiff = this.touches.c[0].distanceTo(this.touches.c[1]) - this.touches.dist;
+                const { innerWidth, innerHeight } = window;
+                const diagnalDist = Math.sqrt((Math.pow(innerWidth, 2)) + (Math.pow(innerHeight, 2)));
+                const distRatio = distDiff / diagnalDist;
+                this.view.camera.fov = Math.min(Math.max(this.touches.fov - distRatio * 90, this.fovRange.min), this.fovRange.max);
+                this.view.camera.updateProjectionMatrix();
+                this.orbitControl.rotateSpeed = -this.view.camera.fov / 360 * this.rotateSpeed;
+                this.renderThisFrame();
+            }
+        };
+        this.touchEndHandler = (event) => __awaiter(this, void 0, void 0, function* () {
+            if (this.touches.state === 'idle')
+                return;
+            if (this.touches.state === 'down' && this.view.renderer) {
+                const touchPoint = new THREE.Vector2(this.touches.s[0].x, this.touches.s[0].y);
+                const { clientWidth, clientHeight } = this.view.container;
+                const { left: rectX, top: rectY } = this.view.container.getBoundingClientRect();
+                const x = touchPoint.x - rectX;
+                const y = touchPoint.y - rectY;
+                this.raycaster.setFromCamera({ x, y }, this.view.camera);
+                if (this.currentPanoramaGroup) {
+                    let toPID;
+                    if (this.onScreenDetectRadius > 0 && this.view.camera) {
+                        toPID = this.currentPanoramaGroup.intersectIndicatorsOnScreen(new THREE.Vector2(x, y), this.onScreenDetectRadius, { screenWidth: clientWidth, screenHeight: clientHeight }, this.view.camera);
+                    }
+                    else {
+                        toPID = this.currentPanoramaGroup.intersectIndicators(this.raycaster.ray.origin, this.raycaster.ray.direction);
+                    }
+                    if (toPID !== -1) {
+                        this.emit(Events.CLICK_PANORAMA, toPID, event);
+                        // this.moveToPanorama(toPID, { interval: 2000, toDirection: new Vector3(-0.8, 0.6, 0.0) });
+                        if (this.moveOnClick && this.currentPanoramaGroup.currentPanoramaID !== toPID) {
+                            yield this.moveToPanorama(toPID, { interval: 1000, showModel: true, fadeInOut: false });
+                        }
+                    }
+                }
+            }
+            this.touches.state = 'idle';
+        });
+        this.mouseDownHandler = (event) => {
+            if (event.pointerType !== 'mouse')
+                return;
+            // this.mouseMovement = new Vector2(event.movementX, event.movementY).length();
+            this.touches.s[0] = new THREE.Vector2(event.clientX, event.clientY);
+            this.touches.state = 'down';
+        };
+        this.mouseMoveHandler = (event) => {
+            if (event.pointerType !== 'mouse')
+                return;
+            // this.mouseMovement += new Vector2(event.movementX, event.movementY).length();
+            this.touches.c[0] = new THREE.Vector2(event.clientX, event.clientY);
+            if (this.touches.state === 'down' && this.touches.c[0].distanceToSquared(this.touches.s[0]) > 100) {
+                this.touches.state = 'move';
+            }
+            if (this.raycaster && this.captureMove) {
+                const { clientWidth, clientHeight } = this.view.container;
+                const { left: rectX, top: rectY } = this.view.container.getBoundingClientRect();
+                const x = event.clientX - rectX;
+                const y = event.clientY - rectY;
+                this.raycaster.setFromCamera({ x, y }, this.view.camera);
+                if (this.currentPanoramaGroup) {
+                    let toPID;
+                    if (this.onScreenDetectRadius > 0 && this.view.camera) {
+                        toPID = this.currentPanoramaGroup.intersectIndicatorsOnScreen(new THREE.Vector2(x, y), this.onScreenDetectRadius, { screenWidth: clientWidth, screenHeight: clientHeight }, this.view.camera);
+                    }
+                    else {
+                        toPID = this.currentPanoramaGroup.intersectIndicators(this.raycaster.ray.origin, this.raycaster.ray.direction);
+                    }
+                    if (toPID > -1) {
+                        this.emit(Events.PANORAMA_HOVER, toPID, this.currentPanoramaGroup.getIndicatorPosition(toPID));
+                    }
+                }
+            }
+        };
+        this.mouseUpHandler = (event) => __awaiter(this, void 0, void 0, function* () {
+            // console.info('## mouseup : ', event);
+            // if (this.touches.state === 'idle') return;
+            if (event.pointerType !== 'mouse')
+                return;
+            if (this.touches.state === 'down') {
+                const { clientWidth, clientHeight } = this.view.container;
+                const { left: rectX, top: rectY } = this.view.container.getBoundingClientRect();
+                const x = event.clientX - rectX;
+                const y = event.clientY - rectY;
+                if (this.raycaster) {
+                    this.raycaster.setFromCamera({ x, y }, this.view.camera);
+                    if (this.onScreenDetectRadius && this.currentPanoramaGroup) {
+                        let toPID;
+                        if (this.view.camera) {
+                            toPID = this.currentPanoramaGroup.intersectIndicatorsOnScreen(new THREE.Vector2(x, y), this.onScreenDetectRadius, { screenWidth: clientWidth, screenHeight: clientHeight }, this.view.camera);
+                        }
+                        else {
+                            toPID = this.currentPanoramaGroup.intersectIndicators(this.raycaster.ray.origin, this.raycaster.ray.direction);
+                        }
+                        if (toPID !== -1) {
+                            this.emit(Events.CLICK_PANORAMA, toPID, event);
+                            // this.moveToPanorama(toPID, { interval: 2000, toDirection: new Vector3(-0.8, 0.6, 0.0) });
+                            if (event.button === 0 && this.moveOnClick && this.currentPanoramaGroup.currentPanoramaID !== toPID) {
+                                yield this.moveToPanorama(toPID, { interval: 1000, showModel: true, fadeInOut: false });
+                            }
+                        }
+                    }
+                }
+            }
+            this.touches.state = 'idle';
+        });
+        this.mouseWheelHandler = (event) => {
+            event.preventDefault();
+            if (!(this.view.camera instanceof THREE.PerspectiveCamera))
+                return;
+            this.view.camera.fov = Math.min(Math.max(this.view.camera.fov - Math.sign(event.deltaY) * 1.5, this.fovRange.min), this.fovRange.max);
+            this.view.camera.updateProjectionMatrix();
+            this.orbitControl.rotateSpeed = -this.view.camera.fov / 360 * this.rotateSpeed;
+            this.renderThisFrame();
+        };
+        this.moveOnClick = true;
+        this.onScreenDetectRadius = 1000;
+        this.rotateSpeed = 1;
+        if (view) {
+            this.bindView(view);
+            this.renderThisFrame();
+        }
+        if (panoramaGroups) {
+            if (panoramaGroups instanceof PanoramaGroup) {
+                this.panoramaGroups = [panoramaGroups];
+            }
+            else {
+                this.panoramaGroups = panoramaGroups;
+            }
+        }
+        else {
+            this.panoramaGroups = [];
+        }
+        if (this.panoramaGroups.length > 0) {
+            [this.currentPanoramaGroup] = this.panoramaGroups;
+        }
+        this.pid2GroupMap = new Map();
+        const modelVisible = (undefined === showModel || showModel === true || this.showModel);
+        this.panoramaGroups.forEach((panoGroup) => {
+            const modelMesh = PanoramaController.getModelMesh(panoGroup);
+            this.setModelAppearance(panoGroup.modelElement, modelVisible, undefined, modelMesh);
+        });
+        // this.mouseMovement = 0;
+        this.isAnimating = false;
+        this.rotationLocks = {
+            lockAzimuth: false,
+            lockPolar: false,
+            centralAzimuth: 0,
+            centralPolar: Math.PI / 2,
+            azimuthRange: Math.PI,
+            polarRange: Math.PI / 2,
+        };
+        this.fovRange = { min: 60, max: 90 };
+        this.raycaster = new THREE.Raycaster();
+    }
+    /**
+     * 获得模型顶点着色器
+     * @ignore
+     * @returns {string} 顶点着色器代码
+     */
+    static getModelVS() {
+        const vertexShader = `
+      uniform vec3 pano0Position;
+      uniform mat4 pano0Matrix;
+      uniform vec3 pano1Position;
+      uniform mat4 pano1Matrix;
+
+      varying vec3 vWorldPosition0;
+      varying vec3 vWorldPosition1;
+
+      void main() {
+
+      vec4 worldPosition = modelMatrix * vec4(position, 1.0);
+
+      vec3 positionLocalToPanoCenter0 = worldPosition.xyz - pano0Position;
+      vWorldPosition0 = (vec4(positionLocalToPanoCenter0, 1.0) * pano0Matrix).xyz;
+      vWorldPosition0.y *= -1.0;
+
+      vec3 positionLocalToPanoCenter1 = worldPosition.xyz - pano1Position;
+      vWorldPosition1 = (vec4(positionLocalToPanoCenter1, 1.0) * pano1Matrix).xyz;
+      vWorldPosition1.y *= -1.0;
+
+      gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+      }`;
+        return vertexShader;
+    }
+    static getInstantTranslationVS() {
+        // L == lookAt = Inv(R) * Inv(T)
+        // L1 * p1 = L0 * p0  =>  p0 = Inv(L0) * L1 * p1
+        // Let T = Inv(L0) * L1
+        const vertexShader = `
+      uniform mat4 matrixT;
+
+      uniform vec3 pano0Position;
+      uniform mat4 pano0Matrix;
+      uniform vec3 pano1Position;
+      uniform mat4 pano1Matrix;
+
+      varying vec3 vWorldPosition0;
+      varying vec3 vWorldPosition1;
+
+      void main() {
+
+      vec4 worldPosition = modelMatrix * vec4(position, 1.0);
+      vec4 worldPosition0 = matrixT * worldPosition;
+
+      vec3 positionLocalToPanoCenter1 = worldPosition.xyz - pano1Position;
+      vWorldPosition1 = (vec4(positionLocalToPanoCenter1, 1.0) * pano1Matrix).xyz;
+      vWorldPosition1.y *= -1.0;
+
+      vec3 positionLocalToPanoCenter0 = worldPosition0.xyz - pano0Position;
+      vWorldPosition0 = (vec4(positionLocalToPanoCenter0, 1.0) * pano0Matrix).xyz;
+      vWorldPosition0.y *= -1.0;
+
+      gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+      }`;
+        return vertexShader;
+    }
+    /**
+     * 获得模型片源着色器
+     * @ignore
+     * @returns {string} 片源着色器代码
+     */
+    static getModelFS() {
+        const fragmentShader = `
+      uniform float weight0;
+      uniform float weight1;
+
+      uniform samplerCube pano0Map;
+
+      uniform samplerCube pano1Map;
+
+      varying vec3 vWorldPosition0;
+      varying vec3 vWorldPosition1;
+
+      void main() {
+      vec3 cp0 = vWorldPosition0.xyz;
+      vec3 cp1 = vWorldPosition1.xyz;
+      vec4 colorFromPano0 = textureCube( pano0Map, cp0);
+      vec4 colorFromPano1 = textureCube( pano1Map, cp1);
+
+      vec4 colorFromPanos;
+      // 'colorFromPanos = mix(colorFromPano0, colorFromPano1, progress);
+      colorFromPanos = colorFromPano0 * weight0 + colorFromPano1 * weight1;
+      gl_FragColor = vec4(colorFromPanos.rgb, 1.0);
+      }`;
+        return fragmentShader;
+    }
+    static debugModelVS() {
+        const vertexShader = `
+      uniform vec2 xRange;
+      uniform vec2 yRange;
+      uniform vec2 zRange;
+      varying vec4 vColor;
+
+      void main() {
+      vColor = vec4((position.x - xRange.x) / xRange.y, (position.y - yRange.x) / yRange.y, (position.z - zRange.x) / zRange.y, 1.0);
+      gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+      }`;
+        return vertexShader;
+    }
+    static debugModelFS() {
+        const fragmentShader = `
+      varying vec4 vColor;
+
+      void main() {
+      gl_FragColor = vColor;
+      }`;
+        return fragmentShader;
+    }
+    dispose() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.modelMaterial) {
+                this.modelMaterial.dispose();
+            }
+            if (this.instantTranslationMaterial) {
+                this.instantTranslationMaterial.dispose();
+            }
+            this.setTouchEnabled(false);
+            this.setMouseClickEnabled(false);
+            TextureCache.disposeAll();
+            CubeTextureCache.disposeAll();
+            if (this.translatePromise) {
+                yield this.translatePromise;
+            }
+        });
+    }
+    setViewConfiguration(hidePanoramas, showModel) {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.hidePanoramas = hidePanoramas;
+            this.showModel = showModel;
+            if (this.currentPanoramaGroup) {
+                const pano = yield this.currentPanoramaGroup.getPanoramaByPID(this.currentPanoramaGroup.currentPanoramaID);
+                if (pano) {
+                    pano.addViewConfiguration({
+                        targetView: this.view,
+                        showSkyBox: !hidePanoramas,
+                    });
+                }
+                this.setModelAppearance(this.currentPanoramaGroup.modelElement, showModel);
+            }
+        });
+    }
+    bindElement(element) {
+        if (element instanceof Array) {
+            element.forEach((e) => { this.bindElement(e); });
+        }
+        else {
+            if (!this.elements) {
+                this.elements = new Set();
+            }
+            this.elements.add(element);
+            // if (element.intersectables && element.intersectables.length) {
+            //   element.intersectables.forEach((object) => {
+            //     this.intersectables.push({ object, parent: element });
+            //   });
+            // } else {
+            //   element.children.filter((c) => (c as Mesh).isMesh).forEach((object) => {
+            //     this.intersectables.push({ object, parent: element });
+            //   });
+            // }
+        }
+    }
+    unbindElement(element) {
+        if (element instanceof Array) {
+            element.forEach((e) => { this.unbindElement(e); });
+        }
+        else if (this.elements && this.elements.has(element)) {
+            this.elements.delete(element);
+        }
+    }
+    /**
+     * 添加全景图组
+     * @param panoramaGroups 新增加的全景图组（单个或数组）
+     * @parama showModel 可选，是否一开始就显示模型
+     */
+    addPanoramaGroups(panoramaGroups, showModel) {
+        let groupArray;
+        if (panoramaGroups instanceof PanoramaGroup) {
+            groupArray = [panoramaGroups];
+        }
+        else {
+            groupArray = panoramaGroups;
+        }
+        this.panoramaGroups.push(...groupArray);
+        const modelVisible = (undefined === showModel || showModel === true || this.showModel);
+        groupArray.forEach((panoGroup) => {
+            const modelMesh = PanoramaController.getModelMesh(panoGroup);
+            this.setModelAppearance(panoGroup.modelElement, modelVisible, undefined, modelMesh);
+        });
+    }
+    removePanoramaGroup(panoramaGroup) {
+        const index = this.panoramaGroups.indexOf(panoramaGroup);
+        if (index >= 0) {
+            this.panoramaGroups = this.panoramaGroups.slice(0, index).concat(this.panoramaGroups.slice(index + 1));
+            if (panoramaGroup === this.currentPanoramaGroup) {
+                this.currentPanoramaGroup = undefined;
+            }
+            return true;
+        }
+        return false;
+    }
+    renderThisFrame() {
+        if (!this.renderFrame) {
+            this.renderFrame = true;
+        }
+    }
+    static getModelMeshInElement(e) {
+        let ret;
+        const { THREE } = Externals.getInstance();
+        if (e instanceof THREE.Mesh)
+            return e;
+        if (e) {
+            e.traverse((obj) => {
+                if (obj instanceof THREE.Mesh) {
+                    ret = obj;
+                }
+            });
+        }
+        return ret;
+    }
+    static getModelMesh(panoGroup) {
+        if (panoGroup && panoGroup.modelElement) { // TODO: Multiple children mesh?
+            return PanoramaController.getModelMeshInElement(panoGroup.modelElement);
+        }
+        return undefined;
+    }
+    bindView(view) {
+        if (!view.camera || !view.renderer) {
+            throw new Error('No Camera or Renderer found in view');
+        }
+        this.view = view;
+        const { THREE } = Externals.getInstance();
+        this.setTouchEnabled(true);
+        this.orbitControl = new OrbitControls(view.camera, view.container);
+        this.orbitControl.addEventListener('start', () => {
+            this.renderThisFrame();
+        });
+        this.orbitControl.addEventListener('end', () => {
+            this.renderThisFrame();
+        });
+        this.orbitControl.addEventListener('change', () => {
+            this.emit(Events.PANORAMA_CAMERA_CHANGED, view.camera.position, view.camera.quaternion, this);
+            const { lockAzimuth, lockPolar } = this.rotationLocks;
+            let vFov = 0;
+            let hFov = 0;
+            if (this.orbitControl.object instanceof THREE.PerspectiveCamera) {
+                const { clientWidth, clientHeight } = this.view.container;
+                vFov = this.orbitControl.object.fov / 180 * Math.PI;
+                hFov = vFov * clientWidth / clientHeight;
+            }
+            if (lockAzimuth) {
+                const { centralAzimuth, azimuthRange } = this.rotationLocks;
+                const azimuth = this.orbitControl.getAzimuthalAngle();
+                let minAzimuth = centralAzimuth - azimuthRange / 2 + hFov / 2;
+                let maxAzimuth = centralAzimuth + azimuthRange / 2 - hFov / 2;
+                if (minAzimuth > Math.PI)
+                    minAzimuth -= 2 * Math.PI;
+                if (maxAzimuth < -Math.PI)
+                    maxAzimuth += 2 * Math.PI;
+                if (minAzimuth > maxAzimuth) {
+                    this.orbitControl.minAzimuthAngle = centralAzimuth;
+                    this.orbitControl.maxAzimuthAngle = centralAzimuth;
+                }
+                else {
+                    if (minAzimuth < -Math.PI)
+                        minAzimuth += 2 * Math.PI;
+                    if (maxAzimuth > Math.PI)
+                        maxAzimuth -= 2 * Math.PI;
+                    if (minAzimuth > maxAzimuth) {
+                        if (Math.abs(azimuth) > Math.PI - ROTATION_LOCK_BOUNDARY) {
+                            this.orbitControl.minAzimuthAngle = -Infinity;
+                            this.orbitControl.maxAzimuthAngle = Infinity;
+                        }
+                        else if (azimuth > 0) {
+                            this.orbitControl.minAzimuthAngle = minAzimuth;
+                            this.orbitControl.maxAzimuthAngle = Infinity;
+                        }
+                        else if (azimuth < 0) {
+                            this.orbitControl.minAzimuthAngle = -Infinity;
+                            this.orbitControl.maxAzimuthAngle = maxAzimuth;
+                        }
+                    }
+                    else {
+                        this.orbitControl.minAzimuthAngle = minAzimuth;
+                        this.orbitControl.maxAzimuthAngle = maxAzimuth;
+                    }
+                }
+            }
+            if (lockPolar) {
+                const { centralPolar, polarRange } = this.rotationLocks;
+                const polar = this.orbitControl.getPolarAngle();
+                let minPolar = centralPolar - polarRange / 2 + vFov / 2;
+                let maxPolar = centralPolar + polarRange / 2 - vFov / 2;
+                if (minPolar > Math.PI)
+                    minPolar -= Math.PI;
+                if (maxPolar < 0)
+                    maxPolar += Math.PI;
+                if (minPolar > maxPolar) {
+                    this.orbitControl.minPolarAngle = centralPolar;
+                    this.orbitControl.maxPolarAngle = centralPolar;
+                }
+                else {
+                    if (minPolar < 0)
+                        minPolar += Math.PI;
+                    if (maxPolar > Math.PI)
+                        maxPolar -= Math.PI;
+                    if (minPolar > maxPolar) {
+                        if (Math.abs(polar - Math.PI / 2) > Math.PI / 2 - ROTATION_LOCK_BOUNDARY) {
+                            this.orbitControl.minPolarAngle = -Infinity;
+                            this.orbitControl.maxPolarAngle = Infinity;
+                        }
+                        else if (polar > 0) {
+                            this.orbitControl.minPolarAngle = minPolar;
+                            this.orbitControl.maxPolarAngle = Infinity;
+                        }
+                        else if (polar < 0) {
+                            this.orbitControl.minPolarAngle = -Infinity;
+                            this.orbitControl.maxPolarAngle = maxPolar;
+                        }
+                    }
+                    else {
+                        this.orbitControl.minPolarAngle = minPolar;
+                        this.orbitControl.maxPolarAngle = maxPolar;
+                    }
+                }
+            }
+            this.renderThisFrame();
+        });
+        this.orbitControl.rotateSpeed = PanoramaController.RotateSpeed;
+        if (view.camera && view.camera instanceof THREE.PerspectiveCamera) {
+            const { fov } = view.camera;
+            this.orbitControl.rotateSpeed = -fov / 360 * this.rotateSpeed;
+        }
+        this.setMouseControls({ LEFT: THREE.MOUSE.ROTATE, MIDDLE: THREE.MOUSE.DOLLY, RIGHT: THREE.MOUSE.PAN });
+        this.setTouchControls({ ONE: THREE.TOUCH.ROTATE, TWO: THREE.TOUCH.PAN });
+        this.setDampingEnabled(true);
+        this.setDampingFactor(0.25);
+        this.setKeysEnabled(false);
+        this.setRotateEnabled(true);
+        this.setPanEnabled(false);
+        this.setZoomEnabled(false);
+        this.orbitControl.update();
+        this.setEnabled(true);
+        this.renderThisFrame();
+    }
+    unbind() {
+        const _super = Object.create(null, {
+            unbind: { get: () => super.unbind }
+        });
+        return __awaiter(this, void 0, void 0, function* () {
+            _super.unbind.call(this);
+            if (this.orbitControl)
+                this.orbitControl.dispose();
+            yield this.dispose();
+        });
+    }
+    /**
+     * @ignore
+     */
+    update() {
+        if (this.orbitControl && this.orbitControl.enabled)
+            this.orbitControl.update();
+        let result = true;
+        if (!this.renderFrame)
+            result = false;
+        this.renderFrame = false;
+        return result;
+    }
+    /**
+     * 设置是否启用该控制器
+     * @param value 开关值
+     */
+    setEnabled(value) {
+        if (this.orbitControl)
+            this.orbitControl.enabled = value;
+    }
+    /**
+     * 设置键盘控制启用
+     * @param value 是否启用键盘控制
+     */
+    setKeysEnabled(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.enableKeys = value;
+    }
+    /**
+     * 使能/禁用 鼠标点击
+     * @param value 使能还是禁用
+     */
+    setMouseClickEnabled(enable) {
+        if (!this.view.renderer)
+            return false;
+        const { THREE } = Externals.getInstance();
+        if (this.view.camera && this.view.camera instanceof THREE.Camera) {
+            if (enable) {
+                this.view.container.addEventListener('pointerup', this.mouseUpHandler, false);
+                this.view.container.addEventListener('pointermove', this.mouseMoveHandler, false);
+                this.view.container.addEventListener('pointerdown', this.mouseDownHandler, false);
+                this.view.container.addEventListener('wheel', this.mouseWheelHandler, false);
+            }
+            else {
+                this.view.container.removeEventListener('pointerup', this.mouseUpHandler, false);
+                this.view.container.removeEventListener('pointermove', this.mouseMoveHandler, false);
+                this.view.container.removeEventListener('pointerdown', this.mouseDownHandler, false);
+                this.view.container.removeEventListener('wheel', this.mouseWheelHandler, false);
+            }
+        }
+        return true;
+    }
+    setTouchEnabled(enable) {
+        if (!this.view.renderer)
+            return false;
+        const { THREE } = Externals.getInstance();
+        if (this.view.camera && this.view.camera instanceof THREE.Camera) {
+            if (enable) {
+                this.view.container.addEventListener('touchstart', this.touchStartHandler, false);
+                this.view.container.addEventListener('touchmove', this.touchMoveHandler, false);
+                this.view.container.addEventListener('touchend', this.touchEndHandler, false);
+                this.view.container.addEventListener('touchcancel', this.touchEndHandler, false);
+            }
+            else {
+                this.view.container.removeEventListener('touchstart', this.touchStartHandler);
+                this.view.container.removeEventListener('touchmove', this.touchMoveHandler);
+                this.view.container.removeEventListener('touchend', this.touchEndHandler);
+                this.view.container.removeEventListener('touchcancel', this.touchEndHandler);
+            }
+        }
+        return true;
+    }
+    /**
+     * 设置是否启用惯性
+     * @param value 开关值
+     */
+    setDampingEnabled(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.enableDamping = value;
+    }
+    /**
+     * 设置是否启用旋转功能
+     * @param value 开关值
+     */
+    setRotateEnabled(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.enableRotate = value;
+    }
+    /**
+     * 设置是否启用平移功能
+     * @param value 开关值
+     */
+    setPanEnabled(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.enablePan = value;
+    }
+    /**
+     * 设置是否启用缩放功能
+     * @param value 开关值
+     */
+    setZoomEnabled(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.enableZoom = value;
+    }
+    /**
+     * 设置缩放
+     * @param zoom 缩放比例值
+     */
+    setZoom(zoom) {
+        if (!this.orbitControl)
+            return;
+        const { THREE } = Externals.getInstance();
+        if (!(this.view.camera instanceof THREE.PerspectiveCamera)
+            && !(this.view.camera instanceof THREE.OrthographicCamera))
+            throw new Error('Cannot set zoom for camera');
+        this.view.camera.zoom = zoom;
+        this.view.camera.updateProjectionMatrix();
+        this.renderFrame = true;
+    }
+    /**
+     * 设置FOV, 不可以超过setFOVRange所设置的范围.
+     * @param fov 垂直方向视场角
+     */
+    setFOV(fov) {
+        const { THREE } = Externals.getInstance();
+        if (!this.orbitControl || !(this.view.camera instanceof THREE.PerspectiveCamera))
+            return;
+        const targetFov = Math.min(Math.max(fov, this.fovRange.min), this.fovRange.max);
+        this.view.camera.fov = targetFov;
+        this.view.camera.updateProjectionMatrix();
+        this.orbitControl.rotateSpeed = -targetFov / 360 * this.rotateSpeed;
+        this.renderFrame = true;
+    }
+    /**
+     * 设置FOV范围, 默认为[60, 90]
+     * @param min 垂直方向视场角最小值
+     * @param max 垂直方向视场角最大值
+     */
+    setFOVRange(min, max) {
+        this.fovRange.min = min;
+        this.fovRange.max = max;
+        const { THREE } = Externals.getInstance();
+        if (!this.orbitControl || !(this.view.camera instanceof THREE.PerspectiveCamera))
+            return;
+        this.setFOV(this.view.camera.fov);
+    }
+    /**
+     * 设置惯性阻尼
+     * @param value 衰减值
+     */
+    setDampingFactor(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.dampingFactor = value;
+    }
+    /**
+     * 设置位移速度
+     * @param value 位移速度
+     */
+    setPanSpeed(value) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.panSpeed = value;
+    }
+    /**
+     * 设置旋转速度
+     * @param value 旋转速度
+     */
+    // public setRotateSpeed(value: number): void {
+    //   if (!this.orbitControl) return;
+    //   this.orbitControl.rotateSpeed = value;
+    // }
+    /**
+     * 设置触摸操作模式
+     * @param touches 触摸配置
+     */
+    setTouchControls(touches) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.touches = touches;
+    }
+    /**
+     * 设置鼠标操作模式
+     * @param mouseButtons 鼠标按键配置
+     */
+    setMouseControls(mouseButtons) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.mouseButtons = mouseButtons;
+    }
+    /**
+     * 设置控制中心点
+     * @param x 世界坐标X
+     * @param y 世界坐标Y
+     * @param z 世界坐标Z
+     */
+    setTarget(x, y, z) {
+        if (!this.orbitControl)
+            return;
+        this.orbitControl.target.set(x, y, z);
+        this.orbitControl.update();
+    }
+    /**
+     * 设置摄像机观察方向和位置
+     * @param position 摄像机所在位置
+     * @param lookAt 观察目标点，同时也是[[OrbitControls]]的旋转中心
+     */
+    setCameraPose(position, lookAt, useLookAt = true) {
+        if (this.view.camera) {
+            this.view.camera.position.set(...position);
+            // this.view.camera.lookAt(...lookAt);
+        }
+        if (useLookAt)
+            this.setTarget(...lookAt);
+        // console.log(lookAt);
+        this.renderThisFrame();
+    }
+    getPanoramaOfPID(pid) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const panoGroup = this.pid2GroupMap.get(pid);
+            if (panoGroup) {
+                const pano = yield panoGroup.getPanoramaByPID(pid);
+                return { pano, panoramaGroup: panoGroup };
+            }
+            for (let i = 0; i < this.panoramaGroups.length; i += 1) {
+                const panoramaGroup = this.panoramaGroups[i];
+                // eslint-disable-next-line no-await-in-loop
+                const pano = yield panoramaGroup.getPanoramaByPID(pid);
+                if (pano) {
+                    this.pid2GroupMap.set(pid, panoramaGroup);
+                    return { pano, panoramaGroup };
+                }
+            }
+            return {};
+        });
+    }
+    preloadCubeTexturesOfPIDs(pids, waitForReadyCount, recycleIntermediateTextures) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const panos = yield Promise.all(pids.map((pid) => this.getPanoramaOfPID(pid)));
+            const textureURLsArray = panos.map(({ pano }) => {
+                if (pano) {
+                    return pano.textureURLs;
+                }
+                return undefined;
+            });
+            return CubeTextureCache.sharedInstance.preloadCubeTextures(textureURLsArray, waitForReadyCount, recycleIntermediateTextures);
+        });
+    }
+    /**
+     * 设置摄像机按指定视线方向看向目标位置
+     * @param target 目标位置
+     * @param sightDirection 可选，视线方向，不设置则默认以摄像机当前方向
+     */
+    setCameraLookAt(target, sightDirection) {
+        const { x, y, z } = target;
+        const { THREE } = Externals.getInstance();
+        let direction;
+        if (sightDirection) {
+            direction = sightDirection.clone().normalize();
+        }
+        else if (this.view.camera) {
+            direction = this.view.camera.getWorldDirection(new THREE.Vector3(0, 0, -1));
+        }
+        else {
+            direction = new THREE.Vector3(1, 0, 0);
+        }
+        const p0 = direction
+            .multiplyScalar(PanoramaController.DirectionVectorScalar)
+            .add(target);
+        this.setCameraPose([p0.x, p0.y, p0.z], [x, y, z]);
+    }
+    /**
+     * 仅显示指定全景图，但不操作摄像机
+     * @param pid 全景点PID
+     * @parama showModel 可选，是否一开始就显示模型
+     * @param preInitPanoramasStrategy 可选，预创建全景对象的顺序策略，详见[PanoramaGroup]的【initializePanoramasIfNecessary]方法说明
+     */
+    showPanorama(pid, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { lookDirection, target, showModel, preInitPanoramasStrategy, } = options || {};
+            const { pano, panoramaGroup } = yield this.getPanoramaOfPID(pid);
+            if (panoramaGroup) {
+                if (this.currentPanoramaGroup !== panoramaGroup)
+                    this.panoramaGroupChanged = true;
+                this.currentPanoramaGroup = panoramaGroup;
+                if (panoramaGroup.modelElement) {
+                    this.setModelAppearance(panoramaGroup.modelElement, false, undefined);
+                }
+                if (preInitPanoramasStrategy) {
+                    panoramaGroup.initializePanoramasIfNecessary(preInitPanoramasStrategy);
+                }
+                panoramaGroup.panoramaIDsAround(pid);
+                // const allPanos = await panoramaGroup.allPanoramas();
+                // // console.info(`#Async# showPanorama : allPanos(${allPanos!.length})=`, allPanos);
+                // allPanos.forEach((panorama: Panorama) => {
+                //   panorama.addViewConfiguration({
+                //     targetView: this.view,
+                //     showBorder: false,
+                //     showSkyBox: false,
+                //   });
+                // });
+                // if (aroundPIDs) {
+                //   const panoramas = await Promise.all(aroundPIDs.map((panoID: number) => panoramaGroup.getPanoramaByPID(panoID)));
+                //   console.info('#Async# showPanorama : panoramas=', panoramas);
+                //   panoramas.forEach((panorama: Panorama) => {
+                //     panorama.addViewConfiguration({
+                //       targetView: this.view,
+                //       showBorder: false,
+                //       showSkyBox: false,
+                //     });
+                //   });
+                // }
+                panoramaGroup.presentPanoramaIndicatorsAround(pid, this.view);
+                if (pano) {
+                    if (lookDirection) {
+                        this.setCameraLookAt(pano.position, lookDirection);
+                    }
+                    else if (target) {
+                        this.setCameraLookAt(pano.position, target.clone().sub(pano.position));
+                    }
+                    if (!pano.legacyMode) {
+                        const tiles = pano.getIntersectedTiles(this.view.camera);
+                        yield panoramaGroup.presentPanoramaAround(pid, tiles.hdTiles, tiles.ldTiles, this.view);
+                    }
+                    else {
+                        yield panoramaGroup.presentPanoramaAround(pid, [], [], this.view);
+                    }
+                    pano.addViewConfiguration({
+                        targetView: this.view,
+                        showBorder: false,
+                        showSkyBox: !this.hidePanoramas,
+                    });
+                    if (undefined === showModel || showModel === true) {
+                        const material = this.getModelMaterial();
+                        const uniforms = material.uniforms;
+                        uniforms.pano0Matrix.value = pano.matrix;
+                        uniforms.pano0Position.value = pano.position;
+                        uniforms.pano1Matrix.value = pano.matrix;
+                        uniforms.pano1Position.value = pano.position;
+                        uniforms.weight0.value = 1.0;
+                        uniforms.weight1.value = 0.0;
+                        const textures = yield CubeTextureCache.sharedInstance.preloadCubeTextures([pano.textureURLs], 1);
+                        [uniforms.pano0Map.value, uniforms.pano1Map.value] = [textures[0], textures[0]];
+                        this.setModelAppearance(panoramaGroup.modelElement, true, material);
+                    }
+                }
+                return pano;
+            }
+            return undefined;
+        });
+    }
+    /**
+     * 从指定全景图中心以指定视线方向观看
+     * @param pid 全景图PID
+     * @param lookDirection 视线方向
+     * @parama showModel 可选，是否一开始就显示模型
+     * @param preInitPanoramasStrategy 可选，预创建全景对象的顺序策略，详见[PanoramaGroup]的【initializePanoramasIfNecessary]方法说明
+     */
+    lookFromPanorama(pid, lookDirection, showModel, preInitPanoramasStrategy) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const pano = yield this.showPanorama(pid, { lookDirection, showModel, preInitPanoramasStrategy });
+            this.emit(Events.MOVE_TO_PANORAMA, pid, pano ? pano.position : null, this.panoramaGroupChanged);
+            this.panoramaGroupChanged = false;
+        });
+    }
+    /**
+     * 从指定全景图中心看向指定位置
+     * @param pid 全景图PID
+     * @param target 目标位置
+     * @parama showModel 可选，是否一开始就显示模型
+     * @param preInitPanoramasStrategy 可选，预创建全景对象的顺序策略，详见[PanoramaGroup]的【initializePanoramasIfNecessary]方法说明
+     */
+    lookFromPanoramaTo(pid, target, showModel, preInitPanoramasStrategy) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const pano = yield this.showPanorama(pid, { target, showModel, preInitPanoramasStrategy });
+            this.emit(Events.MOVE_TO_PANORAMA, pid, pano ? pano.position : null, this.panoramaGroupChanged);
+            this.panoramaGroupChanged = false;
+        });
+    }
+    static createModelUniforms() {
+        const { THREE } = Externals.getInstance();
+        const modelUniforms = {
+            weight0: {
+                type: 'f',
+                value: 0,
+            },
+            weight1: {
+                type: 'f',
+                value: 0,
+            },
+            // 源全景图立方体贴图
+            pano0Map: {
+                type: 't',
+                value: null,
+            },
+            // 源全景图位置
+            pano0Position: {
+                type: 'v3',
+                value: new THREE.Vector3(),
+            },
+            // 源全景图世界变换矩阵
+            pano0Matrix: {
+                type: 'm4',
+                value: new THREE.Matrix4(),
+            },
+            // 目标全景图立方体贴图
+            pano1Map: {
+                type: 't',
+                value: null,
+            },
+            // 目标全景图位置
+            pano1Position: {
+                type: 'v3',
+                value: new THREE.Vector3(),
+            },
+            // 目标全景图世界变换矩阵
+            pano1Matrix: {
+                type: 'm4',
+                value: new THREE.Matrix4(),
+            },
+        };
+        return modelUniforms;
+    }
+    static createInstantTranslationUniforms() {
+        const { THREE } = Externals.getInstance();
+        const modelUniforms = {
+            weight0: {
+                type: 'f',
+                value: 0,
+            },
+            weight1: {
+                type: 'f',
+                value: 0,
+            },
+            // 源全景图立方体贴图
+            pano0Map: {
+                type: 't',
+                value: null,
+            },
+            pano0Position: {
+                type: 'v3',
+                value: new THREE.Vector3(),
+            },
+            // 源全景图世界变换矩阵
+            pano0Matrix: {
+                type: 'm4',
+                value: new THREE.Matrix4(),
+            },
+            // 目标全景图立方体贴图
+            pano1Map: {
+                type: 't',
+                value: null,
+            },
+            // 目标全景图位置
+            pano1Position: {
+                type: 'v3',
+                value: new THREE.Vector3(),
+            },
+            // 目标全景图世界变换矩阵
+            pano1Matrix: {
+                type: 'm4',
+                value: new THREE.Matrix4(),
+            },
+            matrixT: {
+                type: 'm4',
+                value: new THREE.Matrix4(),
+            },
+        };
+        return modelUniforms;
+    }
+    getModelMaterial() {
+        if (this.modelMaterial) {
+            return this.modelMaterial;
+        }
+        const { THREE } = Externals.getInstance();
+        const uniforms = PanoramaController.createModelUniforms();
+        this.modelMaterial = new THREE.ShaderMaterial({
+            side: THREE.DoubleSide,
+            vertexShader: PanoramaController.getModelVS(),
+            fragmentShader: PanoramaController.getModelFS(),
+            uniforms,
+            name: 'modelMaterial',
+        });
+        return this.modelMaterial;
+    }
+    getInstantTranslationMaterial() {
+        if (this.instantTranslationMaterial) {
+            return this.instantTranslationMaterial;
+        }
+        const { THREE } = Externals.getInstance();
+        const uniforms = PanoramaController.createInstantTranslationUniforms();
+        this.instantTranslationMaterial = new THREE.ShaderMaterial({
+            side: THREE.DoubleSide,
+            vertexShader: PanoramaController.getInstantTranslationVS(),
+            fragmentShader: PanoramaController.getModelFS(),
+            uniforms,
+            name: 'instantTranslationMaterial',
+        });
+        return this.instantTranslationMaterial;
+    }
+    /**
+     * @ignore
+     * @param visible
+     */
+    setModelAppearance(modelElement, visible, meshMaterial, modelMesh) {
+        if (modelElement) {
+            if (modelElement instanceof FloorModel) {
+                modelElement.addViewConfiguration({
+                    targetView: this.view,
+                    visible,
+                    meshMaterial,
+                });
+            }
+            else {
+                modelElement.visible = visible;
+                let mesh = modelMesh;
+                if (!mesh) {
+                    mesh = PanoramaController.getModelMeshInElement(modelElement);
+                }
+                if (mesh && meshMaterial) {
+                    mesh.material = meshMaterial;
+                }
+            }
+        }
+    }
+    /**
+     * 配置controller是否开启点击移动
+     * @param value 是否开启点击移动
+     */
+    setMoveOnClickEnabled(value) {
+        this.moveOnClick = value;
+    }
+    /**
+     * 移动到指定的全景点处
+     * @param toPID 目标全景点ID
+     * @param interval 可选，过渡所用时长
+     * @param easing 可选，插值函数
+     * @param fadeInOut 可选，是否使用淡出淡入变换
+     * @param toDirection 可选，到达目的点时要转到的视线方向，
+     *    若不设置则默认以从起始点到目的点的连线为最终视线方向
+     * @param lookAtTarget 可选，到达目的点时视线看向的位置，优先于toDirection
+     * @param fov 可选，视场角度数
+     * @param rotateDelays 可选，旋转时的延迟时间
+     */
+    moveToPanorama(toPID, params) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const p = params || {};
+            return this.moveInPath([toPID], {
+                queueIfBusy: false,
+                lookAtTargets: p.lookAtTarget,
+                toDirections: p.toDirection,
+                intervals: p.interval,
+                fovs: p.fov,
+                fadeInOuts: p.fadeInOut,
+                easings: p.easing,
+                freeRotation: !p.lookAtTarget,
+                showModel: p.showModel,
+                rotateDelays: p.rotateDelays,
+            });
+        });
+    }
+    /**
+     * 移动到指定的全景点处
+     * 此方法与[[moveToPanorama]]的不同点在于通过Promise机制实现同步阻塞，
+     * 在前一个Translation未完成时发起的Translation会自动被阻塞到前一个完成时再执行
+     * @param toPID 目标全景点ID
+     * @param interval 可选，过渡所用时长
+     * @param easing 可选，插值函数
+     * @param fadeInOut 可选，是否使用淡出淡入变换
+     * @param toDirection 可选，到达目的点时要转到的视线方向，
+     *  若不设置则默认以从起始点到目的点的连线为最终视线方向
+     * @param lookAtTarget 可选，到达目的点时视线看向的位置，优先于toDirection
+     * @param fov 可选，视场角度数
+     * @param rotateDelays 可选，旋转时的延迟时间
+     */
+    moveToPanoramaSync(toPID, params) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const p = params || {};
+            return this.moveInPath([toPID], {
+                queueIfBusy: true,
+                lookAtTargets: p.lookAtTarget,
+                toDirections: p.toDirection,
+                intervals: p.interval,
+                fovs: p.fov,
+                fadeInOuts: p.fadeInOut,
+                easings: p.easing,
+                freeRotation: !p.lookAtTarget,
+                showModel: p.showModel,
+                rotateDelays: p.rotateDelays,
+            });
+        });
+    }
+    /**
+     * 摄像机按指定路径运动，并在全景点之间产生渐入渐出效果
+     * @param pathPIDs 目标全景点序列
+     * @param queueIfBusy 可选，指示当当前有动画在进行中时，是把此次动作排队还是直接放弃
+     * @param showModel 可选 是否在移动完成后也保持模型显示（用于遮挡路径）
+     * @param intervals 可选，若为数组则依次是每一段路径所花费的时间间隔，若是一个数则全都用该时间间隔
+     * @param fovs 可选，若为数组则依次是每一段路径结束时的视场角，若是一个数则全都用该视场角
+     * @param toDirections 可选，若为数组则依次是每一段路径结束点的视线方向，若是单一Vector3对象则全用此视线方向
+     * @param lookAtTargets 可选，若为数组则依次是每一段路径所看向的位置，若是单一Vector3对象则始终看向此位置
+     * toDirections与lookAtTargets最多只能有一个，如果同时传入了则只以lookAtTargets为准
+     * @param rotateDelays 可选，旋转时的延迟时间
+     * @param easings 可选，若为数组则依次是每一段路径的动画插值函数，
+     * 若是单一{(k: number): number}对象则全用此插值函数
+     * @example
+     * ``` typescript
+     * panoCtl = new PanoramaController(view, panoMgr, floorModel);
+     * panoCtl.setMouseClickEnabled(true);
+     * stage.bindController(panoCtl);
+     * panoCtl.lookFromPanorama(0, new Vector3(-1, 0, 0));
+     * panoCtl.moveInPath([0, 68, 69, 68, 0], {
+     *    queueIfBusy: true,
+     *    intervals: [200, 1000, 2000, 1000, 3000],
+     *    toDirections: [
+     *      new Vector3(-1, 0, 0),
+     *      new Vector3(-0.8, 0.6, 0),
+     *      new Vector3(-0.6, 0.8, 0),
+     *      new Vector3(0, 0.8, 0),
+     *      new Vector3(0.6, 0, 0),
+     *    ],
+     * });
+     */
+    moveInPath(path, params) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (path.length === 0)
+                return;
+            // const path: number[] = pathPIDs;
+            const pathPositions = [];
+            const inPathPanos = yield Promise.all(path.map((pid) => this.getPanoramaOfPID(pid)));
+            inPathPanos.forEach((item) => {
+                if (item.pano) {
+                    pathPositions.push(item.pano.position.clone());
+                }
+            });
+            const { toDirections, lookAtTargets, intervals, fovs, easings, fadeInOuts, queueIfBusy, showModel, freeRotation, rotateDelays, } = params || {};
+            const modelVisible = (undefined === showModel || showModel === true || this.showModel);
+            let material;
+            let uniforms;
+            let previousMaterial;
+            let fromPID = -1;
+            let toPID;
+            let fadeInOut = false;
+            const preloadTextureCount = CubeTextureCache.sharedInstance.getCapacity();
+            let from;
+            let to;
+            let modelElement;
+            const trivialProgressTransform = (progress) => progress;
+            const fadeInOutProgressTransform = (progress) => {
+                if (progress < 0.25)
+                    return 0;
+                if (progress > 0.75)
+                    return 1;
+                return 2 * (progress - 0.25);
+            };
+            let progressTransforms;
+            if (Array.isArray(fadeInOuts)) {
+                progressTransforms = fadeInOuts.map((b) => (b ? fadeInOutProgressTransform : trivialProgressTransform));
+            }
+            else if (fadeInOuts === true) {
+                progressTransforms = fadeInOutProgressTransform;
+            }
+            yield this.moveCameraInPath(pathPositions, {
+                queueIfBusy,
+                toDirections,
+                lookAtTargets,
+                intervals,
+                fovs,
+                easings,
+                progressTransforms,
+                freeRotation,
+                rotateDelays,
+                beforeAllMoves: () => __awaiter(this, void 0, void 0, function* () {
+                    // console.log('#PanoCtrl# beforeAllMoves');
+                    fromPID = this.currentPanoramaGroup ? this.currentPanoramaGroup.currentPanoramaID : -1;
+                    material = this.getModelMaterial();
+                    uniforms = material.uniforms;
+                    // this.getModelMesh();
+                    // if (this.modelMesh) {
+                    //   previousMaterial = this.modelMesh.material;
+                    //   this.setModelAppearance(true, material);
+                    // }
+                    // this.panoramaGroup.setBoundBoxAppearance(material);
+                    // this.panoramaGroup.addGroupViewConfiguration({
+                    //   targetView: this.view,
+                    //   showBoundBox: true,
+                    // });// /!!! master
+                    if (path.length > 1)
+                        this.emit(Events.PATH_MOVEMENT_START, path);
+                }),
+                onOneMoveStart: (index, target0, eye0, target1, eye1) => __awaiter(this, void 0, void 0, function* () {
+                    // console.log(`#PanoCtrl# onOneMoveStart(${index}`);
+                    // console.log(`#PanoCtrl# Will moveToPanorama from #${fromPID} to #${toPID}`);
+                    toPID = path[index];
+                    from = yield this.getPanoramaOfPID(fromPID);
+                    to = yield this.getPanoramaOfPID(toPID);
+                    const { THREE } = Externals.getInstance();
+                    // console.log(`#PanoCtrl# onOneMoveStart : from(${fromPID})=${from}, to(${toPID})=${to}`);
+                    if (!from.pano || !to.pano || !from.panoramaGroup || !to.panoramaGroup)
+                        return false;
+                    from.modelMesh = PanoramaController.getModelMesh(from.panoramaGroup);
+                    to.modelMesh = PanoramaController.getModelMesh(to.panoramaGroup);
+                    const preloadPIDs = [fromPID];
+                    const preloadPIDsSet = new Set();
+                    preloadPIDsSet.add(fromPID);
+                    for (let i = index; preloadPIDs.length < preloadTextureCount && i < path.length; i += 1) {
+                        if (!preloadPIDsSet.has(path[i])) {
+                            preloadPIDsSet.add(path[i]);
+                            preloadPIDs.push(path[i]);
+                        }
+                    }
+                    yield this.preloadCubeTexturesOfPIDs(preloadPIDs, preloadPIDs.length, preloadPIDs.map((pid) => (pid === fromPID))); // #TiledCube# Keep LD cubeTexture
+                    this.emit(Events.WILL_MOVE_TO_PANORAMA, toPID, to.pano ? to.pano.position : null);
+                    if (fromPID === toPID)
+                        return false;
+                    if (Array.isArray(fadeInOuts)) {
+                        if (fadeInOuts.length > index) {
+                            fadeInOut = fadeInOuts[index];
+                        }
+                        else if (fadeInOuts.length > 0) {
+                            fadeInOut = fadeInOuts[fadeInOuts.length - 1];
+                        }
+                    }
+                    else if (fadeInOuts) {
+                        fadeInOut = fadeInOuts;
+                    }
+                    const translateBetweenGroups = (from.panoramaGroup !== to.panoramaGroup);
+                    if (translateBetweenGroups) {
+                        material = this.getInstantTranslationMaterial();
+                        uniforms = material.uniforms;
+                        // /!!!from.panoramaGroup.dispose(from.pano.pid);
+                        // TODO: Dispose useless PanoramaGroup(s) after all moves,
+                        // and initialize necessary PanoramaGroup(s) before all moves
+                    }
+                    else {
+                        material = this.getModelMaterial();
+                        uniforms = material.uniforms;
+                    }
+                    if (!translateBetweenGroups && !modelVisible) {
+                        const distance = to.pano.position.distanceTo(from.pano.position);
+                        const boxGeometry = new THREE.BoxGeometry(5, (from.pano.position.z + 0.93) * 2, distance * 4);
+                        modelElement = new THREE.Mesh(boxGeometry, material);
+                        modelElement.position.copy(from.pano.position);
+                        modelElement.up.set(0, 0, 1);
+                        modelElement.lookAt(to.pano.position);
+                        to.panoramaGroup.add(modelElement);
+                    }
+                    if (!translateBetweenGroups && !modelVisible) {
+                        const distance = to.pano.position.distanceTo(from.pano.position);
+                        const boxGeometry = new THREE.BoxGeometry(5, (from.pano.position.z + 0.93) * 2, distance * 4);
+                        modelElement = new THREE.Mesh(boxGeometry, material);
+                        modelElement.position.copy(from.pano.position);
+                        modelElement.up.set(0, 0, 1);
+                        modelElement.lookAt(to.pano.position);
+                        to.panoramaGroup.add(modelElement);
+                    }
+                    if (!translateBetweenGroups && !modelVisible) {
+                        const distance = to.pano.position.distanceTo(from.pano.position);
+                        const boxGeometry = new THREE.BoxGeometry(5, (from.pano.position.z + 0.93) * 2, distance * 4);
+                        modelElement = new THREE.Mesh(boxGeometry, material);
+                        modelElement.position.copy(from.pano.position);
+                        modelElement.up.set(0, 0, 1);
+                        modelElement.lookAt(to.pano.position);
+                        to.panoramaGroup.add(modelElement);
+                    }
+                    [to].forEach(({ panoramaGroup, modelMesh }) => {
+                        if (modelMesh && panoramaGroup) {
+                            previousMaterial = modelMesh.material;
+                            if (from.panoramaGroup === to.panoramaGroup) {
+                                this.setModelAppearance(panoramaGroup.modelElement, modelVisible, material, modelMesh);
+                            }
+                            else {
+                                this.setModelAppearance(panoramaGroup.modelElement, false, material, modelMesh);
+                            }
+                            panoramaGroup.setBoundBoxAppearance(material);
+                            panoramaGroup.addGroupViewConfiguration({
+                                targetView: this.view,
+                                showBoundBox: true,
+                            });
+                        }
+                    });
+                    // console.log(`#Async# moveInPath$onOneMoveStart : Hide 'from' pano#${from.pano.pid}`);
+                    from.pano.addViewConfiguration({
+                        targetView: this.view,
+                        showBorder: false,
+                        showSkyBox: false,
+                    });
+                    if (translateBetweenGroups) {
+                        // Inv(L0) * L1
+                        let up = new THREE.Vector3(0, 1, 0);
+                        if (this.view.camera) {
+                            up = this.view.camera.up;
+                        }
+                        const invLookAt0 = new THREE.Matrix4().lookAt(eye0, target0, up);
+                        const invLookAt1 = new THREE.Matrix4().lookAt(eye1, target1, up);
+                        uniforms.matrixT.value = invLookAt0.multiply(invLookAt1.clone().invert());
+                    }
+                    uniforms.pano0Matrix.value = from.pano.matrix;
+                    uniforms.pano0Position.value = from.pano.position;
+                    uniforms.pano1Matrix.value = to.pano.matrix;
+                    uniforms.pano1Position.value = to.pano.position;
+                    uniforms.weight0.value = 1.0;
+                    uniforms.weight1.value = 0.0;
+                    const textures = yield CubeTextureCache.sharedInstance.preloadCubeTextures([from.pano.textureURLs, to.pano.textureURLs], 2, [true, false]);
+                    [uniforms.pano0Map.value, uniforms.pano1Map.value] = textures; // #TiledCube# Keep LD cubeTexture
+                    // console.log(`#PanoCtrl# moveToPanorama#onStart from #${fromPID} to #${toPID}`);
+                    // if (index === path.length - 1) {
+                    //   const nextCamera = new PerspectiveCamera();
+                    //   nextCamera.position.copy(eye1);
+                    //   nextCamera.lookAt(target1);
+                    //   const tiles = to.pano!.getIntersectedTiles(nextCamera);
+                    //   // console.info('#TiledCube# getIntersectedTiles:', tiles.hdTiles, tiles.ldTiles);
+                    //   to.panoramaGroup.presentPanoramaAround(toPID, tiles.hdTiles, tiles.ldTiles, this.view);
+                    //   to.panoramaGroup.presentPanoramaIndicatorsAround(toPID, this.view);
+                    // }
+                    // console.log(`#PanoCtrl# Translate onStart:toPID=${toPID}`);
+                    return translateBetweenGroups;
+                }),
+                onOneMoveUpdate: (index, progress) => {
+                    if (fromPID === toPID)
+                        return;
+                    const translateBetweenGroups = (from.panoramaGroup !== to.panoramaGroup);
+                    if (translateBetweenGroups) {
+                        if (progress < 0.5) {
+                            uniforms.weight0.value = 1.0 - progress * 2;
+                            uniforms.weight1.value = 0.0;
+                        }
+                        else {
+                            uniforms.weight1.value = progress * 2 - 1.0;
+                            uniforms.weight0.value = 0.0;
+                        }
+                    }
+                    else if (fadeInOut) {
+                        if (progress < 0.25) {
+                            uniforms.weight0.value = 1.0 - progress * 4;
+                            uniforms.weight1.value = 0.0;
+                        }
+                        else if (progress > 0.75) {
+                            uniforms.weight1.value = progress * 4 - 3.0;
+                            uniforms.weight0.value = 0.0;
+                        }
+                        else {
+                            uniforms.weight1.value = 0.0;
+                            uniforms.weight0.value = 0.0;
+                        }
+                    }
+                    else {
+                        uniforms.weight0.value = 1.0 - progress;
+                        uniforms.weight1.value = progress;
+                    }
+                },
+                onOneMoveComplete: (index) => __awaiter(this, void 0, void 0, function* () {
+                    // console.log(`#PanoCtrl# onOneMoveComplete : from=${from}, to=${to}`);
+                    // if (index === path.length - 1) {
+                    //   const tiles = to.pano!.getIntersectedTiles(this.view.camera);
+                    //   // console.info('#TiledCube# getIntersectedTiles:', tiles.hdTiles, tiles.ldTiles);
+                    //   await to.panoramaGroup!.presentPanoramaAround(toPID, tiles.hdTiles, tiles.ldTiles, this.view);
+                    //   to.panoramaGroup!.presentPanoramaIndicatorsAround(toPID, this.view);
+                    //   to.pano!.addViewConfiguration({
+                    //     targetView: this.view,
+                    //     showBorder: false,
+                    //     showSkyBox: true,
+                    //   });
+                    // // const allPanos = await to.panoramaGroup!.allPanoramas();
+                    // // console.info('#Async# onOneMoveComplete : Set all panos invisible:', allPanos);
+                    // // allPanos.forEach((panorama: Panorama) => {
+                    // //   panorama.addViewConfiguration({
+                    // //     targetView: this.view,
+                    // //     showBorder: false,
+                    // //     showSkyBox: false,
+                    // //   });
+                    // // });
+                    // }
+                    if (from.modelMesh && from.panoramaGroup && from.panoramaGroup !== to.panoramaGroup) {
+                        if (!modelVisible) {
+                            this.setModelAppearance(from.panoramaGroup.modelElement, false, previousMaterial, from.modelMesh);
+                        }
+                        from.panoramaGroup.addGroupViewConfiguration({
+                            targetView: this.view,
+                            showBoundBox: false,
+                        });
+                    }
+                    to.panoramaGroup.remove(modelElement);
+                    this.emit(Events.MOVE_TO_PANORAMA, toPID, to.pano ? to.pano.position : null, from.panoramaGroup !== to.panoramaGroup);
+                    this.panoramaGroupChanged = false;
+                    if (index < path.length - 1) {
+                        fromPID = path[index];
+                    }
+                }),
+                afterAllMoves: () => __awaiter(this, void 0, void 0, function* () {
+                    const tiles = to.pano.getIntersectedTiles(this.view.camera);
+                    // console.info('#TiledCube# getIntersectedTiles:', tiles.hdTiles, tiles.ldTiles);
+                    yield to.panoramaGroup.presentPanoramaAround(toPID, tiles.hdTiles, tiles.ldTiles, this.view);
+                    // console.log(`#Async# moveInPath$afterAllMoves : Show 'to' pano#${to.pano!.pid}`);
+                    to.pano.addViewConfiguration({
+                        targetView: this.view,
+                        showBorder: false,
+                        showSkyBox: !this.hidePanoramas,
+                    });
+                    to.panoramaGroup.presentPanoramaIndicatorsAround(toPID, this.view);
+                    if (fromPID !== toPID && to && from) {
+                        if (to.modelMesh && to.panoramaGroup) {
+                            if (!modelVisible) {
+                                this.setModelAppearance(to.panoramaGroup.modelElement, false, previousMaterial, to.modelMesh);
+                            }
+                            to.panoramaGroup.addGroupViewConfiguration({
+                                targetView: this.view,
+                                showBoundBox: false,
+                            });
+                        }
+                        if (to.panoramaGroup) {
+                            this.currentPanoramaGroup = to.panoramaGroup;
+                        }
+                    }
+                    if (path.length > 1)
+                        this.emit(Events.PATH_MOVEMENT_COMPLETED, path);
+                }),
+            });
+        });
+    }
+    /**
+     * 摄像机按指定路径运动
+     * @param pathPoints 摄像机运动的路径上每一段目的点的Vector3坐标数组
+     * @param queueIfBusy 可选，指示当当前有动画在进行中时，是把此次动作排队还是直接放弃
+     * @param intervals 可选，若为数组则依次是每一段路径所花费的时间间隔，若是一个数则全都用该时间间隔
+     * @param fovs 可选，若为数组则依次是每一段路径结束时的视场角，若是一个数则全都用该视场角
+     * @param toDirections 可选，若为数组则依次是每一段路径结束点的视线方向，若是单一Vector3对象则全用此视线方向
+     * @param lookAtTargets 可选，若为数组则依次是每一段路径所看向的位置，若是单一Vector3对象则始终看向此位置
+     * toDirections与lookAtTargets最多只能有一个，如果同时传入了则只以lookAtTargets为准
+     * @param easings 可选，若为数组则依次是每一段路径的动画插值函数，
+     * 若是单一{(k: number): number}对象则全用此插值函数
+     * @param rotateDelays 可选，旋转时的延迟时间
+     * @param progressTransforms 可选，转换progress的映射函数，从0~1之间的小数映射到另一个0~1之间的小数
+     * @param beforeAllMoves 整个路径移动即将开始前的回调
+     * @param onOneMoveStart 每段路径移动开始时的回调
+     * @param onOneMoveUpdate 每段路径移动进行中的进度回调
+     * @param onOneMoveComplete 每段路径移动结束时的回调
+     * @param afterAllMoves 整个路径移动结束时的回调
+     * @example
+     * ``` typescript
+     * panoCtl.moveCameraInPath(points, {
+     *  queueIfBusy: false,
+     *  intervals: [200, 1000, 2000, 1000, 3000],
+     *    toDirections: [
+     *      new Vector3(-1, 0, 0),
+     *      new Vector3(-0.8, 0.6, 0),
+     *      new Vector3(-0.6, 0.8, 0),
+     *      new Vector3(0, 0.8, 0),
+     *      new Vector3(0.6, 0, 0),
+     *    ],
+     *  });
+     */
+    moveCameraInPath(pathPoints, params) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!pathPoints || pathPoints.length === 0)
+                return;
+            const { THREE } = Externals.getInstance();
+            const { queueIfBusy = false } = params || {};
+            if (!queueIfBusy) {
+                if (this.isAnimating)
+                    return;
+                this.isAnimating = true;
+            }
+            while (this.translatePromise) {
+                // eslint-disable-next-line no-await-in-loop
+                yield this.translatePromise;
+            }
+            // eslint-disable-next-line no-async-promise-executor
+            const translatePromise = new Promise((resolve0) => __awaiter(this, void 0, void 0, function* () {
+                const { beforeAllMoves, onOneMoveStart, onOneMoveUpdate, onOneMoveComplete, afterAllMoves, } = params || {};
+                let iPath = 0;
+                // eslint-disable-next-line no-async-promise-executor
+                const createTask = () => new Promise((resolve, reject) => __awaiter(this, void 0, void 0, function* () {
+                    if (!this.view.camera || this.cancelAnimation) {
+                        reject();
+                        this.cancelAnimation = false;
+                        return;
+                    }
+                    const { toDirections, lookAtTargets, intervals, fovs, easings, progressTransforms, freeRotation, rotateDelays, } = params || {};
+                    const fromPosition = this.orbitControl.target.clone();
+                    const toPosition = pathPoints[iPath];
+                    const diff = toPosition.clone().sub(fromPosition);
+                    let toDirection = toPosition.clone();
+                    // let directionFrom = toPosition;
+                    if (Array.isArray(lookAtTargets)) {
+                        if (lookAtTargets.length > iPath) {
+                            toDirection = lookAtTargets[iPath].clone();
+                        }
+                        else if (lookAtTargets.length > 0) {
+                            toDirection = lookAtTargets[lookAtTargets.length - 1].clone();
+                        }
+                    }
+                    else if (lookAtTargets instanceof THREE.Vector3) {
+                        toDirection = lookAtTargets.clone();
+                    } // else {
+                    // directionFrom = fromPosition;
+                    // }
+                    let rotateDelay = 0;
+                    if (rotateDelays) {
+                        if (Array.isArray(rotateDelays)) {
+                            if (rotateDelays.length > iPath) {
+                                rotateDelay = rotateDelays[iPath];
+                            }
+                            else if (rotateDelays.length > 0) {
+                                rotateDelay = rotateDelays[rotateDelays.length - 1];
+                            }
+                        }
+                        else {
+                            rotateDelay = rotateDelays || 0;
+                        }
+                    }
+                    if (lookAtTargets || !toDirections) {
+                        if (toDirection.distanceToSquared(toPosition) < 0.000001) {
+                            toDirection = this.orbitControl.target.clone().sub(this.view.camera.position);
+                        }
+                        else {
+                            toDirection.sub(toPosition);
+                        }
+                    }
+                    else if (Array.isArray(toDirections)) {
+                        if (toDirections.length > iPath) {
+                            toDirection = toDirections[iPath];
+                        }
+                        else if (toDirections.length > 0) {
+                            toDirection = toDirections[toDirections.length - 1];
+                        }
+                    }
+                    else if (toDirections instanceof THREE.Vector3) {
+                        toDirection = toDirections;
+                    }
+                    toDirection.normalize();
+                    // toDirection = this.view.camera.up.clone().cross(toDirection.cross(this.view.camera.up));
+                    // toDirection.normalize();
+                    const fromDirection = this.orbitControl.target.clone().sub(this.view.camera.position).normalize();
+                    // const diffQuaternion = new Quaternion().setFromUnitVectors(fromDirection, toDirection);
+                    const quat = new THREE.Quaternion().setFromUnitVectors(this.view.camera.up, new THREE.Vector3(0, 1, 0));
+                    const quatInverse = quat.clone().invert();
+                    fromDirection.applyQuaternion(quat);
+                    toDirection.applyQuaternion(quat);
+                    const fromSpherical = new THREE.Spherical().setFromVector3(fromDirection);
+                    const toSpherical = new THREE.Spherical().setFromVector3(toDirection);
+                    const thetaDiff = fromSpherical.theta - toSpherical.theta;
+                    fromDirection.applyQuaternion(quatInverse);
+                    toDirection.applyQuaternion(quatInverse);
+                    let toFOV = 60;
+                    let fromFOV = 60;
+                    if (this.view.camera instanceof THREE.PerspectiveCamera) {
+                        const camera = this.view.camera;
+                        fromFOV = camera.fov;
+                        toFOV = camera.fov;
+                        if (Array.isArray(fovs)) {
+                            if (fovs.length > iPath) {
+                                toFOV = fovs[iPath];
+                            }
+                            else if (fovs.length > 0) {
+                                toFOV = fovs[fovs.length - 1];
+                            }
+                        }
+                        else if (fovs) {
+                            toFOV = fovs;
+                        }
+                    }
+                    let interval = 1000;
+                    if (Array.isArray(intervals)) {
+                        if (intervals.length > iPath) {
+                            interval = intervals[iPath];
+                        }
+                        else if (intervals.length > 0) {
+                            interval = intervals[intervals.length - 1];
+                        }
+                    }
+                    else if (intervals) {
+                        interval = intervals;
+                    }
+                    let easing = TWEEN.Easing.Linear.None;
+                    if (Array.isArray(easings)) {
+                        if (easings.length > iPath) {
+                            easing = easings[iPath];
+                        }
+                        else if (easings.length > 0) {
+                            easing = easings[easings.length - 1];
+                        }
+                    }
+                    else if (typeof easings === 'function') {
+                        easing = easings;
+                    }
+                    else if (iPath === 0) {
+                        easing = TWEEN.Easing.Quadratic.Out;
+                        if ((iPath === pathPoints.length - 1))
+                            easing = TWEEN.Easing.Quadratic.InOut;
+                    }
+                    else if (iPath === pathPoints.length - 1) {
+                        easing = TWEEN.Easing.Quadratic.In;
+                    }
+                    let progressTransform;
+                    if (Array.isArray(progressTransforms)) {
+                        if (progressTransforms.length > iPath) {
+                            progressTransform = progressTransforms[iPath];
+                        }
+                        else if (progressTransforms.length > 0) {
+                            progressTransform = progressTransforms[progressTransforms.length - 1];
+                        }
+                    }
+                    else if (progressTransforms) {
+                        progressTransform = progressTransforms;
+                    }
+                    const target1 = toPosition;
+                    const eye1 = toDirection.clone()
+                        .multiplyScalar(PanoramaController.DirectionVectorScalar)
+                        .add(target1);
+                    const target0 = fromPosition;
+                    const eye0 = fromDirection.clone()
+                        .multiplyScalar(PanoramaController.DirectionVectorScalar)
+                        .add(target0);
+                    let skipPositionTranslate = false;
+                    if (onOneMoveStart) {
+                        skipPositionTranslate = yield onOneMoveStart(iPath, target0, eye0, target1, eye1);
+                    }
+                    const fromTheta = fromSpherical.theta;
+                    const toTheta = Math.abs(thetaDiff) > Math.PI
+                        ? toSpherical.theta + Math.sign(thetaDiff) * Math.PI * 2 : toSpherical.theta;
+                    const fromPhi = fromSpherical.phi;
+                    const toPhi = toSpherical.phi;
+                    new TWEEN.Tween({ timer: 0 })
+                        .to({
+                        timer: interval,
+                    }, interval)
+                        .easing(easing)
+                        .onStart(() => {
+                        let eye = skipPositionTranslate ? eye1 : eye0;
+                        const target = skipPositionTranslate ? target1 : target0;
+                        if (freeRotation) {
+                            this.orbitControl.update();
+                            const orbitControlTarget = this.orbitControl.target.clone();
+                            const cameraPosition = this.orbitControl.object.position.clone();
+                            const originDiff = orbitControlTarget.sub(cameraPosition).normalize();
+                            eye = originDiff.multiplyScalar(PanoramaController.DirectionVectorScalar).add(target);
+                        }
+                        this.setCameraPose([eye.x, eye.y, eye.z], [target.x, target.y, target.z]);
+                        this.renderThisFrame();
+                    })
+                        .onUpdate(({ timer }) => {
+                        const progress = timer / interval;
+                        let rotateProgress = (timer - rotateDelay) / (interval - rotateDelay);
+                        rotateProgress = easing(Math.max(Math.min(rotateProgress, 1), 0));
+                        const theta = fromTheta + (toTheta - fromTheta) * rotateProgress;
+                        const phi = fromPhi + (toPhi - fromPhi) * rotateProgress;
+                        const transformedProgress = progressTransform ? progressTransform(progress) : progress;
+                        // const progress = progress0;
+                        if (!skipPositionTranslate) {
+                            // if (freeRotation) lookAt = this.orbitControl.target.clone();
+                            const spherical = new THREE.Spherical(1, phi, Math.abs(theta) > Math.PI ? theta - Math.sign(theta) * Math.PI * 2 : theta);
+                            spherical.makeSafe();
+                            const direction = new THREE.Vector3().setFromSpherical(spherical).applyQuaternion(quatInverse);
+                            // console.log(`#PanoCtrl# onUpdate: direction=(${direction.x}, ${direction.y}, ${direction.z})`);
+                            const lookAt = fromPosition.clone().addScaledVector(diff, transformedProgress);
+                            this.orbitControl.update();
+                            const orbitControlTarget = this.orbitControl.target.clone();
+                            const cameraPosition = this.orbitControl.object.position.clone();
+                            const originDiff = orbitControlTarget.sub(cameraPosition).normalize();
+                            const fromNormalized = fromDirection.clone().normalize();
+                            const dist = originDiff.distanceToSquared(fromNormalized);
+                            const cameraPos = (freeRotation && dist > 0.0001 ? originDiff : direction)
+                                .multiplyScalar(PanoramaController.DirectionVectorScalar)
+                                .add(lookAt);
+                            this.setCameraPose([cameraPos.x, cameraPos.y, cameraPos.z], [lookAt.x, lookAt.y, lookAt.z]);
+                        }
+                        const currentFOV = fromFOV + transformedProgress * (toFOV - fromFOV);
+                        this.setFOV(currentFOV);
+                        if (onOneMoveUpdate) {
+                            onOneMoveUpdate(iPath, progress, transformedProgress);
+                        }
+                        this.renderThisFrame();
+                    })
+                        .onComplete(() => __awaiter(this, void 0, void 0, function* () {
+                        if (!skipPositionTranslate) {
+                            const toLookAt = toPosition;
+                            this.orbitControl.update();
+                            const orbitControlTarget = this.orbitControl.target.clone();
+                            const cameraPosition = this.orbitControl.object.position.clone();
+                            const originDiff = orbitControlTarget.sub(cameraPosition).normalize();
+                            // const toLookAt = freeRotation ? this.orbitControl.target.clone() : toPosition;
+                            // console.log(`#PanoCtrl# onComplete: direction=(${toDirection.x}, ${toDirection.y}, ${toDirection.z})`);
+                            const cameraPos = (freeRotation ? originDiff : toDirection).clone()
+                                .multiplyScalar(PanoramaController.DirectionVectorScalar)
+                                .add(toLookAt);
+                            this.setCameraPose([cameraPos.x, cameraPos.y, cameraPos.z], [toLookAt.x, toLookAt.y, toLookAt.z]);
+                        }
+                        this.renderThisFrame();
+                        if (onOneMoveComplete) {
+                            yield onOneMoveComplete(iPath);
+                        }
+                        resolve();
+                    }))
+                        .start();
+                }));
+                if (beforeAllMoves) {
+                    yield beforeAllMoves();
+                }
+                while (iPath < pathPoints.length) {
+                    if (this.cancelAnimation)
+                        break;
+                    const task = createTask();
+                    // eslint-disable-next-line no-await-in-loop
+                    yield task;
+                    iPath += 1;
+                }
+                if (!this.cancelAnimation) {
+                    if (afterAllMoves) {
+                        yield afterAllMoves();
+                    }
+                }
+                this.cancelAnimation = false;
+                this.translatePromise = undefined;
+                if (!queueIfBusy) {
+                    this.isAnimating = false;
+                }
+                resolve0();
+            }));
+            this.translatePromise = translatePromise;
+            // eslint-disable-next-line consistent-return
+            yield translatePromise;
+        });
+    }
+    unlockRotation() {
+        this.rotationLocks = {
+            lockAzimuth: false,
+            lockPolar: false,
+            centralAzimuth: 0,
+            centralPolar: Math.PI / 2,
+            azimuthRange: Math.PI,
+            polarRange: Math.PI / 2,
+        };
+        this.orbitControl.maxAzimuthAngle = Infinity;
+        this.orbitControl.minAzimuthAngle = -Infinity;
+        this.orbitControl.maxPolarAngle = Infinity;
+        this.orbitControl.minPolarAngle = -Infinity;
+    }
+    unlockPolarAngle() {
+        Object.assign(this.rotationLocks, {
+            lockPolar: false,
+            centralPolar: Math.PI / 2,
+            polarRange: Math.PI / 2,
+        });
+        this.orbitControl.maxPolarAngle = Infinity;
+        this.orbitControl.minPolarAngle = -Infinity;
+    }
+    lockPolarAngle(range) {
+        if (range < ROTATION_LOCK_BOUNDARY)
+            throw new Error(`Cannot set polar range smaller than ${ROTATION_LOCK_BOUNDARY}`);
+        Object.assign(this.rotationLocks, {
+            lockPolar: true,
+            polarRange: range,
+            centralPolar: this.orbitControl.getPolarAngle(),
+        });
+    }
+    unlockAzimuthalAngle() {
+        Object.assign(this.rotationLocks, {
+            lockAzimuth: false,
+            centralAzimuth: 0,
+            azimuthRange: Math.PI,
+        });
+        this.orbitControl.maxAzimuthAngle = Infinity;
+        this.orbitControl.minAzimuthAngle = -Infinity;
+    }
+    lockAzimuthalAngle(range) {
+        if (range < ROTATION_LOCK_BOUNDARY)
+            throw new Error(`Cannot set azimuth range smaller than ${ROTATION_LOCK_BOUNDARY}`);
+        Object.assign(this.rotationLocks, {
+            lockAzimuth: true,
+            azimuthRange: range,
+            centralAzimuth: this.orbitControl.getAzimuthalAngle(),
+        });
+    }
+    /**
+     * 获取当前纵向转动角度
+     */
+    getPolarAngle() {
+        return this.orbitControl.getPolarAngle();
+    }
+    /**
+     * 获取当前横向转动角度
+     */
+    getAzimuthalAngle() {
+        return this.orbitControl.getAzimuthalAngle();
+    }
+    setCaptureMove(capture) {
+        this.captureMove = capture;
+    }
+    setOnScreenDetectRadius(radius) {
+        this.onScreenDetectRadius = radius;
+    }
+    /**
+     * 设置纵向转动范围, 最低为0, 最高为Math.PI
+     * @param min 纵向转动范围最小值
+     * @param max 纵向转动范围最大值
+     */
+    setPolarAngleRange(min, max) {
+        this.orbitControl.minPolarAngle = min;
+        this.orbitControl.maxPolarAngle = max;
+    }
+    /**
+     * 设置横向转动范围, 最低为-Math.PI, 最高为Math.PI
+     * @param min 横向转动范围最小值
+     * @param max 横向转动范围最大值
+     */
+    setAzimuthAngleRange(min, max) {
+        this.orbitControl.minAzimuthAngle = min;
+        this.orbitControl.maxAzimuthAngle = max;
+    }
+    /**
+     * 设置相机的横向旋转
+     * @param radius 目标弧度
+     */
+    setAzimuthAngle(radius) {
+        const { minAzimuthAngle, maxAzimuthAngle } = this.orbitControl;
+        this.setAzimuthAngleRange(radius, radius + 0.000001);
+        this.orbitControl.update();
+        this.setAzimuthAngleRange(minAzimuthAngle, maxAzimuthAngle);
+        this.orbitControl.update();
+        this.renderThisFrame();
+    }
+    /**
+     * 设置相机的纵向旋转
+     * @param radius 目标弧度
+     */
+    setPolarAngle(radius) {
+        const { minPolarAngle, maxPolarAngle } = this.orbitControl;
+        this.setPolarAngleRange(radius, radius + 0.000001);
+        this.orbitControl.update();
+        this.setPolarAngleRange(minPolarAngle, maxPolarAngle);
+        this.orbitControl.update();
+        this.renderThisFrame();
+    }
+    stopMoving() {
+        this.cancelAnimation = false;
+    }
+}
+PanoramaController.RotateSpeed = -1;
+PanoramaController.DirectionVectorScalar = -0.0001;
+export { PanoramaController };