Как анимировать полилинии маршрута в Google Maps JS API v3 - PullRequest
Новая
       21

Как анимировать полилинии маршрута в Google Maps JS API v3

0 голосов
/ 07 февраля 2020

В настоящее время я делаю туристический сайт, и я хотел бы создать Карты Google, которые показывают путешествие, которое они совершат. У меня все работает так, как я хочу, но я изо всех сил стараюсь оживить ломаную линию из города в город.

У меня есть множество городов, через которые я прохожу oop и получаю ломаную линию на карте, но как мне исправить анимацию? 

  var directionsService = new google.maps.DirectionsService();


  var request = {
    origin: start,
    destination: end,
    travelMode: google.maps.DirectionsTravelMode['WALKING']
  };

  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      var routePath = new google.maps.Polyline({
        path: response.routes[0].overview_path,
        geodesic: true,
        strokeColor: color,
        strokeOpacity: 1,
        fillOpacity: 2,
      });

      routePath.setMap(map);
    }
  });

Я знаю, что response.routes[0] - это набор точек, и я должен быть в состоянии рисовать от точки к точке и создавать иллюзию анимации. Однако это не дает мне достаточно свободы относительно скорости. Некоторые города находятся рядом, в то время как другие находятся на другой стороне страны.

Есть ли способ для меня оживить линию в процентах, или любое другое решение для моей проблемы было бы замечательно. Спасибо!

...