删除传单上的特定标记不是一个功能

时间:2016-12-22 04:58:23

标签: javascript leaflet openstreetmap marker

我根据Leaflet和OSM创建了一个地图,我为每个标记创建了一个弹出窗口,其中包含一个删除相应标记的按钮,但它不起作用。我尝试使用地图,图层和标记属性删除要素并删除标记函数,但每一个都返回它不是函数。任何帮助表示赞赏。

这是我的代码:

<script type="text/javascript">
    var count = 0; 
    var map, layer, marker = [];

    function selesai(){
        alert(count);
        marker[count].removeMarker();
        location.reload();
        $.ajax({
            url: "{{url('mapdata')}}/"+count,
            data: {},
            dataType: 'json',
            type:'get',
            success:function(data) {
                initMap2(data);
            }
        });
    }

    function initMap(data){
        var locations = data;

        map = L.map( 'osmap_page', {
            center: [locations[locations.length-1][2], locations[locations.length-1][3]],
            zoom: 18
        });

        layer = L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>',
            subdomains: ['a','b','c']
        }).addTo( map );

        for ( var i=0; i < locations.length; i++) {

            if (locations[i][0] == 'panic') {
                var icon = L.icon({iconUrl:"{{asset('assets/splash4.gif')}}", iconAnchor: new L.Point(36,41), popupAnchor: new L.Point(-5, -45) });

                marker[i] = L.marker( [locations[i][2], locations[i][3]], {icon: icon});
                marker[i].bindPopup('<div id="content">'+
        '<h3 style="color:red; text-align:center;">Panic</h3>'+
        '<div id="bodyContent">'+
        '<p> Nama : ' + locations[i][5] + " <br> Email : " + locations[i][6] + " <br> Nomor HP : " + locations[i][7] + " <br><br> Lokasi : " + locations[i][4] + " <br> Waktu : " + locations[i][1]+ '</p>'+
        '</div>'+ '<button type="button" class="btn btn-warning btn-xs" onclick="proses()">Proses</button>'+ '<div class=pull-right><button type="button" class="btn btn-success btn-xs" onclick="selesai()">Selesai</button></div>'+
        '</div>').addTo( map );

                if(i == locations.length - 1){
                    count = i;
                    map.setView(new L.LatLng(locations[i][2], locations[i][3]), 18);
                    marker[i].bindPopup('<div id="content">'+
        '<h3 style="color:red; text-align:center;">Panic</h3>'+
        '<div id="bodyContent">'+
        '<p> Nama : ' + locations[i][5] + " <br> Email : " + locations[i][6] + " <br> Nomor HP : " + locations[i][7] + " <br><br> Lokasi : " + locations[i][4] + " <br> Waktu : " + locations[i][1]+ '</p>'+
        '</div>'+ '<button type="button" class="btn btn-warning btn-xs" onclick="proses()">Proses</button>'+ '<div class=pull-right><button type="button" class="btn btn-success btn-xs" onclick="selesai()">Selesai</button></div>'+
        '</div>').openPopup().addTo( map );
                }

            } else {
                var icon2 = L.icon({iconUrl:"{{asset('assets/opmarkerblue2.png')}}", iconAnchor: new L.Point(0,40), popupAnchor: new L.Point(10, -36)});
                marker[i] = L.marker( [locations[i][2], locations[i][3]], {icon: icon2});

                marker[i].bindPopup('<div id="content">'+
        '<h3 style="color:blue; text-align:center;">Peristiwa</h3>'+
        '<div id="bodyContent">'+
        '<p> Nama : ' + locations[i][5] + " <br> Email : " + locations[i][6] + " <br> Nomor HP : " + locations[i][7] + " <br><br> Lokasi : " + locations[i][4] + " <br> Waktu : " + locations[i][1]+ '</p>'+
        '</div>'+ '<button type="button" class="btn btn-warning btn-xs" onclick="proses()">Proses</button>'+ '<div class=pull-right><button type="button" class="btn btn-success btn-xs" onclick="selesai()">Selesai</button></div>'+
        '</div>').addTo( map );

                if(i == locations.length - 1){
                    count = i;
                    map.setView(new L.LatLng(locations[i][2], locations[i][3]), 18);
                    marker[i].bindPopup('<div id="content">'+
        '<h3 style="color:blue; text-align:center;">Peristiwa</h3>'+
        '<div id="bodyContent">'+
        '<p> Nama : ' + locations[i][5] + " <br> Email : " + locations[i][6] + " <br> Nomor HP : " + locations[i][7] + " <br><br> Lokasi : " + locations[i][4] + " <br> Waktu : " + locations[i][1]+ '</p>'+
        '</div>'+ '<button type="button" class="btn btn-warning btn-xs" onclick="proses()">Proses</button>'+ '<div class=pull-right><button type="button" class="btn btn-success btn-xs" onclick="selesai()">Selesai</button></div>'+
        '</div>').openPopup().addTo( map );
                }
            }
        }
        $("#start").click(function() {
            timer = setInterval(fetch2, 3000); 
        });

        $("#stop").click(function() {
            if(timer){
                clearInterval(timer);
                timer = null
            }
        });
    }

</script>

请记住,问题源于函数selesai,其中包含删除标记,但它不是函数错误。 Selesai本身通过点击标记弹出窗口中的Selesai按钮来实现。

1 个答案:

答案 0 :(得分:0)

我已经得到了答案,在修补可能性之后,答案很简单:

map.removeLayer(marker[count]);

我需要将其定义为标记[count]以指定我应删除的标记。欢呼声。