Google 지도에서 여러 정차 경로를 생성하기 위한 Vue.js 구현

Question

Google 지도에 방향을 표시하기 위해 이 코드 부분을 작성했습니다. 하지만 현재는 시작 위치와 끝 위치만 가지고 있습니다. 더 많은 정거장을 갖고 경로를 최대한 좋게 만들고 싶습니다. 여러 정거장을 입력하려면 어떻게 해야 하나요? 그게 내가 지금까지 한 일이야

으아악

방향 구성요소

으아악 으아악

그리고 나의 기능

으아악

지금까지는 잘 지내고 있고 모든 일이 순조롭게 진행되고 있지만 더 많은 정거장이 필요합니다 보시다시피 결국에는 변수가 하나뿐입니다. 어떻게 진행하나요? 현재 코드에 적응할 수 있나요?

Answer 1

이런 문제를 겪은 적이 있는데 이것이 도움이 될 것입니다:

먼저 waypoints 和 optimizeWaypoints 键添加到 DirectionsRenderer.js 文件中的 directionsService.route해야 할 일 그런 다음 이 키를 다음과 같이 프로젝트의 DirectionsRenderer 组件，并且需要在组件文件中创建一个名为 waypnt 的数组，并将所有 Destination 点和 stopover: true 키에 바인딩해야 합니다.

으아악

이것을 보세요:

DirectionsRenderer.js

으아악

MapContainer.vue

으아악

자세한 내용은 다음을 확인하세요. https://developers.google.com/maps/docs/javascript/examples/directions-waypoints#maps_directions_waypoints-javascript