在单击新的多边形时检索已删除的TOPOJSON多边形

时间:2015-07-25 12:46:34

标签: javascript jquery leaflet topojson

我正在尝试使用leaflet topojson 图层创建交互式地图。我想做以下事情:

1 - 当点击某个topojson多边形时,它应该删除。

2 - 当一个人点击另一个多边形时,它应该被删除,之前点击的多边形应该被添加回来。

所以基本上只有一个多边形在任何时候都不存在。 这是地图的代码块:

function addRegions(map) {
    var regionLayer = new L.TopoJSON();
    $.getJSON('map-developmentregions.topo.json').done(addRegionData);

    function addRegionData(topoData){
        regionLayer.addData(topoData);
        regionLayer.addTo(map);
        regionLayer.eachLayer(handleLayer);
    }

    function handleLayer(layer) {  
        layer.setStyle({
            fillColor : getColor(getNewsCount(layer.feature.properties.REGION)),
            weight: 2,
            opacity: 1,
            color: 'white',
            fillOpacity: 1
        });

        layer.on({
            mouseover : enterLayer,
            mouseout: leaveLayer,
            click: clickAction
        });
    }

    //Here's  the code for clickAction... this is where I suppose the code should be placed

    function clickAction(e) {
        var layer = e.target;
        map.removeLayer(layer);
    }
}

到目前为止,这段代码允许我点击topojson多边形来删除它,但是一旦点击了另一个多边形,我就无法想到如何检索以前删除的多边形。

我想我应该将每个多边形与多边形的总数进行比较,并在删除当前单击的多边形之前添加缺少的多边形,但是我无法执行该多边形。

请帮忙。感谢

1 个答案:

答案 0 :(得分:0)

在您的clickAction()功能中,迭代覆盖您的数据层,添加每个功能进行映射。完成后,删除当前功能。

因此,您的点击功能将变为

function clickAction(e) {
    regionLayer.eachLayer(function(layer){
        map.addLayer(layer)
    });
    var layer = e.target;
    map.removeLayer(layer);
}

注意:确保将变量regionLayer范围更改为全局变量,以便在点击功能中进行访问。