传单删除以前的折线

时间:2017-01-27 09:04:07

标签: javascript jquery maps leaflet

我有一个函数可以在click事件上重新创建折线。它工作但刷新层仍然得到以前的折线。只有当我缩放地图时,前一条折线才会消失。

我的代码。

function buildHotline(response) {
    //clearMap();
    //clear_polyline();
    document.getElementById('mapid').innerHTML = "<div id='map' style='width: 100%; height: 100%;'></div>";
    //document.getElementById('map').innerHTML = "<div id='mapid' style='width: 100%; height: 100%;'></div>";
    var tiles = L.tileLayer('http://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png', {
    attribution: 'Tiles courtesy of <a href="http://openstreetmap.se/" target="_blank">OpenStreetMap Sweden</a> &mdash; Map data &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'});


    var map = new L.map('map', {
        layers: [tiles],
        scrollWheelZoom: true,
        dragging: true,
        tap: false
    });


    var hotlineLayer = L.hotline(response, {
        min: 0,
        max: 120,
        palette: {
            0.0: '#3ebcef',
            0.5: '#78b3d3',
            1.0: '#000203'
        },
        weight: 5,
        outlineColor: '#000203',
        outlineWidth: 1
    });



    //clear first
    clear_polyline();

    bounds = hotlineLayer.getBounds();
    map.fitBounds(bounds);



    hotlineLayer.addTo(map);


    function clear_polyline() {
        try {
            // statements
            setTimeout(function(){ map.invalidateSize()}, 400);
            //alert("erase line");
            map.removeLayer( hotlineLayer );

        } catch(e) {
            // statements
            console.log(e);
        }

    }

}

在创建新折线之前,我必须先在clear_polyline清除它。感谢

1 个答案:

答案 0 :(得分:0)

hotlineLayer 的引用放在<{1}}函数的范围之外,以便该函数的多次运行可以引用buildHotline()的同一个实例

然后,检查它是否未定义,如果不是,则将其删除,然后重新分配新构建的实例。

即:

hotlineLayer

另见How to remove L.rectangle(boxes[i]),因为解决方案非常相似。