const directionsService = new google.maps.DirectionsService;
const directionsDisplay = new google.maps.DirectionsRenderer;
let directions = [];
() => {
directionsService,
if (status === 'OK') {
const colors = ['blue', 'red', 'green', 'orange', 'yellow', 'black'];
const responseRoutes = result.routes;
directions.forEach((direction) => {
direction.setMap(null);
});
directions = [];
for (let i = 0; i < responseRoutes.length; i++) {
const directionsOptions = {
directions: result,
routeIndex: i,
polylineOptions: {
strokeColor: colors[i],
strokeWeight: 4,
strokeOpacity: 0.5,
},
};
const newDirection = new google.maps.DirectionsRenderer(directionsOptions);
newDirection.setMap(map);
directions.push(newDirection);
}
}
}
if (status === 'OK') {
let directionsDisplays = []; // создаем массив
for (let i = 0; i < directionsDisplays.length; i++) {
directionsDisplays[i].setMap(null); // очищаем все маршруты в цикле
}
directionsDisplays = []; // до кучи очищаем сам массив, хотя этого и так должно хватить
console.log(directionsDisplays); // выводим наш массив. И он НИ РАЗУ не пустой, а с маршрутами. WTF?!?!
const colors = ['blue', 'red', 'green', 'orange', 'yellow', 'black'];
const responseRoutes = response.routes;
for (let i = 0; i < responseRoutes.length; i++) {
const directionsOptions = {
directions: response,
routeIndex: i,
polylineOptions: {
strokeColor: colors[i],
strokeWeight: 4,
strokeOpacity: 0.5,
},
};
directionsDisplays.push(new google.maps.DirectionsRenderer(directionsOptions));
}
for (let i = 0; i < directionsDisplays.length; i++) {
directionsDisplays[i].setMap(map);
}
}
// код с которого я тыкаю, и при этом не обнуляется ничего
for (let i = 0; i < modesItem.length; i++) {
modesItem[i].addEventListener('click', function () {
calculateAndDisplayRoute(directionsService, directionsDisplay);
});
}
const directionsDisplay = new google.maps.DirectionsRenderer;
if (status === 'OK') {
if(directionsDisplay != null) {
directionsDisplay.setMap(null);
directionsDisplay = null;
}
const colors = ['blue', 'red', 'green', 'orange', 'yellow', 'black'];
const responseRoutes = response.routes;
for (let i = 0; i < responseRoutes.length; i++) {
const DirectionsRendererOption = {
directions: response,
routeIndex: i,
polylineOptions: {
strokeColor: colors[i],
strokeWeight: 4,
strokeOpacity: 0.5,
},
};
directionsDisplay = new google.maps.DirectionsRenderer(DirectionsRendererOption);
}
directionsDisplay.setMap(map);
}
const directionsDisplay = new google.maps.DirectionsRenderer;
function (response, status) {
if (status === 'OK') {
const colors = ['blue', 'red', 'green', 'orange', 'yellow', 'black'];
const responseRoutes = response.routes;
for (let i = 0; i < responseRoutes.length; i++) {
const DirectionsRendererOption = {
directions: response,
routeIndex: i,
polylineOptions: {
strokeColor: colors[i],
strokeWeight: 4,
strokeOpacity: 0.5,
},
};
directionsDisplay.setOptions(DirectionsRendererOption);
directionsDisplay.setMap(map);
}
}
});