Leaflet-带有 GeoJson 和多个标记的实时插件
Leaflet-Realtime plugin with GeoJson and multiple markers
大家好,我正在尝试更新我的标记位置,但我不知道如何删除旧标记。我得到的只是标记的 "history" 。我没有任何可以帮助我的例子。我希望有人能给我一个线索继续下去。
非常感谢 Per Liedman 的出色工作。
var shipLayer = L.layerGroup();
var ships = L.icon({
iconUrl: '../icons/ship-icon.png',
iconSize: [30, 30]
});
var realtime = L.realtime({
url: 'jsonServlet/ships.json',
crossOrigin: true,
type: 'json'
}, {
interval: 5 * 1000,
pointToLayer: function (feature, latlng) {
marker = L.marker(latlng, {icon: ships});
marker.bindPopup('mmsi: ' + feature.properties.mmsi +
'<br/> course:' + feature.properties.hdg+
'<br/> speed:' + feature.properties.sog);
marker.addTo(shipLayer);
return marker;
}
});
controlLayers.addOverlay(geojson, 'Ships');
默认情况下 L.realtime 使用功能的 id
属性 来更新它。正如您在评论中解释的那样,您的船只的标识符在 GeoJSON 功能的 mmsi
属性 中并且没有 id
。您需要将此添加到 options
中的 L.realtime 设置中:
getFeatureId: function(featureData){
return featureData.properties.mmsi;
}
大家好,我正在尝试更新我的标记位置,但我不知道如何删除旧标记。我得到的只是标记的 "history" 。我没有任何可以帮助我的例子。我希望有人能给我一个线索继续下去。 非常感谢 Per Liedman 的出色工作。
var shipLayer = L.layerGroup();
var ships = L.icon({
iconUrl: '../icons/ship-icon.png',
iconSize: [30, 30]
});
var realtime = L.realtime({
url: 'jsonServlet/ships.json',
crossOrigin: true,
type: 'json'
}, {
interval: 5 * 1000,
pointToLayer: function (feature, latlng) {
marker = L.marker(latlng, {icon: ships});
marker.bindPopup('mmsi: ' + feature.properties.mmsi +
'<br/> course:' + feature.properties.hdg+
'<br/> speed:' + feature.properties.sog);
marker.addTo(shipLayer);
return marker;
}
});
controlLayers.addOverlay(geojson, 'Ships');
默认情况下 L.realtime 使用功能的 id
属性 来更新它。正如您在评论中解释的那样,您的船只的标识符在 GeoJSON 功能的 mmsi
属性 中并且没有 id
。您需要将此添加到 options
中的 L.realtime 设置中:
getFeatureId: function(featureData){
return featureData.properties.mmsi;
}