<MeasureTool />

<MeasureTool /> adds a ruler button to the visualizer dashboard. When active, clicking two points in the scene draws a line between them and displays the distance in meters. A settings popover lets you constrain measurement to any combination of the X, Y, and Z axes — useful for measuring along a single axis without snapping perfectly to it.

Usage

Mount <MeasureTool /> anywhere inside <Visualizer />:

<script lang="ts">
	import { Visualizer } from '@viamrobotics/motion-tools'
	import { MeasureTool } from '@viamrobotics/motion-tools/plugins'
</script>

<div class="h-screen w-screen">
	<Visualizer>
		<MeasureTool />
	</Visualizer>
</div>

Interaction

1. Click the ruler button to enter measure mode (sets interactionMode to measure).
2. Click a first point on any geometry or point-cloud surface.
3. Click a second point — the distance label appears at the midpoint.
4. Click again to clear and start over.

Measurement state also clears whenever the focused entity changes or the tool is toggled off.

Axis constraints

Open the filter popover next to the ruler button to lock the second point to a subset of axes. Disabling an axis pins that coordinate to the first point’s value, so you can measure pure horizontal distance, pure vertical distance, or any combination.