Is it possible to add a scale bar to a map?
I was hoping for something 'built in' like:
map.addControl(new mapboxgl.Scale({position: 'bottom-right'}));
Seems it was possible via a leaflet control in the classic js
L.control.scale().addTo(map);
The scale bar should shorter than the map itself. The largest distance (represented by the overall length of the scale bar) should be a round number, for example 1,000, and the subdivisions distances should be 50%, 25%, or 20% of that length.
Scale bars, or bar scales, are small graphics that indicate the proportions of a map to the original geographic area and help users measure distances on maps. While scale can be indicated as a ratio or in words (i.e. 1:10, or “One inch to ten miles”), scale bars allow users to measure distances in maps directly.
map.addControl(new mapboxgl.ScaleControl({position: 'bottom-right'}));
The documentation can be found here
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With