Controls

ScaleControl

The ScaleControl component displays a scale bar on the map, providing users with a visual representation of distance.

It adjusts dynamically as users zoom in and out, giving them a clear sense of scale in relation to the map’s content.

This is especially useful in applications where users need to gauge distances, such as in geographical or navigational contexts.

Reference: ScaleControl

Usage

The ScaleControl is easy to add to your map and provides an automatic scale bar that adjusts based on the zoom level and the map’s current viewport.

You can customize its position to suit your application’s layout.

API

Props

The ScaleControl component’s props.

PropDescriptionType
positionA position defintion for the control to be placed, can be in one of the corners of the map. When two or more controls are places in the same location they are stacked toward the center of the map.Optional ControlPosition
maxWidthThe maximum length of the scale control in pixels.Optional number default is 100
unitUnit of the distance ('imperial', 'metric' or 'nautical').Optional Unit default is metric