So I checked previous questions regarding this, which all relate to V2, which is of no help.
So, I create two markers, save them in an array as markers[to] and markers[from]
And then add them with this
function route(){
for(var key in markers) {
flightPlanCoordinates.push(markers[key].position);
}
flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
strokeColor: #FF0000,
strokeOpacity: 1.0,
strokeWeight: 2
});
flightPath.setMap(map);
}
Brilliant.
But. Next time I use it (With new markers in the array) it just adds a polyline there without removing the previous one.
I seem to have tried everything, removing from the first array, the flightPath, setMap(null) and so forth.
What's the correct way to remove the previous line before drawing a new one?
EDIT: SOLVED
Solution
function route(){
var flightPlanCoordinates = [];
for(var key in markers) {
flightPlanCoordinates.push(markers[key].position);
}
if(flightPath) {
flightPath.setPath(flightPlanCoordinates);
} else {
flightPath = new google.maps.Polyline({
path: flightPlanCoordinates,
strokeColor: #FF0000,
strokeOpacity: 1.0,
strokeWeight: 2
});
flightPath.setMap(map);
}
}
Reason:
flightPlanCoordinates needs to be initialized within the scope, this resets the array every time it is used, cleaning it out properly. (Also thanks for the input below to make the code a bit nicer.