Hello everyone,
I need to draw a polyline connecting several points while also placing markers at each point on the map. I've been able to add markers individually and create a polyline individualy, but I'm struggling to figure out how to combine both in the same flow effectively.
Has anyone successfully implemented this? I'm looking for guidance or an example flow that shows how to draw a polyline and place markers at each vertex of the polyline on the Worldmap.
Any tips or suggestions on how to approach this would be greatly appreciated!
Thanks in advance!
Each marker needs a unique name so you will need to create both the line as one item and then an array of markers for the markers and send them both to the map.
-
Thanks for the response !.The issue is I'm able to draw polyline along with markers but cant able to remove respective marker once the user clears.Only the respective line is cleared marker stays
-
Below attached the code for reference
let coordinates = msg.payload; // The array of lat/lon pairs from the client
// Construct the polyline object
let polyline = {
"name": "server_locations",
"line": coordinates,
};
// Construct markers for each coordinate
let markers = coordinates.map((coord, index) => {
return {
"name": `Server ${index + 1}`, // Unique name for each marker
"lat": coord[0], // Latitude
"lon": coord[1], // Longitude
"icon": "server",
"deleted:"true"
};
});
// Combine polyline and markers into one payload
msg.payload = [ polyline,...markers];
// Return the modified msg payload to the map
return msg;
- Can you suggest any idea reagarding this,It should be greatly appreciated.
You may need to return/send two messages - one to delete the line and one to delete all the markers... or you may be able to add the line to the array of points and send it all as one (not tried/tested)