@xtctwins/tctwins-core 1.0.26 → 1.0.27

package/dist/tctwins-core.es.js

@@ -11669,7 +11669,7 @@ class AngleMeasurement extends Component {
 	/**
 	 * Gets the color of the angle measurement.
 	 *
-	 * The color is an HTML string representation, eg. "#00BBFF" and "blue".
+	 * The color is an HTML string representation, eg. "#0065fc" and "blue".
 	 *
 	 * @type {String}
 	 */
@@ -12772,7 +12772,7 @@ class AngleMeasurementsPlugin extends Plugin {
 
 		this._measurements = {};
 
-		this.defaultColor = cfg.defaultColor !== undefined ? cfg.defaultColor : "#00BBFF";
+		this.defaultColor = cfg.defaultColor !== undefined ? cfg.defaultColor : "#0065fc";
 		this.defaultLabelsVisible = cfg.defaultLabelsVisible !== false;
 		this.zIndex = cfg.zIndex || 10000;
 
@@ -32045,13 +32045,13 @@ class Scene extends Component {
 	 */
 	destroy(callback) {
 		super.destroy();
-
 		for (const id in this.components) {
 			if (this.components.hasOwnProperty(id)) {
 				this.components[id].destroy();
 			}
 		}
-		this.canvas.destroy();
+		// this.canvas.destroy(); // canvas是scene的其中一个component，所有以不必再destroy
+
 		// Memory leak prevention
 		this.components = null;
 		this.models = null;
@@ -32073,13 +32073,14 @@ class Scene extends Component {
 		this._selectedObjectIds = null;
 		this._colorizedObjectIds = null;
 		this.types = null;
-		this.components = null;
-		this.canvas = null;
 		this._renderer = null;
 		this.input = null;
 		this._viewport = null;
 		this._camera = null;
-		if (callback) callback();
+		this.canvas = null;
+		if (typeof callback === "function") {
+			callback();
+		}
 	}
 }
 
@@ -87717,7 +87718,7 @@ class DistanceMeasurementsPlugin extends Plugin {
 	 * @param {boolean} [cfg.defaultXAxisVisible=true] The default value of the DistanceMeasurements `xAxisVisible` property.
 	 * @param {boolean} [cfg.defaultYAxisVisible=true] The default value of the DistanceMeasurements `yAxisVisible` property.
 	 * @param {boolean} [cfg.defaultZAxisVisible=true] The default value of the DistanceMeasurements `zAxisVisible` property.
-	 * @param {string} [cfg.defaultColor=#00BBFF] The default color of the length dots, wire and label.
+	 * @param {string} [cfg.defaultColor=#0065fc] The default color of the length dots, wire and label.
 	 * @param {number} [cfg.zIndex] If set, the wires, dots and labels will have this zIndex (+1 for dots and +2 for labels).
 	 * @param {boolean} [cfg.defaultLabelsOnWires=true] The default value of the DistanceMeasurements `labelsOnWires` property.
 	 * @param {PointerCircle} [cfg.pointerLens] A PointerLens to help the user position the pointer. This can be shared with other plugins.
@@ -87744,7 +87745,7 @@ class DistanceMeasurementsPlugin extends Plugin {
 		this.defaultXAxisVisible = cfg.defaultXAxisVisible !== false;
 		this.defaultYAxisVisible = cfg.defaultYAxisVisible !== false;
 		this.defaultZAxisVisible = cfg.defaultZAxisVisible !== false;
-		this.defaultColor = cfg.defaultColor !== undefined ? cfg.defaultColor : "#00BBFF";
+		this.defaultColor = cfg.defaultColor !== undefined ? cfg.defaultColor : "#0065fc";
 		this.zIndex = cfg.zIndex || 10000;
 		this.defaultLabelsOnWires = cfg.defaultLabelsOnWires !== false;
 
@@ -95195,7 +95196,7 @@ class MousePanRotateDollyHandler {
 
 		let mouseMovedOnCanvasSinceLastWheel = true;
 
-		const canvas = this._scene.canvas.canvas;
+		this.canvas = this._scene.canvas.canvas;
 
 		const keyDown = [];
 
@@ -95221,13 +95222,13 @@ class MousePanRotateDollyHandler {
 			})
 		);
 
-		function setMousedownState(pick = true) {
-			canvas.style.cursor = "move";
+		const setMousedownState = (pick = true) => {
+			this.canvas.style.cursor = "move";
 			setMousedownPositions();
 			if (pick) {
 				setMousedownPick();
 			}
-		}
+		};
 
 		function setMousedownPositions() {
 
@@ -95255,7 +95256,7 @@ class MousePanRotateDollyHandler {
 			}
 		}
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mousedown",
 			(this._mouseDownHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -95362,7 +95363,7 @@ class MousePanRotateDollyHandler {
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mousemove",
 			(this._canvasMouseMoveHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -95403,7 +95404,7 @@ class MousePanRotateDollyHandler {
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseup",
 			(this._mouseUpHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -95428,11 +95429,11 @@ class MousePanRotateDollyHandler {
 						}
 						break;
 				}
-				canvas.style.removeProperty("cursor");
+				this.canvas.style.removeProperty("cursor");
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseenter",
 			(this._mouseEnterHandler = () => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -95446,7 +95447,7 @@ class MousePanRotateDollyHandler {
 
 		let secsNowLast = null;
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"wheel",
 			(this._mouseWheelHandler = (e) => {
 				e.preventDefault();
@@ -95480,18 +95481,17 @@ class MousePanRotateDollyHandler {
 	reset() {}
 
 	destroy() {
-		const canvas = this._scene.canvas.canvas;
-		if (canvas) {
-			document.removeEventListener("keydown", this._documentKeyDownHandler);
-			document.removeEventListener("keyup", this._documentKeyUpHandler);
-			canvas.removeEventListener("mousedown", this._mouseDownHandler);
-			document.removeEventListener("mousemove", this._documentMouseMoveHandler);
-			canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
-			document.removeEventListener("mouseup", this._documentMouseUpHandler);
-			canvas.removeEventListener("mouseup", this._mouseUpHandler);
-			canvas.removeEventListener("mouseenter", this._mouseEnterHandler);
-			canvas.removeEventListener("wheel", this._mouseWheelHandler);
+		if (this.canvas != null) {
+			this.canvas.removeEventListener("mousedown", this._mouseDownHandler);
+			this.canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
+			this.canvas.removeEventListener("mouseup", this._mouseUpHandler);
+			this.canvas.removeEventListener("mouseenter", this._mouseEnterHandler);
+			this.canvas.removeEventListener("wheel", this._mouseWheelHandler);
 		}
+		document.removeEventListener("keydown", this._documentKeyDownHandler);
+		document.removeEventListener("keyup", this._documentKeyUpHandler);
+		document.removeEventListener("mousemove", this._documentMouseMoveHandler);
+		document.removeEventListener("mouseup", this._documentMouseUpHandler);
 	}
 }
 
@@ -95502,116 +95502,113 @@ const tempVec3c$1 = math.vec3();
 const tempVec3d = math.vec3();
 
 const tempCameraTarget = {
-    eye: math.vec3(),
-    look: math.vec3(),
-    up: math.vec3()
+	eye: math.vec3(),
+	look: math.vec3(),
+	up: math.vec3()
 };
 
 /**
  * @private
  */
 class KeyboardAxisViewHandler {
+	constructor(scene, controllers, configs, states) {
+		this._scene = scene;
+		this.input = scene.input;
+		const cameraControl = controllers.cameraControl;
+		const camera = scene.camera;
 
-    constructor(scene, controllers, configs, states) {
-
-        this._scene = scene;
-        const cameraControl = controllers.cameraControl;
-        const camera = scene.camera;
-
-        this._onSceneKeyDown = scene.input.on("keydown", () => {
-
-            if (!(configs.active && configs.pointerEnabled) || (!scene.input.keyboardEnabled)) {
-                return;
-            }
-
-            if (!states.mouseover) {
-                return;
-            }
-
-            const axisViewRight = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_RIGHT);
-            const axisViewBack = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_BACK);
-            const axisViewLeft = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_LEFT);
-            const axisViewFront = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_FRONT);
-            const axisViewTop = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_TOP);
-            const axisViewBottom = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_BOTTOM);
-
-            if ((!axisViewRight) && (!axisViewBack) && (!axisViewLeft) && (!axisViewFront) && (!axisViewTop) && (!axisViewBottom)) {
-                return;
-            }
-
-            const aabb = scene.aabb;
-            const diag = math.getAABB3Diag(aabb);
-
-            math.getAABB3Center(aabb, center);
-
-            const perspectiveDist = Math.abs(diag / Math.tan(controllers.cameraFlight.fitFOV * math.DEGTORAD));
-            const orthoScale = diag * 1.1;
-
-            tempCameraTarget.orthoScale = orthoScale;
-
-            if (axisViewRight) {
-
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldRight, perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(camera.worldUp);
-
-            } else if (axisViewBack) {
-
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldForward, perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(camera.worldUp);
-
-            } else if (axisViewLeft) {
+		this._onSceneKeyDown = scene.input.on("keydown", () => {
+			if (!(configs.active && configs.pointerEnabled) || !scene.input.keyboardEnabled) {
+				return;
+			}
 
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldRight, -perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(camera.worldUp);
+			if (!states.mouseover) {
+				return;
+			}
 
-            } else if (axisViewFront) {
+			const axisViewRight = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_RIGHT);
+			const axisViewBack = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_BACK);
+			const axisViewLeft = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_LEFT);
+			const axisViewFront = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_FRONT);
+			const axisViewTop = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_TOP);
+			const axisViewBottom = cameraControl._isKeyDownForAction(cameraControl.AXIS_VIEW_BOTTOM);
 
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldForward, -perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(camera.worldUp);
+			if (!axisViewRight && !axisViewBack && !axisViewLeft && !axisViewFront && !axisViewTop && !axisViewBottom) {
+				return;
+			}
 
-            } else if (axisViewTop) {
+			const aabb = scene.aabb;
+			const diag = math.getAABB3Diag(aabb);
 
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldUp, perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(math.normalizeVec3(math.mulVec3Scalar(camera.worldForward, 1, tempVec3b$2), tempVec3c$1));
+			math.getAABB3Center(aabb, center);
 
-            } else if (axisViewBottom) {
+			const perspectiveDist = Math.abs(diag / Math.tan(controllers.cameraFlight.fitFOV * math.DEGTORAD));
+			const orthoScale = diag * 1.1;
 
-                tempCameraTarget.eye.set(math.addVec3(center, math.mulVec3Scalar(camera.worldUp, -perspectiveDist, tempVec3a$5), tempVec3d));
-                tempCameraTarget.look.set(center);
-                tempCameraTarget.up.set(math.normalizeVec3(math.mulVec3Scalar(camera.worldForward, -1, tempVec3b$2)));
-            }
+			tempCameraTarget.orthoScale = orthoScale;
 
-            if ((!configs.firstPerson) && configs.followPointer) {
-                controllers.pivotController.setPivotPos(center);
-            }
+			if (axisViewRight) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldRight, perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(camera.worldUp);
+			} else if (axisViewBack) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldForward, perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(camera.worldUp);
+			} else if (axisViewLeft) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldRight, -perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(camera.worldUp);
+			} else if (axisViewFront) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldForward, -perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(camera.worldUp);
+			} else if (axisViewTop) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldUp, perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(math.normalizeVec3(math.mulVec3Scalar(camera.worldForward, 1, tempVec3b$2), tempVec3c$1));
+			} else if (axisViewBottom) {
+				tempCameraTarget.eye.set(
+					math.addVec3(center, math.mulVec3Scalar(camera.worldUp, -perspectiveDist, tempVec3a$5), tempVec3d)
+				);
+				tempCameraTarget.look.set(center);
+				tempCameraTarget.up.set(math.normalizeVec3(math.mulVec3Scalar(camera.worldForward, -1, tempVec3b$2)));
+			}
 
-            if (controllers.cameraFlight.duration > 0) {
-                controllers.cameraFlight.flyTo(tempCameraTarget, () => {
-                    if (controllers.pivotController.getPivoting() && configs.followPointer) {
-                        controllers.pivotController.showPivot();
-                    }
-                });
+			if (!configs.firstPerson && configs.followPointer) {
+				controllers.pivotController.setPivotPos(center);
+			}
 
-            } else {
-                controllers.cameraFlight.jumpTo(tempCameraTarget);
-                if (controllers.pivotController.getPivoting() && configs.followPointer) {
-                    controllers.pivotController.showPivot();
-                }
-            }
-        });
-    }
+			if (controllers.cameraFlight.duration > 0) {
+				controllers.cameraFlight.flyTo(tempCameraTarget, () => {
+					if (controllers.pivotController.getPivoting() && configs.followPointer) {
+						controllers.pivotController.showPivot();
+					}
+				});
+			} else {
+				controllers.cameraFlight.jumpTo(tempCameraTarget);
+				if (controllers.pivotController.getPivoting() && configs.followPointer) {
+					controllers.pivotController.showPivot();
+				}
+			}
+		});
+	}
 
