javascript - 如何在传单上实时在每个点上用标记制作线串？(How do I make line string in leaflet-realtime with marker on every point?)

Question

I want something like below image:(我想要下图所示的内容：)

Don't know where to define linestring.(不知道在哪里定义线串。) It would be great if anyone can guide me.(如果有人可以指导我，那就太好了。) Moreover I want to change the color of linestring.(此外，我想更改线串的颜色。) Here is my code:-(这是我的代码：) function createRealtimeLayer(url, container) { return L.realtime(url, { interval: 5 * 1000, getFeatureId: function(f) { return f.properties.id; }, cache: true, container: container, onEachFeature(f, l) { date = f.properties.date; l.bindPopup(date); l.on("mouseover", function () { l.openPopup(); }); l.on("mouseout", function () { l.closePopup(); }); } }); } realtime1 = createRealtimeLayer('getPosition').addTo(map), realtime2 = createRealtimeLayer('getUserPositionHistory').addTo(map); L.control.layers(null, { 'Current': realtime1, 'History': realtime2 }).addTo(map); realtime1.once('update', function() { map.fitBounds(realtime1.getBounds(), {maxZoom: 18}); });   ask by Alia Jain translate from so

Answer 1

To set the markers on every point add this to your onEachFeature:(要在每个点上设置标记，请将其添加到onEachFeature中：)

if(layer instanceof L.Path){ l.getLatLngs().forEach(function(latlng){ L.marker(latlng).addTo(map); }) } if you want to colorize your line, you have to split up your line like that, but then append not the geojson layer to the map:(如果要给线着色，则必须像这样将线分开，但不要在地图上附加geojson图层：) if(layer instanceof L.Path){ var lastlatlng = null; layer.getLatLngs().forEach(function(latlng, i){ if(lastlatlng !== null){ L.polyline([lastlatlng,latlng],{color: getColor(i)}).addTo(map); } lastlatlng = latlng; }) } https://jsfiddle.net/falkedesign/bw290evz/(https://jsfiddle.net/falkedesign/bw290evz/)