mirror of
https://github.com/home-assistant/frontend.git
synced 2026-09-28 16:04:00 +01:00
* Load MapLibre RTL text plugin so Hebrew and Arabic map labels read correctly The vector base map never registered MapLibre's RTL text plugin, so right-to-left scripts were shaped left to right and every label came out reversed. Ship @mapbox/mapbox-gl-rtl-text from /static/map/ alongside the glyphs (no third-party host) and register it once, lazily, before the first vector layer is created. Fixes #53851 * Add the English name to map labels in non-Latin scripts Before the move to vector tiles the CARTO basemap showed English names everywhere. The OSM style shows local names, which most users cannot read in Cyrillic, Arabic, Hebrew or CJK regions. Keep the local name and add the English one from the tiles under it - in parentheses for street labels, which cannot break lines. Latin-script names are left alone, so Köln stays Köln.
43 lines
1.2 KiB
JavaScript
43 lines
1.2 KiB
JavaScript
// Adds the English name to labels whose local name is not in Latin script.
|
|
// Shortbread tiles carry `name`, `name_en` and `name_de` only.
|
|
|
|
const NAME = ["get", "name"];
|
|
const NAME_EN = ["get", "name_en"];
|
|
|
|
// Strings compare by code point: anything from Basic Latin up to Latin
|
|
// Extended-B, digits and punctuation included.
|
|
const IS_LATIN = ["<", NAME, "ɐ"];
|
|
|
|
const ENGLISH_SCALE = 0.8;
|
|
|
|
// Streets are line-placed and cannot break lines.
|
|
const withEnglish = (placement) =>
|
|
placement === "line"
|
|
? ["concat", NAME, " (", NAME_EN, ")"]
|
|
: ["format", NAME, {}, "\n", {}, NAME_EN, { "font-scale": ENGLISH_SCALE }];
|
|
|
|
const isNameLabel = (layer) =>
|
|
JSON.stringify(layer.layout?.["text-field"]) === JSON.stringify(NAME);
|
|
|
|
export const addLatinLabels = (style) => ({
|
|
...style,
|
|
layers: style.layers.map((layer) =>
|
|
isNameLabel(layer)
|
|
? {
|
|
...layer,
|
|
layout: {
|
|
...layer.layout,
|
|
"text-field": [
|
|
"case",
|
|
IS_LATIN,
|
|
NAME,
|
|
["!", ["has", "name_en"]],
|
|
NAME,
|
|
withEnglish(layer.layout["symbol-placement"]),
|
|
],
|
|
},
|
|
}
|
|
: layer
|
|
),
|
|
});
|