【问题标题】:Update geolocation marker instead of adding new one with leaflet api更新地理位置标记,而不是使用传单 api 添加新的标记
【发布时间】:2015-05-06 17:13:41
【问题描述】:

每次位置更新时,它都会放置一个新标记,而不是移动现有标记。我只想在屏幕上放置一个标记,而不是每次应用程序更新其位置时放置一个新标记(忽略最大年龄和频率,我正在测试一些东西,我知道它们不是问题)。提前致谢。

(加载地图的代码)

    function onLocationFound(e) {

                                var marker= L.icon({iconUrl: 'greendot.png'});
    var radius = e.accuracy /2;

    L.marker(e.latlng, {icon: marker}).addTo(map).bindPopup("You are within " + radius + " meters from this point").openPopup();



                                  }

    function onLocationError(e) {
        alert(e.message);
    }


    map.on('locationfound', onLocationFound);
    map.on('locationerror', onLocationError);

    map.locate({watch: true, setView: true, maxZoom: 16, enableHighAccuracy: true, maximumAge:10000, frequency: 1});

编辑:我尝试了几种解决方案,但标记仍然没有移动,它只是添加了一个新的。有什么想法吗?

【问题讨论】:

    标签: geolocation


    【解决方案1】:

    您可以更新现有标记,而不是每次都创建一个新标记:

    var marker = L.icon({iconUrl: 'greendot.png'});
    var movingMarker = L.marker([0,0], 0, {icon: marker}).addTo(map);
    
    function onLocationFound(e) {
        var radius = e.accuracy /2;
        movingMarker.setLatLng(e.latlng);
        movingMarker.unbindPopup();
        movingMarker.bindPopup("You are within " + radius + " meters from this point")
        movingMarker.redraw();
    }
    
    function onLocationError(e) {
        alert(e.message);
    }
    
    map.on('locationfound', onLocationFound);
    map.on('locationerror', onLocationError);
    
    map.locate({watch: true, setView: true, maxZoom: 16, enableHighAccuracy: true, maximumAge: 10000});
    

    我刚刚发现了一个类似的问题(有类似的答案):update marker location with leaflet API

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2020-05-30
      • 1970-01-01
      • 1970-01-01
      • 2017-04-24
      • 1970-01-01
      • 2023-02-16
      • 1970-01-01
      相关资源
      最近更新 更多