@selvajs/visualization 1.6.0-beta.10 → 1.6.0-beta.11

package/dist/render.js

@@ -8,6 +8,7 @@ import { LineMaterial } from "three/addons/lines/LineMaterial.js";
 import { LineSegments2 } from "three/addons/lines/LineSegments2.js";
 import { LineSegmentsGeometry } from "three/addons/lines/LineSegmentsGeometry.js";
 import { CSS2DObject, CSS2DRenderer } from "three/addons/renderers/CSS2DRenderer.js";
+import { MeshBVH } from "three-mesh-bvh";
 import { ViewHelper } from "three/addons/helpers/ViewHelper.js";
 import { EffectComposer } from "three/addons/postprocessing/EffectComposer.js";
 import { RenderPass } from "three/addons/postprocessing/RenderPass.js";
@@ -1793,10 +1794,143 @@ function createLabelLayer(container, scene) {
 		}
 	};
 }
+// src/render/scene-pick.ts
+const bvhCache = /* @__PURE__ */ new WeakMap();
+function versionOf$1(attribute) {
+	return attribute?.version ?? 0;
+}
+/** BVH for a mesh geometry, building it on first use. Null when the geometry can't take one. */
+function bvhFor(geometry) {
+	const position = geometry.attributes.position;
+	if (!position || position.count === 0) return null;
+	const index = geometry.index;
+	const key = index ?? position;
+	const cached = bvhCache.get(key);
+	if (cached === null) return null;
+	if (cached && cached.position === position && cached.positionVersion === versionOf$1(position) && cached.indexVersion === versionOf$1(index)) return cached.bvh;
+	const proxy = new THREE.BufferGeometry();
+	proxy.setAttribute("position", position);
+	if (index) proxy.setIndex(index);
+	try {
+		const bvh = new MeshBVH(proxy, { indirect: true });
+		bvhCache.set(key, {
+			position,
+			positionVersion: versionOf$1(position),
+			indexVersion: versionOf$1(index),
+			bvh
+		});
+		return bvh;
+	} catch {
+		bvhCache.set(key, null);
+		return null;
+	}
+}
+function isBvhMesh(object) {
+	const o = object;
+	return o.isMesh === true && !o.isInstancedMesh && !o.isSkinnedMesh && !o.isBatchedMesh && !o.isLineSegments2 && !object.morphTargetInfluences?.length;
+}
+/**
+* Visible, pickable objects under `root`: hidden subtrees, viewer aids and edge overlays are
+* skipped. Overlays are skipped because they double the mesh's own edges and, as fat lines, cost a
+* linear scan of every segment per ray.
+*/
+function collectPickable(root, out = []) {
+	for (const child of root.children) {
+		if (!child.visible || isViewerAidRoot(child) || isEdgeOverlay(child)) continue;
+		out.push(child);
+		collectPickable(child, out);
+	}
+	return out;
+}
+/**
+* Index-buffer ranges a merged mesh currently draws, or null when it draws everything. Hidden
+* members are the gaps between groups (`shared/merged-draw.ts`).
+*/
+function drawnRanges(mesh) {
+	const { groups } = mesh.geometry;
+	if (!Array.isArray(mesh.material) || groups.length === 0) return null;
+	const materials = mesh.material;
+	return groups.filter((g) => materials[g.materialIndex ?? 0]?.visible !== false).map((g) => ({
+		start: g.start,
+		end: g.start + g.count
+	}));
+}
+const _inverse = new THREE.Matrix4();
+const _localRay = new THREE.Ray();
+const _sphere = new THREE.Sphere();
+function raycastMeshBvh(mesh, bvh, raycaster) {
+	_inverse.copy(mesh.matrixWorld).invert();
+	_localRay.copy(raycaster.ray).applyMatrix4(_inverse);
+	const ranges = drawnRanges(mesh);
+	let best = null;
+	if (!ranges) best = bvh.raycastFirst(_localRay, THREE.DoubleSide);
+	else for (const hit of bvh.raycast(_localRay, THREE.DoubleSide)) {
+		const at = (hit.faceIndex ?? 0) * 3;
+		if (!ranges.some((r) => at >= r.start && at < r.end)) continue;
+		if (!best || hit.distance < best.distance) best = hit;
+	}
+	if (!best) return null;
+	best.point.applyMatrix4(mesh.matrixWorld);
+	best.distance = best.point.distanceTo(raycaster.ray.origin);
+	best.object = mesh;
+	if (best.distance < raycaster.near || best.distance > raycaster.far) return null;
+	return best;
+}
+/**
+* Every hit along `raycaster`'s ray over the visible content of `scene`, nearest first. Meshes use
+* the BVH; lines, points and instanced meshes fall back to their own `raycast`.
+*/
+function raycastVisible(scene, raycaster) {
+	const hits = [];
+	for (const object of collectPickable(scene)) {
+		if (!object.layers.test(raycaster.layers)) continue;
+		if (isBvhMesh(object)) {
+			const { geometry } = object;
+			if (!geometry.boundingSphere) geometry.computeBoundingSphere();
+			if (!geometry.boundingSphere) continue;
+			_sphere.copy(geometry.boundingSphere).applyMatrix4(object.matrixWorld);
+			if (!raycaster.ray.intersectsSphere(_sphere)) continue;
+			const bvh = bvhFor(geometry);
+			if (bvh) {
+				const hit = raycastMeshBvh(object, bvh, raycaster);
+				if (hit) hits.push(hit);
+				continue;
+			}
+		}
+		object.raycast(raycaster, hits);
+	}
+	return hits.sort((a, b) => a.distance - b.distance);
+}
+/**
+* Builds BVHs for the visible meshes under `root` one per idle slice, so the first hover over a
+* large model doesn't pay for all of them at once. Returns a cancel function.
+*/
+function warmPickIndex(root) {
+	const queue = collectPickable(root).filter(isBvhMesh);
+	const idle = typeof requestIdleCallback === "function" ? (fn) => requestIdleCallback(fn, { timeout: 500 }) : (fn) => setTimeout(fn, 16);
+	const cancelIdle = typeof cancelIdleCallback === "function" ? cancelIdleCallback : (id) => clearTimeout(id);
+	let handle = 0;
+	let cancelled = false;
+	const step = () => {
+		if (cancelled) return;
+		const mesh = queue.shift();
+		if (!mesh) return;
+		bvhFor(mesh.geometry);
+		handle = idle(step);
+	};
+	handle = idle(step);
+	return () => {
+		cancelled = true;
+		cancelIdle(handle);
+	};
+}
 // src/render/measure.ts
 const DEFAULT_SNAP_PIXELS = 12;
 const DEFAULT_COLOR = 16763904;
 const LINE_PICK_FRACTION = .015;
