javascript - 传单计时器。每秒突出显示不同的城镇(多边形)

Question

我有一张使用 Leaflet 的包含 4 个城镇的 map 。 Mouseover 和 Mouseout 工作正常，但我想要一个计时器，每 5 或 10 秒自动轮流关注每个城镇。我试图在文档中找到一种方法来查找 map 上的所有多边形，然后无限循环到这些多边形中，但我无法单独访问它们以应用函数来突出显示和重置样式。

$.getJSON('./data/mymap.json', function (geojson) {
var geojsonLayer = new L.GeoJSON(geojson, {
    style: function () {
        return {
            color: 'blue'
        }
    },
    onEachFeature: function (feature, layer) {
        layer.on('mouseover', function () {
            this.setStyle({
                color: 'green'
            });
            document.getElementById("mapdetails").innerText = layer.feature.properties.name;
        });
        layer.on('mouseout', function () {
            geojsonLayer.resetStyle(this);
            document.getElementById("mapdetails").innerText = '';
        });
        layer.on('click', function () {
            mymap.fitBounds(arrayBounds);
        });
    }
}).addTo(mymap);

});

function highlightLayer(layerID) {
    mymap._layers['name'+layerID].setStyle(highlight); }

var highlight = {
    'color': '#333333',
    'weight': 2,
    'opacity': 1 };

$(document).ready(function() {

    var layerGroup = L.LayerGroup([polygon]);

    for (var i in this._layers) {
        if (this._layers[i].options.name == 'Mytown') {
            console.log('found');
        }
    }

Answer 1

您必须从 geojsonLayer 调用 everyLayer() 或 getLayers()。

var i = 0;
function highlightLayer(){
   setTimeout(function(){
      geojsonLayer.resetStyle(); //To clear style of all layers
      var layers =  geojsonLayer.getLayers();
      if(layers.length >= i){
         i = 0;
      }
      layers[i].setStyle(highlight);
      i++;
      highlightLayer(); //Restart Timer
   },1000);
}