FEATURE · UTILITY

Measure without leaving a trace.Measure without leaving a trace.

Press M, click to drop measurement points, read distance or area in the overlay. Nothing gets added to your feature collection.

Try itTry it

Open in full playground →

Measuring isn't drawingMeasuring isn't drawing

Every map editor has a drawing tool for lines. And every user has discovered that drawing a line to measure its length then leaves that line behind — now they have to delete it, which means selecting it, which means exiting the tool. The mental model is wrong.

Element Editor's measure tool doesn't draw features. Finished measurements stay on the map as overlays until you remove them, and they never enter your feature collection. Your data stays exactly as you left it.

How it worksHow it works

1. Press M to enter measure mode. The measure bar offers Distance (the default) and Area (the hexagon).
2. Click on the map to drop the first point.
3. Click again to add a second point — the distance between them shows on the line.
4. Keep clicking to build a multi-segment line. The overlay sums the total distance.
5. For area, pick the hexagon first, then click the corners. The overlay shows the enclosed area as you go.
6. Double-click or press Enter to finish. The measurement stays on the map until you remove it.
7. Esc leaves measure mode and drops any unfinished points.

Lengths in metres / kilometres by default, switching to feet / miles when the units are set to imperial. Areas in square metres, scaling to hectares or square kilometres (or acres / square miles) as appropriate. Both follow config.units and the user's settings override.

Distance and areaDistance and area

Distance — the default mode. The sum of great-circle distances between consecutive measurement points. Calculated using Turf's distance. Accurate within geodetic precision — the Earth's curvature is accounted for even over short segments.

Area — pick the hexagon in the measure bar and click at least three corners. The shape closes itself, so there's no need to click back on the first point. Calculated via Turf's area on a sphere with the WGS84 radius. Produces real square metres, not projected pixel-area-with-wrong-units.

Show it in codeShow it in code

Measure mode is entirely UI-driven. There's no onMeasure callback — measurements don't change feature state, so there's nothing for your app to listen to. If you need to capture a measurement programmatically, use the drawing tools instead and read the resulting GeoJSON.

If you want to restrict whether measure is available to your users, drop it from the tools list:

import { ElementEditor } from '@element-editor/react'

export default function App() {
  return (
    <ElementEditor
      config={{
        // Omit 'measure' from the allowed tools to hide the toolbar button
        // and the M shortcut.
        tools: ['polygon', 'line', 'point', 'rectangle', 'circle'],
      }}
    />
  )
}

Things to know before you shipThings to know before you ship

• Measure doesn't touch your data. Finished measurements are overlays, not features. Remove one with its delete button (or select it and press Del), and ⌘Z undoes it like any edit. You never need to clean up a stray measurement feature.
• Unit display is configurable. Set config.units.length and config.units.area to 'metric', 'imperial', or 'auto'. Users can override via the settings panel — the choice persists in localStorage. Switching units changes only the display, never the underlying number.
• Area is measured on the globe. Real geodesic area, not pixel area or Mercator-projected area. A 1 km² polygon reads as 1 km² regardless of latitude.

Works withWorks with

• Drawing — the drawing tools produce features; the measure tool produces read-outs.
• Geometry processing — measure before and after simplification to see the effect.

Ready to measure?Ready to measure?

Open in playground →

Read the docs · See all features