aboutsummaryrefslogtreecommitdiff
path: root/modern/src/map/MapScale.js
diff options
context:
space:
mode:
Diffstat (limited to 'modern/src/map/MapScale.js')
-rw-r--r--modern/src/map/MapScale.js34
1 files changed, 34 insertions, 0 deletions
diff --git a/modern/src/map/MapScale.js b/modern/src/map/MapScale.js
new file mode 100644
index 00000000..c8a724c9
--- /dev/null
+++ b/modern/src/map/MapScale.js
@@ -0,0 +1,34 @@
+import maplibregl from 'maplibre-gl';
+import { useEffect, useMemo } from 'react';
+import { useAttributePreference } from '../common/util/preferences';
+import { map } from './core/MapView';
+
+const MapScale = () => {
+ const distanceUnit = useAttributePreference('distanceUnit');
+
+ const control = useMemo(() => new maplibregl.ScaleControl(), []);
+
+ useEffect(() => {
+ map.addControl(control, 'bottom-right');
+ return () => map.removeControl(control);
+ }, [control]);
+
+ useEffect(() => {
+ switch (distanceUnit) {
+ case 'mi':
+ control.setUnit('imperial');
+ break;
+ case 'nmi':
+ control.setUnit('nautical');
+ break;
+ case 'km':
+ default:
+ control.setUnit('metric');
+ break;
+ }
+ }, [control, distanceUnit]);
+
+ return null;
+};
+
+export default MapScale;