javascript - 使用传单添加和删除几何坐标图层

Question

我不确定为什么我尝试移除的多边形图层没有被移除:

map.on('zoomend', function(e){
        console.log(map.getZoom());
        //This is going to be a function that gets dynamically built.
        var polygons = L.polygon([
                [43.22519, -107.69348],
                [42.99259, -105.48523],
                [42.26105, -107.7594]
            ]).bindPopup("Potential Geo polygon area of companies with violations.");

        if(map.getZoom() >= 5){ map.removeLayer(geojson); }//order matters
        if(map.getZoom() == 5){
            geojson = L.geoJson(statesData, {
                style: style,
                onEachFeature: onEachFeature
            }).addTo(map);

        }
        if(map.getZoom() == 7){
            if(map.hasLayer(polygons)){
                console.log("TEst");
            }
            map.removeLayer(polygons); 
        }
        if(map.getZoom() == 6){         
            map.addLayer(polygons);
        }
    });

因此，可以使用 addTo() 和 removeLayer() 函数轻松删除和添加 choropleth (geojson) 层。但是，多边形变量不是这种情况。有谁知道为什么吗？

map.hasLayer(polygons) 行没有打印到控制台，表明多边形不是一个图层。如果是这样，那么 L.polygon() 中的 L 应该是什么？

提前致谢。

Answer 1

那是因为多边形不是 Leaflet 层，而是 an extension of the Path class .它从不从 Layer Group class 继承 .removeLayer() 方法.相反，它可以像这样删除:

window.map.removeLayer(polygon);

重构代码片段以考虑到这一点我们得到

map.on('zoomend', function(e){
        console.log(map.getZoom());
        //This is going to be a function that gets dynamically built.
        var polygons = L.polygon([
                [43.22519, -107.69348],
                [42.99259, -105.48523],
                [42.26105, -107.7594]
            ]).bindPopup("Potential Geo polygon area of companies with violations.");

        if(map.getZoom() >= 5){ map.removeLayer(geojson); }//order matters
        if(map.getZoom() == 5){
            geojson = L.geoJson(statesData, {
                style: style,
                onEachFeature: onEachFeature
            }).addTo(map);

        }
        if(map.getZoom() == 7){
            if(map.hasLayer(polygons)){
                console.log("TEst");
            }
            window.map.removeLayer(polygon);
        }
        if(map.getZoom() == 6){         
            polygons.addTo(map)
        }
    });

另一种方法是使用 geojson.io使用多边形纬度、经度数组创建一些 geoJSON，如果您更喜欢 removeLayer() 方法，然后使用 L.geoJson 方法将它们添加到 map 。

此外，您可以通过浏览器的 JavaScript 控制台捕获和调试其中的许多错误。这是来自 Code School 的优秀类(class)帮助您更好地使用 Chrome 的控制台来了解 JavaScript 错误。