-    reset() {
-    }
+	reset() {}
 
-    destroy() {
-        this._scene.input.off(this._onSceneKeyDown);
-    }
+	destroy() {
+		this.input.off(this._onSceneKeyDown);
+	}
 }
 
 /**
@@ -95632,7 +95629,7 @@ class MousePickHandler {
 		let leftDown = false;
 		let rightDown = false;
 
-		const canvas = this._scene.canvas.canvas;
+		this.canvas = this._scene.canvas.canvas;
 
 		const tickifiedMouseMoveFn = scene.tickify(
 			(this._canvasMouseMoveHandler = (e) => {
@@ -95714,8 +95711,8 @@ class MousePickHandler {
 			})
 		);
 
-		canvas.addEventListener("mousemove", tickifiedMouseMoveFn);
-		canvas.addEventListener(
+		this.canvas.addEventListener("mousemove", tickifiedMouseMoveFn);
+		this.canvas.addEventListener(
 			"dblclick",
 			(this._canvasDblClickHandler = (e) => {
 				states.mouseDownClientX = e.clientX;
@@ -95746,7 +95743,7 @@ class MousePickHandler {
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mousedown",
 			(this._canvasMouseDownHandler = (e) => {
 				if (e.which === 1) {
@@ -95818,7 +95815,7 @@ class MousePickHandler {
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseup",
 			(this._canvasMouseUpHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -95992,12 +95989,13 @@ class MousePickHandler {
 	}
 
 	destroy() {
-		const canvas = this._scene.canvas.canvas;
-		canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
-		canvas.removeEventListener("mousedown", this._canvasMouseDownHandler);
-		canvas.removeEventListener("dblclick", this._canvasDblClickHandler);
+		if (this.canvas != null) {
+			this.canvas.removeEventListener("mousemove", this._canvasMouseMoveHandler);
+			this.canvas.removeEventListener("mousedown", this._canvasMouseDownHandler);
+			this.canvas.removeEventListener("dblclick", this._canvasDblClickHandler);
+			this.canvas.removeEventListener("mouseup", this._canvasMouseUpHandler);
+		}
 		document.removeEventListener("mouseup", this._documentMouseUpHandler);
-		canvas.removeEventListener("mouseup", this._canvasMouseUpHandler);
 		if (this._timeout) {
 			window.clearTimeout(this._timeout);
 			this._timeout = null;
@@ -96013,7 +96011,7 @@ class KeyboardPanRotateDollyHandler {
 		this._scene = scene;
 		this._updates = updates;
 		const input = scene.input;
-
+		this.input = input;
 		const keyDownMap = [];
 
 		const canvas = scene.canvas.canvas;
@@ -96167,9 +96165,9 @@ class KeyboardPanRotateDollyHandler {
 	destroy() {
 		this._scene.off(this._onTick);
 
-		this._scene.input.off(this._onSceneMouseMove);
-		this._scene.input.off(this._onSceneKeyDown);
-		this._scene.input.off(this._onSceneKeyUp);
+		this.input.off(this._onSceneMouseMove);
+		this.input.off(this._onSceneKeyDown);
+		this.input.off(this._onSceneKeyUp);
 	}
 }
 
@@ -96489,42 +96487,42 @@ class MouseMiscHandler {
 	constructor(scene, controllers, configs, states, updates) {
 		this._scene = scene;
 
-		const canvas = this._scene.canvas.canvas;
+		this.canvas = this._scene.canvas.canvas;
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseenter",
 			(this._mouseEnterHandler = () => {
 				states.mouseover = true;
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseleave",
 			(this._mouseLeaveHandler = () => {
 				states.mouseover = false;
-				canvas.style.cursor = null;
+				this.canvas.style.cursor = null;
 			})
 		);
 
 		document.addEventListener(
 			"mousemove",
 			(this._mouseMoveHandler = (e) => {
-				getCanvasPosFromEvent$2(e, canvas, states.pointerCanvasPos);
+				getCanvasPosFromEvent$2(e, this.canvas, states.pointerCanvasPos);
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mousedown",
 			(this._mouseDownHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
 					return;
 				}
-				getCanvasPosFromEvent$2(e, canvas, states.pointerCanvasPos);
+				getCanvasPosFromEvent$2(e, this.canvas, states.pointerCanvasPos);
 				states.mouseover = true;
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"mouseup",
 			(this._mouseUpHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -96537,16 +96535,15 @@ class MouseMiscHandler {
 	reset() {}
 
 	destroy() {
-		const canvas = this._scene.canvas.canvas;
 		//网络问题导致的模型加载失败等情况时，如果切换模型，会找不到canvas
 		//因此暂时在此加判断
-		if (canvas) {
-			document.removeEventListener("mousemove", this._mouseMoveHandler);
-			canvas.removeEventListener("mouseenter", this._mouseEnterHandler);
-			canvas.removeEventListener("mouseleave", this._mouseLeaveHandler);
-			canvas.removeEventListener("mousedown", this._mouseDownHandler);
-			canvas.removeEventListener("mouseup", this._mouseUpHandler);
+		if (this.canvas != null) {
+			this.canvas.removeEventListener("mouseenter", this._mouseEnterHandler);
+			this.canvas.removeEventListener("mouseleave", this._mouseLeaveHandler);
+			this.canvas.removeEventListener("mousedown", this._mouseDownHandler);
+			this.canvas.removeEventListener("mouseup", this._mouseUpHandler);
 		}
+		document.removeEventListener("mousemove", this._mouseMoveHandler);
 	}
 }
 
@@ -96599,7 +96596,7 @@ class TouchPanRotateAndDollyHandler {
 		const touch0Vec = math.vec2();
 
 		const lastCanvasTouchPosList = [];
-		const canvas = this._scene.canvas.canvas;
+		this.canvas = this._scene.canvas.canvas;
 
 		let numTouches = 0;
 		let waitForTick = false;
@@ -96608,7 +96605,7 @@ class TouchPanRotateAndDollyHandler {
 			waitForTick = false;
 		});
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"touchstart",
 			(this._canvasTouchStartHandler = (event) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -96674,7 +96671,7 @@ class TouchPanRotateAndDollyHandler {
 			})
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"touchend",
 			(this._canvasTouchEndHandler = () => {
 				if (pivotController.getPivoting()) {
@@ -96683,9 +96680,9 @@ class TouchPanRotateAndDollyHandler {
 				}
 			})
 		);
-		canvas.addEventListener("touchcancel", this._canvasTouchEndHandler);
+		this.canvas.addEventListener("touchcancel", this._canvasTouchEndHandler);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"touchmove",
 			(this._canvasTouchMoveHandler = (event) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -96831,11 +96828,12 @@ class TouchPanRotateAndDollyHandler {
 	reset() {}
 
 	destroy() {
-		const canvas = this._scene.canvas.canvas;
-		canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
-		canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
-		canvas.removeEventListener("touchcancel", this._canvasTouchEndHandler);
-		canvas.removeEventListener("touchmove", this._canvasTouchMoveHandler);
+		if (this.canvas != null) {
+			this.canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
+			this.canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
+			this.canvas.removeEventListener("touchcancel", this._canvasTouchEndHandler);
+			this.canvas.removeEventListener("touchmove", this._canvasTouchMoveHandler);
+		}
 		this._scene.off(this._onTick);
 	}
 }
@@ -96880,7 +96878,7 @@ class TouchPickHandler {
 		let tapStartTime = -1;
 		let lastTapTime = -1;
 
-		const canvas = this._scene.canvas.canvas;
+		this.canvas = this._scene.canvas.canvas;
 
 		const flyCameraTo = (pickResult) => {
 			let pos;
@@ -96904,7 +96902,7 @@ class TouchPickHandler {
 			}
 		};
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"touchstart",
 			(this._canvasTouchStartHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -96982,7 +96980,7 @@ class TouchPickHandler {
 			{ passive: true }
 		);
 
-		canvas.addEventListener(
+		this.canvas.addEventListener(
 			"touchend",
 			(this._canvasTouchEndHandler = (e) => {
 				if (!(configs.active && configs.pointerEnabled)) {
@@ -97079,7 +97077,7 @@ class TouchPickHandler {
 			{ passive: true }
 		);
 
-		canvas.addEventListener("touchcancel", this._canvasTouchEndHandler);
+		this.canvas.addEventListener("touchcancel", this._canvasTouchEndHandler);
 	}
 
 	reset() {
@@ -97089,10 +97087,11 @@ class TouchPickHandler {
 	}
 
 	destroy() {
-		const canvas = this._scene.canvas.canvas;
-		canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
-		canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
-		canvas.removeEventListener("touchcancel", this._canvasTouchEndHandler);
+		if (this.canvas != null) {
+			this.canvas.removeEventListener("touchstart", this._canvasTouchStartHandler);
+			this.canvas.removeEventListener("touchend", this._canvasTouchEndHandler);
+			this.canvas.removeEventListener("touchcancel", this._canvasTouchEndHandler);
+		}
 	}
 }
 
@@ -108381,13 +108380,16 @@ class Viewer {
 		this._snapshotBegun = false;
 	}
 
-	/** Destroys this Viewer.
+	/**
+	 * Destroys this Viewer.
 	 */
 	destroy(callback) {
 		const plugins = this._plugins.slice(); // Array will modify as we delete plugins
-		for (let i = 0, len = plugins.length; i < len; i++) {
-			const plugin = plugins[i];
-			plugin.destroy();
+		if (plugins.length > 0) {
+			for (let i = 0, len = plugins.length; i < len; i++) {
+				const plugin = plugins[i];
+				plugin.destroy();
+			}
 		}
 		this.cameraControl.destroy();
 		this.scene.destroy(callback);
@@ -121157,235 +121159,241 @@ class Plane$1 {
  * @private
  */
 class Overview$1 {
+	/**
+	 * @private
+	 */
+	constructor(plugin, cfg) {
+		if (!cfg.onHoverEnterPlane || !cfg.onHoverLeavePlane || !cfg.onClickedNothing || !cfg.onClickedPlane) {
+			throw "Missing config(s): onHoverEnterPlane, onHoverLeavePlane, onClickedNothing || onClickedPlane";
+		}
 
-    /**
-     * @private
-     */
-    constructor(plugin, cfg) {
-
-        if (!cfg.onHoverEnterPlane || !cfg.onHoverLeavePlane || !cfg.onClickedNothing || !cfg.onClickedPlane) {
-            throw "Missing config(s): onHoverEnterPlane, onHoverLeavePlane, onClickedNothing || onClickedPlane";
-        }
-
-        /**
-         * The {@link SectionPlanesPlugin} that owns this SectionPlanesOverview.
-         *
-         * @type {SectionPlanesPlugin}
-         */
-        this.plugin = plugin;
+		/**
+		 * The {@link SectionPlanesPlugin} that owns this SectionPlanesOverview.
+		 *
+		 * @type {SectionPlanesPlugin}
+		 */
+		this.plugin = plugin;
 
-        this._viewer = plugin.viewer;
+		this._viewer = plugin.viewer;
 
-        this._onHoverEnterPlane = cfg.onHoverEnterPlane;
-        this._onHoverLeavePlane = cfg.onHoverLeavePlane;
-        this._onClickedNothing = cfg.onClickedNothing;
-        this._onClickedPlane = cfg.onClickedPlane;
-        this._visible = true;
+		this._onHoverEnterPlane = cfg.onHoverEnterPlane;
+		this._onHoverLeavePlane = cfg.onHoverLeavePlane;
+		this._onClickedNothing = cfg.onClickedNothing;
+		this._onClickedPlane = cfg.onClickedPlane;
+		this._visible = true;
 
-        this._planes = {};
+		this._planes = {};
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Init canvas
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Init canvas
+		//--------------------------------------------------------------------------------------------------------------
 
-        this._canvas = cfg.overviewCanvas;
+		this._canvas = cfg.overviewCanvas;
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Init scene
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Init scene
+		//--------------------------------------------------------------------------------------------------------------
 
-        this._scene = new Scene(this._viewer, {
-            canvasId: this._canvas.id,
-            transparent: true
-        });
-        this._scene.clearLights();
-        new DirLight(this._scene, {
-            dir: [0.4, -0.4, 0.8],
-            color: [0.8, 1.0, 1.0],
-            intensity: 1.0,
-            space: "view"
-        });
-        new DirLight(this._scene, {
-            dir: [-0.8, -0.3, -0.4],
-            color: [0.8, 0.8, 0.8],
-            intensity: 1.0,
-            space: "view"
-        });
-        new DirLight(this._scene, {
-            dir: [0.8, -0.6, -0.8],
-            color: [1.0, 1.0, 1.0],
-            intensity: 1.0,
-            space: "view"
-        });
+		this._scene = new Scene(this._viewer, {
+			canvasId: this._canvas.id,
+			transparent: true
+		});
+		this._scene.clearLights();
+		new DirLight(this._scene, {
+			dir: [0.4, -0.4, 0.8],
+			color: [0.8, 1.0, 1.0],
+			intensity: 1.0,
+			space: "view"
+		});
+		new DirLight(this._scene, {
+			dir: [-0.8, -0.3, -0.4],
+			color: [0.8, 0.8, 0.8],
+			intensity: 1.0,
+			space: "view"
+		});
+		new DirLight(this._scene, {
+			dir: [0.8, -0.6, -0.8],
+			color: [1.0, 1.0, 1.0],
+			intensity: 1.0,
+			space: "view"
+		});
 
-        this._scene.camera;
-        this._scene.camera.perspective.fov = 70;
+		this._scene.camera;
+		this._scene.camera.perspective.fov = 70;
 
-        this._zUp = false;
+		this._zUp = false;
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Synchronize overview scene camera with viewer camera
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Synchronize overview scene camera with viewer camera
+		//--------------------------------------------------------------------------------------------------------------
 
-        {
-            const camera = this._scene.camera;
-            const matrix = math.rotationMat4c(-90 * math.DEGTORAD, 1, 0, 0);
-            const eyeLookVec = math.vec3();
-            const eyeLookVecOverview = math.vec3();
-            const upOverview = math.vec3();
-
-            this._synchCamera = () => {
-                const eye = this._viewer.camera.eye;
-                const look = this._viewer.camera.look;
-                const up = this._viewer.camera.up;
-                math.mulVec3Scalar(math.normalizeVec3(math.subVec3(eye, look, eyeLookVec)), 7);
-                if (this._zUp) { // +Z up
-                    math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
-                    math.transformVec3(matrix, up, upOverview);
-                    camera.look = [0, 0, 0];
-                    camera.eye = math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
-                    camera.up = math.transformPoint3(matrix, up, upOverview);
-                } else { // +Y up
-                    camera.look = [0, 0, 0];
-                    camera.eye = eyeLookVec;
-                    camera.up = up;
-                }
-            };
-        }
+		{
+			const camera = this._scene.camera;
+			const matrix = math.rotationMat4c(-90 * math.DEGTORAD, 1, 0, 0);
+			const eyeLookVec = math.vec3();
+			const eyeLookVecOverview = math.vec3();
+			const upOverview = math.vec3();
+
+			this._synchCamera = () => {
+				const eye = this._viewer.camera.eye;
+				const look = this._viewer.camera.look;
+				const up = this._viewer.camera.up;
+				math.mulVec3Scalar(math.normalizeVec3(math.subVec3(eye, look, eyeLookVec)), 7);
+				if (this._zUp) {
+					// +Z up
+					math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
+					math.transformVec3(matrix, up, upOverview);
+					camera.look = [0, 0, 0];
+					camera.eye = math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
+					camera.up = math.transformPoint3(matrix, up, upOverview);
+				} else {
+					// +Y up
+					camera.look = [0, 0, 0];
+					camera.eye = eyeLookVec;
+					camera.up = up;
+				}
+			};
+		}
 
-        this._onViewerCameraMatrix = this._viewer.camera.on("matrix", this._synchCamera);
+		this._onViewerCameraMatrix = this._viewer.camera.on("matrix", this._synchCamera);
 
-        this._onViewerCameraWorldAxis = this._viewer.camera.on("worldAxis", this._synchCamera);
+		this._onViewerCameraWorldAxis = this._viewer.camera.on("worldAxis", this._synchCamera);
 
-        this._onViewerCameraFOV = this._viewer.camera.perspective.on("fov", (fov) => {
-            this._scene.camera.perspective.fov = fov;
-        });
+		this._onViewerCameraFOV = this._viewer.camera.perspective.on("fov", (fov) => {
+			this._scene.camera.perspective.fov = fov;
+		});
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Bind overview canvas events
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Bind overview canvas events
+		//--------------------------------------------------------------------------------------------------------------
 
-        {
-            var hoveredEntity = null;
+		{
+			var hoveredEntity = null;
 
-            this._onInputMouseMove = this._scene.input.on("mousemove", (coords) => {
-                const hit = this._scene.pick({
-                    canvasPos: coords
-                });
-                if (hit) {
-                    if (!hoveredEntity || hit.entity.id !== hoveredEntity.id) {
-                        if (hoveredEntity) {
-                            const plane = this._planes[hoveredEntity.id];
-                            if (plane) {
-                                this._onHoverLeavePlane(hoveredEntity.id);
-                            }
-                        }
-                        hoveredEntity = hit.entity;
-                        const plane = this._planes[hoveredEntity.id];
-                        if (plane) {
-                            this._onHoverEnterPlane(hoveredEntity.id);
-                        }
-                    }
-                } else {
-                    if (hoveredEntity) {
-                        this._onHoverLeavePlane(hoveredEntity.id);
-                        hoveredEntity = null;
-                    }
-                }
-            });
+			this._onInputMouseMove = this._scene.input.on("mousemove", (coords) => {
+				const hit = this._scene.pick({
+					canvasPos: coords
+				});
+				if (hit) {
+					if (!hoveredEntity || hit.entity.id !== hoveredEntity.id) {
+						if (hoveredEntity) {
+							const plane = this._planes[hoveredEntity.id];
+							if (plane) {
+								this._onHoverLeavePlane(hoveredEntity.id);
+							}
+						}
+						hoveredEntity = hit.entity;
+						const plane = this._planes[hoveredEntity.id];
+						if (plane) {
+							this._onHoverEnterPlane(hoveredEntity.id);
+						}
+					}
+				} else {
+					if (hoveredEntity) {
+						this._onHoverLeavePlane(hoveredEntity.id);
+						hoveredEntity = null;
+					}
+				}
+			});
 
-            this._scene.canvas.canvas.addEventListener("mouseup", this._onCanvasMouseUp = () => {
-                if (hoveredEntity) {
-                    const plane = this._planes[hoveredEntity.id];
-                    if (plane) {
-                        this._onClickedPlane(hoveredEntity.id);
-                    }
-                } else {
-                    this._onClickedNothing();
-                }
-            });
+			this._scene.canvas.canvas.addEventListener(
+				"mouseup",
+				(this._onCanvasMouseUp = () => {
+					if (hoveredEntity) {
+						const plane = this._planes[hoveredEntity.id];
+						if (plane) {
+							this._onClickedPlane(hoveredEntity.id);
+						}
+					} else {
+						this._onClickedNothing();
+					}
+				})
+			);
 
-            this._scene.canvas.canvas.addEventListener("mouseout", this._onCanvasMouseOut = () => {
-                if (hoveredEntity) {
-                    this._onHoverLeavePlane(hoveredEntity.id);
-                    hoveredEntity = null;
-                }
-            });
-        }
+			this._scene.canvas.canvas.addEventListener(
+				"mouseout",
+				(this._onCanvasMouseOut = () => {
+					if (hoveredEntity) {
+						this._onHoverLeavePlane(hoveredEntity.id);
+						hoveredEntity = null;
+					}
+				})
+			);
+		}
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Configure overview
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Configure overview
+		//--------------------------------------------------------------------------------------------------------------
 
-        this.setVisible(cfg.overviewVisible);
-    }
+		this.setVisible(cfg.overviewVisible);
+	}
 
-    /** Called by SectionPlanesPlugin#createSectionPlane()
-     * @private
-     */
-    addSectionPlane(sectionPlane) {
-        this._planes[sectionPlane.id] = new Plane$1(this, this._scene, sectionPlane);
-    }
+	/** Called by SectionPlanesPlugin#createSectionPlane()
+	 * @private
+	 */
+	addSectionPlane(sectionPlane) {
+		this._planes[sectionPlane.id] = new Plane$1(this, this._scene, sectionPlane);
+	}
 
-    /**  @private
-     */
-    setPlaneHighlighted(id, highlighted) {
-        const plane = this._planes[id];
-        if (plane) {
-            plane.setHighlighted(highlighted);
-        }
-    }
+	/**  @private
+	 */
+	setPlaneHighlighted(id, highlighted) {
+		const plane = this._planes[id];
+		if (plane) {
+			plane.setHighlighted(highlighted);
+		}
+	}
 
-    /**  @private
-     */
-    setPlaneSelected(id, selected) {
-        const plane = this._planes[id];
-        if (plane) {
-            plane.setSelected(selected);
-        }
-    }
+	/**  @private
+	 */
+	setPlaneSelected(id, selected) {
+		const plane = this._planes[id];
+		if (plane) {
+			plane.setSelected(selected);
+		}
+	}
 
-    /** @private
-     */
-    removeSectionPlane(sectionPlane) {
-        const plane = this._planes[sectionPlane.id];
-        if (plane) {
-            plane.destroy();
-            delete this._planes[sectionPlane.id];
-        }
-    }
+	/** @private
+	 */
+	removeSectionPlane(sectionPlane) {
+		const plane = this._planes[sectionPlane.id];
+		if (plane) {
+			plane.destroy();
+			delete this._planes[sectionPlane.id];
+		}
+	}
 
-    /**
-     * Sets if this SectionPlanesOverview is visible.
-     *
-     * @param {Boolean} visible Whether or not this SectionPlanesOverview is visible.
-     */
-    setVisible(visible = true) {
-        this._visible = visible;
-        this._canvas.style.visibility = visible ? "visible" : "hidden";
-    }
+	/**
+	 * Sets if this SectionPlanesOverview is visible.
+	 *
+	 * @param {Boolean} visible Whether or not this SectionPlanesOverview is visible.
+	 */
+	setVisible(visible = true) {
+		this._visible = visible;
+		this._canvas.style.visibility = visible ? "visible" : "hidden";
+	}
 
-    /**
-     * Gets if this SectionPlanesOverview is visible.
-     *
-     * @return {Boolean} True when this SectionPlanesOverview is visible.
-     */
-    getVisible() {
-        return this._visible;
-    }
+	/**
+	 * Gets if this SectionPlanesOverview is visible.
+	 *
+	 * @return {Boolean} True when this SectionPlanesOverview is visible.
+	 */
+	getVisible() {
+		return this._visible;
+	}
 
-    /**  @private
-     */
-    destroy() {
-        this._viewer.camera.off(this._onViewerCameraMatrix);
-        this._viewer.camera.off(this._onViewerCameraWorldAxis);
-        this._viewer.camera.perspective.off(this._onViewerCameraFOV);
+	/**  @private
+	 */
+	destroy() {
+		this._viewer.camera.off(this._onViewerCameraMatrix);
+		this._viewer.camera.off(this._onViewerCameraWorldAxis);
+		this._viewer.camera.perspective.off(this._onViewerCameraFOV);
 
-        this._scene.input.off(this._onInputMouseMove);
-        this._scene.canvas.canvas.removeEventListener("mouseup", this._onCanvasMouseUp);
-        this._scene.canvas.canvas.removeEventListener("mouseout", this._onCanvasMouseOut);
-        this._scene.destroy();
-    }
+		this._scene.input.off(this._onInputMouseMove);
+		this._scene.canvas.canvas.removeEventListener("mouseup", this._onCanvasMouseUp);
+		this._scene.canvas.canvas.removeEventListener("mouseout", this._onCanvasMouseOut);
+		this._scene.destroy();
+	}
 }
 
 const tempAABB$1 = math.AABB3();
@@ -123538,235 +123546,241 @@ class Plane {
  * @private
  */
 class Overview {
+	/**
+	 * @private
+	 */
+	constructor(plugin, cfg) {
+		if (!cfg.onHoverEnterPlane || !cfg.onHoverLeavePlane || !cfg.onClickedNothing || !cfg.onClickedPlane) {
+			throw "Missing config(s): onHoverEnterPlane, onHoverLeavePlane, onClickedNothing || onClickedPlane";
+		}
 
-    /**
-     * @private
-     */
-    constructor(plugin, cfg) {
-
-        if (!cfg.onHoverEnterPlane || !cfg.onHoverLeavePlane || !cfg.onClickedNothing || !cfg.onClickedPlane) {
-            throw "Missing config(s): onHoverEnterPlane, onHoverLeavePlane, onClickedNothing || onClickedPlane";
-        }
-
-        /**
-         * The {@link FaceAlignedSectionPlanesPlugin} that owns this SectionPlanesOverview.
-         *
-         * @type {FaceAlignedSectionPlanesPlugin}
-         */
-        this.plugin = plugin;
+		/**
+		 * The {@link FaceAlignedSectionPlanesPlugin} that owns this SectionPlanesOverview.
+		 *
+		 * @type {FaceAlignedSectionPlanesPlugin}
+		 */
+		this.plugin = plugin;
 
-        this._viewer = plugin.viewer;
+		this._viewer = plugin.viewer;
 
-        this._onHoverEnterPlane = cfg.onHoverEnterPlane;
-        this._onHoverLeavePlane = cfg.onHoverLeavePlane;
-        this._onClickedNothing = cfg.onClickedNothing;
-        this._onClickedPlane = cfg.onClickedPlane;
-        this._visible = true;
+		this._onHoverEnterPlane = cfg.onHoverEnterPlane;
+		this._onHoverLeavePlane = cfg.onHoverLeavePlane;
+		this._onClickedNothing = cfg.onClickedNothing;
+		this._onClickedPlane = cfg.onClickedPlane;
+		this._visible = true;
 
-        this._planes = {};
+		this._planes = {};
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Init canvas
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Init canvas
+		//--------------------------------------------------------------------------------------------------------------
 
-        this._canvas = cfg.overviewCanvas;
+		this._canvas = cfg.overviewCanvas;
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Init scene
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Init scene
+		//--------------------------------------------------------------------------------------------------------------
 
-        this._scene = new Scene(this._viewer, {
-            canvasId: this._canvas.id,
-            transparent: true
-        });
-        this._scene.clearLights();
-        new DirLight(this._scene, {
-            dir: [0.4, -0.4, 0.8],
-            color: [0.8, 1.0, 1.0],
-            intensity: 1.0,
-            space: "view"
-        });
-        new DirLight(this._scene, {
-            dir: [-0.8, -0.3, -0.4],
-            color: [0.8, 0.8, 0.8],
-            intensity: 1.0,
-            space: "view"
-        });
-        new DirLight(this._scene, {
-            dir: [0.8, -0.6, -0.8],
-            color: [1.0, 1.0, 1.0],
-            intensity: 1.0,
-            space: "view"
-        });
+		this._scene = new Scene(this._viewer, {
+			canvasId: this._canvas.id,
+			transparent: true
+		});
+		this._scene.clearLights();
+		new DirLight(this._scene, {
+			dir: [0.4, -0.4, 0.8],
+			color: [0.8, 1.0, 1.0],
+			intensity: 1.0,
+			space: "view"
+		});
+		new DirLight(this._scene, {
+			dir: [-0.8, -0.3, -0.4],
+			color: [0.8, 0.8, 0.8],
+			intensity: 1.0,
+			space: "view"
+		});
+		new DirLight(this._scene, {
+			dir: [0.8, -0.6, -0.8],
+			color: [1.0, 1.0, 1.0],
+			intensity: 1.0,
+			space: "view"
+		});
 
-        this._scene.camera;
-        this._scene.camera.perspective.fov = 70;
+		this._scene.camera;
+		this._scene.camera.perspective.fov = 70;
 
-        this._zUp = false;
+		this._zUp = false;
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Synchronize overview scene camera with viewer camera
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Synchronize overview scene camera with viewer camera
+		//--------------------------------------------------------------------------------------------------------------
 
-        {
-            const camera = this._scene.camera;
-            const matrix = math.rotationMat4c(-90 * math.DEGTORAD, 1, 0, 0);
-            const eyeLookVec = math.vec3();
-            const eyeLookVecOverview = math.vec3();
-            const upOverview = math.vec3();
-
-            this._synchCamera = () => {
-                const eye = this._viewer.camera.eye;
-                const look = this._viewer.camera.look;
-                const up = this._viewer.camera.up;
-                math.mulVec3Scalar(math.normalizeVec3(math.subVec3(eye, look, eyeLookVec)), 7);
-                if (this._zUp) { // +Z up
-                    math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
-                    math.transformVec3(matrix, up, upOverview);
-                    camera.look = [0, 0, 0];
-                    camera.eye = math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
-                    camera.up = math.transformPoint3(matrix, up, upOverview);
-                } else { // +Y up
-                    camera.look = [0, 0, 0];
-                    camera.eye = eyeLookVec;
-                    camera.up = up;
-                }
-            };
-        }
+		{
+			const camera = this._scene.camera;
+			const matrix = math.rotationMat4c(-90 * math.DEGTORAD, 1, 0, 0);
+			const eyeLookVec = math.vec3();
+			const eyeLookVecOverview = math.vec3();
+			const upOverview = math.vec3();
+
+			this._synchCamera = () => {
+				const eye = this._viewer.camera.eye;
+				const look = this._viewer.camera.look;
+				const up = this._viewer.camera.up;
+				math.mulVec3Scalar(math.normalizeVec3(math.subVec3(eye, look, eyeLookVec)), 7);
+				if (this._zUp) {
+					// +Z up
+					math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
+					math.transformVec3(matrix, up, upOverview);
+					camera.look = [0, 0, 0];
+					camera.eye = math.transformVec3(matrix, eyeLookVec, eyeLookVecOverview);
+					camera.up = math.transformPoint3(matrix, up, upOverview);
+				} else {
+					// +Y up
+					camera.look = [0, 0, 0];
+					camera.eye = eyeLookVec;
+					camera.up = up;
+				}
+			};
+		}
 
-        this._onViewerCameraMatrix = this._viewer.camera.on("matrix", this._synchCamera);
+		this._onViewerCameraMatrix = this._viewer.camera.on("matrix", this._synchCamera);
 
-        this._onViewerCameraWorldAxis = this._viewer.camera.on("worldAxis", this._synchCamera);
+		this._onViewerCameraWorldAxis = this._viewer.camera.on("worldAxis", this._synchCamera);
 
-        this._onViewerCameraFOV = this._viewer.camera.perspective.on("fov", (fov) => {
-            this._scene.camera.perspective.fov = fov;
-        });
+		this._onViewerCameraFOV = this._viewer.camera.perspective.on("fov", (fov) => {
+			this._scene.camera.perspective.fov = fov;
+		});
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Bind overview canvas events
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Bind overview canvas events
+		//--------------------------------------------------------------------------------------------------------------
 
-        {
-            var hoveredEntity = null;
+		{
+			var hoveredEntity = null;
 
-            this._onInputMouseMove = this._scene.input.on("mousemove", (coords) => {
-                const hit = this._scene.pick({
-                    canvasPos: coords
-                });
-                if (hit) {
-                    if (!hoveredEntity || hit.entity.id !== hoveredEntity.id) {
-                        if (hoveredEntity) {
-                            const plane = this._planes[hoveredEntity.id];
-                            if (plane) {
-                                this._onHoverLeavePlane(hoveredEntity.id);
-                            }
-                        }
-                        hoveredEntity = hit.entity;
-                        const plane = this._planes[hoveredEntity.id];
-                        if (plane) {
-                            this._onHoverEnterPlane(hoveredEntity.id);
-                        }
-                    }
-                } else {
-                    if (hoveredEntity) {
-                        this._onHoverLeavePlane(hoveredEntity.id);
-                        hoveredEntity = null;
-                    }
-                }
-            });
+			this._onInputMouseMove = this._scene.input.on("mousemove", (coords) => {
+				const hit = this._scene.pick({
+					canvasPos: coords
+				});
+				if (hit) {
+					if (!hoveredEntity || hit.entity.id !== hoveredEntity.id) {
+						if (hoveredEntity) {
+							const plane = this._planes[hoveredEntity.id];
+							if (plane) {
+								this._onHoverLeavePlane(hoveredEntity.id);
+							}
+						}
+						hoveredEntity = hit.entity;
+						const plane = this._planes[hoveredEntity.id];
+						if (plane) {
+							this._onHoverEnterPlane(hoveredEntity.id);
+						}
+					}
+				} else {
+					if (hoveredEntity) {
+						this._onHoverLeavePlane(hoveredEntity.id);
+						hoveredEntity = null;
+					}
+				}
+			});
 
-            this._scene.canvas.canvas.addEventListener("mouseup", this._onCanvasMouseUp = () => {
-                if (hoveredEntity) {
-                    const plane = this._planes[hoveredEntity.id];
-                    if (plane) {
-                        this._onClickedPlane(hoveredEntity.id);
-                    }
-                } else {
-                    this._onClickedNothing();
-                }
-            });
+			this._scene.canvas.canvas.addEventListener(
+				"mouseup",
+				(this._onCanvasMouseUp = () => {
+					if (hoveredEntity) {
+						const plane = this._planes[hoveredEntity.id];
+						if (plane) {
+							this._onClickedPlane(hoveredEntity.id);
+						}
+					} else {
+						this._onClickedNothing();
+					}
+				})
+			);
 
-            this._scene.canvas.canvas.addEventListener("mouseout", this._onCanvasMouseOut = () => {
-                if (hoveredEntity) {
-                    this._onHoverLeavePlane(hoveredEntity.id);
-                    hoveredEntity = null;
-                }
-            });
-        }
+			this._scene.canvas.canvas.addEventListener(
+				"mouseout",
+				(this._onCanvasMouseOut = () => {
+					if (hoveredEntity) {
+						this._onHoverLeavePlane(hoveredEntity.id);
+						hoveredEntity = null;
+					}
+				})
+			);
+		}
 
-        //--------------------------------------------------------------------------------------------------------------
-        // Configure overview
-        //--------------------------------------------------------------------------------------------------------------
+		//--------------------------------------------------------------------------------------------------------------
+		// Configure overview
+		//--------------------------------------------------------------------------------------------------------------
 
-        this.setVisible(cfg.overviewVisible);
-    }
+		this.setVisible(cfg.overviewVisible);
+	}
 
-    /** Called by SectionPlanesPlugin#createSectionPlane()
-     * @private
-     */
-    addSectionPlane(sectionPlane) {
-        this._planes[sectionPlane.id] = new Plane(this, this._scene, sectionPlane);
-    }
+	/** Called by SectionPlanesPlugin#createSectionPlane()
+	 * @private
+	 */
+	addSectionPlane(sectionPlane) {
+		this._planes[sectionPlane.id] = new Plane(this, this._scene, sectionPlane);
+	}
 
-    /**  @private
-     */
-    setPlaneHighlighted(id, highlighted) {
-        const plane = this._planes[id];
-        if (plane) {
-            plane.setHighlighted(highlighted);
-        }
-    }
+	/**  @private
+	 */
+	setPlaneHighlighted(id, highlighted) {
+		const plane = this._planes[id];
+		if (plane) {
+			plane.setHighlighted(highlighted);
+		}
+	}
 
-    /**  @private
-     */
-    setPlaneSelected(id, selected) {
-        const plane = this._planes[id];
-        if (plane) {
-            plane.setSelected(selected);
-        }
-    }
+	/**  @private
+	 */
+	setPlaneSelected(id, selected) {
+		const plane = this._planes[id];
+		if (plane) {
+			plane.setSelected(selected);
+		}
+	}
 
-    /** @private
-     */
-    removeSectionPlane(sectionPlane) {
-        const plane = this._planes[sectionPlane.id];
-        if (plane) {
-            plane.destroy();
-            delete this._planes[sectionPlane.id];
-        }
-    }
+	/** @private
+	 */
+	removeSectionPlane(sectionPlane) {
+		const plane = this._planes[sectionPlane.id];
+		if (plane) {
+			plane.destroy();
+			delete this._planes[sectionPlane.id];
+		}
+	}
 
-    /**
-     * Sets if this SectionPlanesOverview is visible.
-     *
-     * @param {Boolean} visible Whether or not this SectionPlanesOverview is visible.
-     */
-    setVisible(visible = true) {
-        this._visible = visible;
-        this._canvas.style.visibility = visible ? "visible" : "hidden";
-    }
+	/**
+	 * Sets if this SectionPlanesOverview is visible.
+	 *
+	 * @param {Boolean} visible Whether or not this SectionPlanesOverview is visible.
+	 */
+	setVisible(visible = true) {
+		this._visible = visible;
+		this._canvas.style.visibility = visible ? "visible" : "hidden";
+	}
 
-    /**
-     * Gets if this SectionPlanesOverview is visible.
-     *
-     * @return {Boolean} True when this SectionPlanesOverview is visible.
-     */
-    getVisible() {
-        return this._visible;
-    }
+	/**
+	 * Gets if this SectionPlanesOverview is visible.
+	 *
+	 * @return {Boolean} True when this SectionPlanesOverview is visible.
+	 */
+	getVisible() {
+		return this._visible;
+	}
 
-    /**  @private
-     */
-    destroy() {
-        this._viewer.camera.off(this._onViewerCameraMatrix);
-        this._viewer.camera.off(this._onViewerCameraWorldAxis);
-        this._viewer.camera.perspective.off(this._onViewerCameraFOV);
+	/**  @private
+	 */
+	destroy() {
+		this._viewer.camera.off(this._onViewerCameraMatrix);
+		this._viewer.camera.off(this._onViewerCameraWorldAxis);
+		this._viewer.camera.perspective.off(this._onViewerCameraFOV);
 
-        this._scene.input.off(this._onInputMouseMove);
-        this._scene.canvas.canvas.removeEventListener("mouseup", this._onCanvasMouseUp);
-        this._scene.canvas.canvas.removeEventListener("mouseout", this._onCanvasMouseOut);
-        this._scene.destroy();
-    }
+		this._scene.input.off(this._onInputMouseMove);
+		this._scene.canvas.canvas.removeEventListener("mouseup", this._onCanvasMouseUp);
+		this._scene.canvas.canvas.removeEventListener("mouseout", this._onCanvasMouseOut);
+		this._scene.destroy();
+	}
 }
 
 const tempAABB = math.AABB3();