+const RENDER_ORDER_LINE = 998;
+const RENDER_ORDER_MARKER = 999;
+const RENDER_ORDER_HOVER = 1e3;
 const UNIT_DISPLAY = {
 	Millimeters: {
 		metersPerUnit: 1 / 1e3,
@@ -1819,10 +1953,33 @@ const UNIT_DISPLAY = {
 		suffix: "ft"
 	}
 };
-/** @internal exported for tests */
+/**
+* Three significant figures below 1000, whole units above. `toPrecision(3)` alone switches to
+* exponent notation past 999 ("1.23e+4 mm"), which is unreadable on a building-scale model.
+*
+* @internal exported for tests
+*/
 function makeFormatter(displayUnit) {
 	const unit = displayUnit && UNIT_DISPLAY[displayUnit] || UNIT_DISPLAY.Meters;
-	return (meters) => `${(meters / unit.metersPerUnit).toPrecision(3)} ${unit.suffix}`;
+	return (meters) => {
+		const value = meters / unit.metersPerUnit;
+		const abs = Math.abs(value);
+		const decimals = abs === 0 ? 0 : Math.min(6, Math.max(0, 2 - Math.floor(Math.log10(abs))));
+		return `${value.toFixed(decimals)} ${unit.suffix}`;
+	};
+}
+/** @internal exported for tests */
+function makeDefaultFormat(fmt) {
+	return (distance, delta) => {
+		const eps = distance * 1e-6;
+		const axes = [
+			"x",
+			"y",
+			"z"
+		].filter((axis) => delta[axis] > eps);
+		if (axes.length < 2) return fmt(distance);
+		return `${fmt(distance)}\n${axes.map((axis) => `Δ${axis} ${fmt(delta[axis])}`).join("  ")}`;
+	};
 }
 /**
 * Raycast threshold for picking lines/points, as a fixed fraction of view size so the grab band
@@ -1840,138 +1997,129 @@ function pickThreshold(camera, viewTarget) {
 	return ((viewTarget ? camera.position.distanceTo(viewTarget) : camera.position.length()) || 1) * LINE_PICK_FRACTION;
 }
 /**
-* Vertex indices to consider snapping to, by object type: Mesh → struck triangle's 3 vertices;
-* Line/LineSegments → struck segment's 2 endpoints; Points → the struck vertex. Null when the hit
-* carries no usable index (e.g. a fat `Line2`), so the caller keeps the raw hit point.
+* Local-space vertices to consider snapping to, by object type: Mesh → struck triangle's 3
+* vertices; Line/LineSegments and fat Line2/LineSegments2 → struck segment's 2 endpoints; Points →
+* the struck vertex. Null when the hit carries no usable index, so the caller keeps the raw point.
 */
-function snapCandidateIndices(hit) {
+function snapCandidates(hit) {
 	const obj = hit.object;
-	if (obj instanceof THREE.Mesh) return hit.face ? [
+	const geometry = obj.geometry;
+	if (!geometry) return null;
+	if (obj.isLineSegments2) {
+		const start = geometry.attributes.instanceStart;
+		const end = geometry.attributes.instanceEnd;
+		const i = hit.faceIndex;
+		if (!start || !end || i == null || i >= start.count) return null;
+		return [new THREE.Vector3().fromBufferAttribute(start, i), new THREE.Vector3().fromBufferAttribute(end, i)];
+	}
+	const pos = geometry.attributes.position;
+	if (!pos) return null;
+	const at = (indices) => indices.filter((i) => i < pos.count).map((i) => new THREE.Vector3().fromBufferAttribute(pos, i));
+	if (obj instanceof THREE.Mesh) return hit.face ? at([
 		hit.face.a,
 		hit.face.b,
 		hit.face.c
-	] : null;
-	if (obj instanceof THREE.Points) return hit.index != null ? [hit.index] : null;
+	]) : null;
+	if (obj instanceof THREE.Points) return hit.index != null ? at([hit.index]) : null;
 	if (obj instanceof THREE.Line) {
 		if (hit.index == null) return null;
-		const index = obj.geometry.index;
+		const index = geometry.index;
 		if (index) {
 			if (hit.index + 1 >= index.count) return null;
-			return [index.getX(hit.index), index.getX(hit.index + 1)];
+			return at([index.getX(hit.index), index.getX(hit.index + 1)]);
 		}
-		return [hit.index, hit.index + 1];
+		return at([hit.index, hit.index + 1]);
 	}
 	return null;
 }
-/** Snap a raycast hit to the nearest geometry vertex within `snapPixels` on screen, else the raw hit point. */
-function snapToVertex(hit, camera, screenSize, snapPixels) {
-	const raw = hit.point.clone();
-	const obj = hit.object;
-	const indices = snapCandidateIndices(hit);
-	if (!indices || !obj.geometry) return raw;
-	const pos = obj.geometry.attributes.position;
-	if (!pos) return raw;
-	const toScreen = (worldP) => {
-		const ndc = worldP.clone().project(camera);
-		return new THREE.Vector2((ndc.x + 1) / 2 * screenSize.width, (1 - ndc.y) / 2 * screenSize.height);
-	};
-	const rawScreen = toScreen(raw);
-	let best = raw;
+function toScreen(world, camera, screenSize) {
+	const ndc = world.clone().project(camera);
+	return new THREE.Vector2((ndc.x + 1) / 2 * screenSize.width, (1 - ndc.y) / 2 * screenSize.height);
+}
+/** Where a hit sits on screen: fat lines report the nearest point on the line separately. */
+function hitPoint(hit) {
+	return hit.pointOnLine ?? hit.point;
+}
+function snapHit(hit, camera, screenSize, snapPixels) {
+	const raw = hitPoint(hit).clone();
+	const candidates = snapCandidates(hit);
+	if (!candidates) return {
+		point: raw,
+		snapped: false
+	};
+	const rawScreen = toScreen(raw, camera, screenSize);
+	let best = {
+		point: raw,
+		snapped: false
+	};
 	let bestPx = snapPixels;
-	for (const idx of indices) {
-		if (idx >= pos.count) continue;
-		const world = new THREE.Vector3().fromBufferAttribute(pos, idx).applyMatrix4(obj.matrixWorld);
-		const px = toScreen(world).distanceTo(rawScreen);
+	for (const local of candidates) {
+		const world = local.applyMatrix4(hit.object.matrixWorld);
+		const px = toScreen(world, camera, screenSize).distanceTo(rawScreen);
 		if (px < bestPx) {
 			bestPx = px;
-			best = world;
+			best = {
+				point: world,
+				snapped: true
+			};
 		}
 	}
 	return best;
 }
+/** Snap a raycast hit to the nearest geometry vertex within `snapPixels` on screen, else the raw hit point. */
+function snapToVertex(hit, camera, screenSize, snapPixels) {
+	return snapHit(hit, camera, screenSize, snapPixels).point;
+}
 function createMeasureTool(deps) {
 	const { canvas, scene, getActiveCamera, getViewTarget, labelLayer, options = {} } = deps;
+	const requestRender = deps.requestRender ?? (() => {});
 	const snapPixels = options.snapPixels ?? DEFAULT_SNAP_PIXELS;
 	const color = new THREE.Color(options.color ?? DEFAULT_COLOR);
-	const fmt = makeFormatter(options.displayUnit);
-	const defaultFormat = (d, delta) => `${fmt(d)}\nΔx ${fmt(delta.x)}  Δy ${fmt(delta.y)}  Δz ${fmt(delta.z)}`;
-	const format = options.format ?? defaultFormat;
+	const format = options.format ?? makeDefaultFormat(makeFormatter(options.displayUnit));
 	const raycaster = new THREE.Raycaster();
 	const pointer = new THREE.Vector2();
 	let enabled = false;
-	const points = [];
-	const markers = [];
-	let line = null;
-	let label = null;
+	let start = null;
+	const measurements = [];
 	const markerMaterial = new THREE.PointsMaterial({
 		color,
 		size: 8,
 		sizeAttenuation: false,
 		depthTest: false
 	});
-	const hoverMaterial = new THREE.PointsMaterial({
+	const hoverSnappedMaterial = new THREE.PointsMaterial({
 		color,
-		size: 11,
+		size: 12,
+		sizeAttenuation: false,
+		depthTest: false
+	});
+	const hoverFreeMaterial = new THREE.PointsMaterial({
+		color,
+		size: 7,
 		sizeAttenuation: false,
 		depthTest: false,
 		transparent: true,
-		opacity: .5
+		opacity: .6
 	});
-	let hoverMarker = null;
-	const showHover = (p) => {
-		if (!p) {
-			if (hoverMarker) hoverMarker.visible = false;
-			return;
-		}
-		if (!hoverMarker) {
-			const geometry = new THREE.BufferGeometry();
-			geometry.setAttribute("position", new THREE.Float32BufferAttribute([
-				0,
-				0,
-				0
-			], 3));
-			hoverMarker = new THREE.Points(geometry, hoverMaterial);
-			hoverMarker.renderOrder = 1e3;
-			hoverMarker.userData.id = "measure";
-			hoverMarker.raycast = () => {};
-			scene.add(hoverMarker);
-		}
-		hoverMarker.position.copy(p);
-		hoverMarker.visible = true;
-	};
-	const makeMarker = (p) => {
+	const tag = (object, renderOrder) => {
+		object.renderOrder = renderOrder;
+		object.userData.id = "measure";
+		object.raycast = () => {};
+		object.frustumCulled = false;
+		return object;
+	};
+	const makePoints = (...ps) => {
 		const geometry = new THREE.BufferGeometry();
-		geometry.setAttribute("position", new THREE.Float32BufferAttribute([
+		geometry.setAttribute("position", new THREE.Float32BufferAttribute(ps.flatMap((p) => [
 			p.x,
 			p.y,
 			p.z
-		], 3));
-		const marker = new THREE.Points(geometry, markerMaterial);
-		marker.renderOrder = 999;
-		marker.userData.id = "measure";
-		marker.raycast = () => {};
-		scene.add(marker);
-		return marker;
-	};
-	const clear = () => {
-		points.length = 0;
-		markers.forEach((m) => {
-			m.geometry.dispose();
-			m.removeFromParent();
-		});
-		markers.length = 0;
-		if (line) {
-			line.geometry.dispose();
-			line.material.dispose();
-			line.removeFromParent();
-			line = null;
-		}
-		label?.remove();
-		label = null;
+		]), 3));
+		const points = tag(new THREE.Points(geometry, markerMaterial), RENDER_ORDER_MARKER);
+		scene.add(points);
+		return points;
 	};
-	const drawMeasurement = () => {
-		if (points.length !== 2) return;
-		const [a, b] = points;
+	const makeLine = (a, b, opacity = 1) => {
 		const geometry = new LineGeometry();
 		geometry.setPositions([
 			a.x,
@@ -1981,33 +2129,102 @@ function createMeasureTool(deps) {
 			b.y,
 			b.z
 		]);
-		const material = new LineMaterial({ color });
+		const material = new LineMaterial({
+			color,
+			transparent: opacity < 1,
+			opacity
+		});
 		material.linewidth = 2;
 		material.depthTest = false;
-		line = new Line2(geometry, material);
-		line.renderOrder = 998;
-		line.userData.id = "measure";
-		line.raycast = () => {};
+		const line = tag(new Line2(geometry, material), RENDER_ORDER_LINE);
 		scene.add(line);
-		const mid = a.clone().add(b).multiplyScalar(.5);
+		return line;
+	};
+	const moveLine = (line, a, b) => {
+		const buffer = line.geometry.attributes.instanceStart.data;
+		buffer.array.set([
+			a.x,
+			a.y,
+			a.z,
+			b.x,
+			b.y,
+			b.z
+		]);
+		buffer.needsUpdate = true;
+	};
+	const disposeLine = (line) => {
+		line.geometry.dispose();
+		line.material.dispose();
+		line.removeFromParent();
+	};
+	const disposePoints = (points) => {
+		points.geometry.dispose();
+		points.removeFromParent();
+	};
+	const labelText = (a, b) => {
 		const delta = new THREE.Vector3(Math.abs(b.x - a.x), Math.abs(b.y - a.y), Math.abs(b.z - a.z));
-		label = labelLayer.addLabel(format(a.distanceTo(b), delta), mid, options.labelClassName);
+		return format(a.distanceTo(b), delta);
 	};
-	const pickPoint = (event) => {
+	const midpoint = (a, b) => a.clone().add(b).multiplyScalar(.5);
+	let hoverMarker = null;
+	let rubberBand = null;
+	let rubberLabel = null;
+	const hidePreview = () => {
+		if (hoverMarker) hoverMarker.visible = false;
+		if (rubberBand) rubberBand.visible = false;
+		rubberLabel?.remove();
+		rubberLabel = null;
+	};
+	const showPreview = (snap) => {
+		if (!snap) {
+			hidePreview();
+			return;
+		}
+		if (!hoverMarker) {
+			hoverMarker = makePoints(new THREE.Vector3());
+			hoverMarker.renderOrder = RENDER_ORDER_HOVER;
+		}
+		hoverMarker.material = snap.snapped ? hoverSnappedMaterial : hoverFreeMaterial;
+		hoverMarker.position.copy(snap.point);
+		hoverMarker.visible = true;
+		if (!start) {
+			if (rubberBand) rubberBand.visible = false;
+			rubberLabel?.remove();
+			rubberLabel = null;
+			return;
+		}
+		if (!rubberBand) rubberBand = makeLine(start.point, snap.point, .7);
+		moveLine(rubberBand, start.point, snap.point);
+		rubberBand.visible = true;
+		const text = labelText(start.point, snap.point);
+		const mid = midpoint(start.point, snap.point);
+		if (rubberLabel) {
+			rubberLabel.setText(text);
+			rubberLabel.setPosition(mid);
+		} else rubberLabel = labelLayer.addLabel(text, mid, options.labelClassName);
+	};
+	const pick = (event) => {
 		const rect = canvas.getBoundingClientRect();
-		pointer.x = (event.clientX - rect.left) / rect.width * 2 - 1;
-		pointer.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+		const cursorX = event.clientX - rect.left;
+		const cursorY = event.clientY - rect.top;
+		pointer.x = cursorX / rect.width * 2 - 1;
+		pointer.y = -(cursorY / rect.height) * 2 + 1;
 		const camera = getActiveCamera();
 		raycaster.setFromCamera(pointer, camera);
-		const threshold = pickThreshold(camera, getViewTarget?.());
+		const threshold = pickThreshold(camera, getViewTarget?.()) * 2;
 		raycaster.params.Line.threshold = threshold;
 		raycaster.params.Points.threshold = threshold;
-		const hits = raycaster.intersectObjects(scene.children, true).filter((i) => i.object.userData.id !== "measure" && i.object.userData.id !== "grid");
-		if (hits.length === 0) return null;
-		return snapToVertex(hits[0], camera, {
+		raycaster.params.Line2 = { threshold: snapPixels / 2 };
+		const screen = {
 			width: rect.width,
 			height: rect.height
-		}, snapPixels);
+		};
+		const cursor = new THREE.Vector2(cursorX, cursorY);
+		for (const hit of raycastVisible(scene, raycaster)) {
+			if (!(hit.object.isMesh && hit.face != null) && toScreen(hitPoint(hit), camera, screen).distanceTo(cursor) > snapPixels) continue;
+			return snapHit(hit, camera, screen, snapPixels);
+		}
+		return null;
 	};
 	let pendingMove = null;
 	let moveRaf = 0;
@@ -2027,42 +2244,104 @@ function createMeasureTool(deps) {
 			const latest = pendingMove;
 			pendingMove = null;
 			if (!enabled || !latest) return;
-			showHover(pickPoint(latest));
+			showPreview(pick(latest));
+			requestRender();
 		});
 	};
+	const handleLeave = () => {
+		cancelPendingMove();
+		hidePreview();
+		requestRender();
+	};
+	const dropStart = () => {
+		if (!start) return;
+		disposePoints(start.marker);
+		start = null;
+	};
+	const clear = () => {
+		dropStart();
+		for (const m of measurements) {
+			disposePoints(m.markers);
+			disposeLine(m.line);
+			m.label.remove();
+		}
+		measurements.length = 0;
+		hidePreview();
+		requestRender();
+	};
+	const cancel = () => {
+		if (start) {
+			dropStart();
+			hidePreview();
+			requestRender();
+		} else clear();
+	};
 	const handleClick = (event) => {
 		if (!enabled) return false;
-		if (points.length === 2) clear();
-		const point = pickPoint(event);
-		if (point === null) return true;
-		points.push(point);
-		markers.push(makeMarker(point));
-		if (points.length === 2) drawMeasurement();
+		cancelPendingMove();
+		const snap = pick(event);
+		if (!snap) return true;
+		if (!start) start = {
+			point: snap.point,
+			marker: makePoints(snap.point)
+		};
+		else if (!snap.point.equals(start.point)) {
+			const a = start.point;
+			const b = snap.point;
+			dropStart();
+			measurements.push({
+				markers: makePoints(a, b),
+				line: makeLine(a, b),
+				label: labelLayer.addLabel(labelText(a, b), midpoint(a, b), options.labelClassName)
+			});
+		}
+		showPreview(snap);
+		requestRender();
 		return true;
 	};
+	const handleKey = (event) => {
+		if (event.key !== "Escape") return;
+		if (event.target?.closest?.("input, textarea, select, [contenteditable]")) return;
+		cancel();
+	};
+	let previousCursor = "";
+	let cancelWarm = null;
+	const setEnabled = (value) => {
+		if (value === enabled) return;
+		enabled = value;
+		if (value) {
+			previousCursor = canvas.style.cursor;
+			canvas.style.cursor = "crosshair";
+			canvas.addEventListener("mouseleave", handleLeave);
+			window.addEventListener("keydown", handleKey);
+			cancelWarm = warmPickIndex(scene);
+		} else {
+			canvas.style.cursor = previousCursor;
+			canvas.removeEventListener("mouseleave", handleLeave);
+			window.removeEventListener("keydown", handleKey);
+			cancelWarm?.();
+			cancelWarm = null;
+			cancelPendingMove();
+			clear();
+		}
+	};
 	return {
-		setEnabled: (value) => {
-			enabled = value;
-			if (!value) {
-				cancelPendingMove();
-				clear();
-				showHover(null);
-			}
-		},
+		setEnabled,
 		isEnabled: () => enabled,
 		handleClick,
 		handleMove,
+		cancel,
 		clear,
 		dispose: () => {
-			cancelPendingMove();
+			setEnabled(false);
 			clear();
-			if (hoverMarker) {
-				hoverMarker.geometry.dispose();
-				hoverMarker.removeFromParent();
-				hoverMarker = null;
-			}
+			if (hoverMarker) disposePoints(hoverMarker);
+			if (rubberBand) disposeLine(rubberBand);
+			hoverMarker = null;
+			rubberBand = null;
 			markerMaterial.dispose();
-			hoverMaterial.dispose();
+			hoverSnappedMaterial.dispose();
+			hoverFreeMaterial.dispose();
 		}
 	};
 }
@@ -3894,6 +4173,8 @@ const initThree = function(canvas, options) {
 		canvas,
 		scene,
 		getActiveCamera,
+		getViewTarget: () => controls.target,
+		requestRender: () => requestRender(),
 		labelLayer,
 		options: {
 			snapPixels: config.measure.snapPixels,