Currently using Leaflet version 1.0.3 and encountering an issue with GPS positions on my map.
Within a for loop, I am creating circle markers for each GPS position:
var position = new L.latLng(lat, lng);
coordinates.push(position);
L.circle([lat, lng], 50, {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5
}).addTo(map).bindPopup(date.replace('T',' '));
Performance is not an issue with thousands of positions, it runs smoothly. However, when I introduce a polyline within the same loop connecting two circle markers like this:
var polyline = new L.Polyline(coordinates, {
color: 'red',
weight: 3,
opacity: 0.5,
smoothFactor: 5
});
polyline.addTo(map);
Performance significantly decreases and becomes very slow. The challenge arises when there are no positions between a range of time, necessitating the use of a polyline for visual continuity.
Looking for a solution to improve performance in this particular scenario. Any suggestions would be greatly appreciated. Thank you!