Как переключаться между слоями с помощью элемента управления? - PullRequest
0 голосов
/ 14 мая 2019

Я перехожу от использования Leaflet API к ознакомлению с Mapbox GL JS. Я добавил слои геоджонов на свою карту и хочу, чтобы эти слои были моими базовыми слоями, поскольку они не могут одновременно отображаться на карте вместе. Я хочу, чтобы слои были взаимоисключающими. В Leaflet это было довольно просто. Вы использовали метод L.control.layers для создания групп слоев. Листовка затем дифференцируется между базовыми слоями и накладками Я не могу найти эквивалент этого с Mapbox Gl JS. В примерах Mapbox Gl JS есть пример переключения между слоями, но он не так прост, как методы Leaflet.

В примере Mapbox Gl Js используется этот код, но он не позволяет выбору слоя быть взаимоисключающим. Должен ли я по-прежнему использовать API листовки даже при переходе на Mapbox Gl Js?


for (var i = 0; i < toggleableLayerIds.length; i++) {
  var id = toggleableLayerIds[i];

  var link = document.createElement('a');
  link.href = '#';
  link.className = 'active';
  link.textContent = id;

  link.onclick = function (e) {
  var clickedLayer = this.textContent;
  e.preventDefault();
  e.stopPropagation();

  var visibility = map.getLayoutProperty(clickedLayer, 'visibility');

  if (visibility === 'visible') {
  map.setLayoutProperty(clickedLayer, 'visibility', 'none');
  this.className = '';
  } else {
  this.className = 'active';
  map.setLayoutProperty(clickedLayer, 'visibility', 'visible');
  }
  };

  var layers = document.getElementById('menu');
  layers.appendChild(link);
  }
...