Отображать слои полигонов в соответствии с уровнем масштабирования карты и кликами - PullRequest
Новая
       10

Отображать слои полигонов в соответствии с уровнем масштабирования карты и кликами

1 голос
/ 03 мая 2019

Итак, у меня есть карта OpenStreetMap (с Leaflet), и я поместил слой javascript для Европы (я вставил Id в javascript для разграничения всех стран). Каждая страна выделяется, когда я наводю на нее мышью. Когда я нажимаю на страну, она автоматически масштабируется.

И мне бы хотелось, чтобы при нажатии на страну слой страны исчезал (в соответствии с уровнем масштабирования) (но другие страны должны оставаться «наслоенными». (Зная, что после этого я попытается поместить маркеры в страну, которая будет отображаться только в том случае, если слой страны исчезнет, ​​и где мы можем увеличить его, щелкнув по нему).

Ps: Я следил за этим сайтом, чтобы сделать то, что у меня есть в данный момент: https://leafletjs.com/examples/choropleth/

И мой код: https://jsfiddle.net/Gio687351/3bwsnu8z/2/

map.on('zoomend ', function(e) {
    if (map.getZoom() < 3) {
        map.fitBounds(layer.getBounds())
        map.removeLayer(Europe-Layer.js)
        map.setStyle({
            'fillOpacity': '0.7'
        });
    } else if (map.getZoom() >= 3) {
        map.fitBounds(layer.getBounds())
        map.addLayer(statesData);
        map.setStyle({
            'fillOpacity': '0.0'
        });
    }
});

1 Ответ

0 голосов
/ 05 мая 2019

Видимость слоя может управляться с помощью fill-opacity и opacity свойств стиля , как показано ниже: 

function toggleLayerVisibility(map, layer) {
  if (selectedLayerId) {
    geojson.resetStyle(layer);
    selectedLayerId = null;
  } else {
    //hide a layer
    layer.setStyle({
      opacity: 0,
      fillOpacity: 0.0
    });
    selectedLayerId = layer._leaflet_id; //save identifier of a selected layer
  }
}

Пояснение:

  • настройка opacity: 0 и fillOpacity: 0 скрывает слой
  • selectedLayerId используется для хранения идентификатора текущего выбранного слоя

Учитывая предоставленный пример, после демонстрации демонстрирует, как скрыть слой, по которому щелкнули,

...