lipu ma li toki pona

by tbodt

HTML

<script src="https://unpkg.com/maplibre-gl/dist/maplibre-gl.js"></script>
<link href="https://unpkg.com/maplibre-gl/dist/maplibre-gl.css" rel="stylesheet" />

<form id="langform"><!--<p><input type="text" id="lang" placeholder="en"><input type="submit"></p>--></form>
<div id="map" style="width: 100%; height: 500px"></div>

JavaScript

const map = new maplibregl.Map({
  style: 'https://tiles.openfreemap.org/styles/liberty',
  center: [0, 30],
  zoom: 1,
  container: 'map',
})
function oKepekenToki(nimiToki) {
  console.log(map.getLayersOrder());
  for (let layer of map.getLayersOrder()) {
    console.log(layer);
    try {
      let label = map.getLayoutProperty(layer, 'text-field');
      if (label[0] == 'to-string') continue;
      let separator = layer.includes('line') || layer.includes('highway') ? ' ' : '\n';
      const parts = [
        ['get', `name_${nimiToki}`],
        ['get', `name:${nimiToki}`],
        ['get', 'name'],
      ]
      label = [
        'case',
        ['has', 'name:nonlatin'],
        ['concat', ['get', 'name:latin'], separator, ['get', 'name:nonlatin']],
        ['coalesce', ...parts],
      ];
      console.log(label);
      map.setLayoutProperty(layer, 'text-field', label);
    } catch (e) {
      console.error(e);
    }
  }
}
langform.addEventListener('submit', (e) => {
  e.preventDefault();
  oKepekenToki(lang.value);
})
map.on('styledata', () => oKepekenToki('tok'));