Support RTL languages on map

traccar · May 12, 2024 · bac808e · bac808e
1 parent b32a43a
commit bac808e
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 0 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,6 +9,7 @@
     "@emotion/styled": "^11.11.5",
     "@fontsource/roboto": "^5.0.12",
     "@mapbox/mapbox-gl-draw": "^1.4.3",
+    "@mapbox/mapbox-gl-rtl-text": "^0.2.3",
     "@maplibre/maplibre-gl-geocoder": "^1.5.0",
     "@mui/icons-material": "^5.15.15",
     "@mui/lab": "^5.0.0-alpha.170",

diff --git a/src/map/core/MapView.jsx b/src/map/core/MapView.jsx
@@ -1,5 +1,6 @@
 import 'maplibre-gl/dist/maplibre-gl.css';
 import maplibregl from 'maplibre-gl';
+import mapboxglRtlTextUrl from '@mapbox/mapbox-gl-rtl-text/mapbox-gl-rtl-text.min.js?url'
 import React, {
   useRef, useLayoutEffect, useEffect, useState,
 } from 'react';
@@ -14,6 +15,8 @@ element.style.width = '100%';
 element.style.height = '100%';
 element.style.boxSizing = 'initial';
 
+maplibregl.setRTLTextPlugin(mapboxglRtlTextUrl);
+
 export const map = new maplibregl.Map({
   container: element,
   attributionControl: false,