Использование Google Maps 3 API для получения нескольких маршрутов на карте - PullRequest
Новая
       16

Использование Google Maps 3 API для получения нескольких маршрутов на карте

14 голосов
/ 29 ноября 2011

Я работаю над проблемой маршрутизации транспортных средств.Недавно я потратил немного времени на просмотр API Карт Google, чтобы посмотреть, смогу ли я напечатать несколько маршрутов на одной карте.Я хотел бы следующее: route1: точка a, b, c, маршрут 2, точка a, d, e, f, маршрут 3, точка a, g, h, a, и я хотел бы, чтобы каждый маршрут имел разную цветную полилинию,Может кто-то помочь мне с этим.

1 Ответ

25 голосов
/ 04 декабря 2011

Да, это довольно просто, как только вы освоите его.

Вы хотите использовать объект directionsRenderer.

Самое главное, что вы хотите, чтобы все ваши маршруты были настроеныв массиве, то вы хотите перебрать их через цикл.Каждый раз создавая новый объект directionsRenderer и каждый раз устанавливая его на карту.Внутри цикла вы также захотите создать новую переменную ломаной линии, которую вы каждый раз будете передавать в directionsRenderer другим цветом.Я использую какой-то код, который сделал это, но не знаю, где он сейчас находится.

Вот пример того, как кто-то использовал полилинии другого цвета.:

http://www.geocodezip.com/violette_com_TestMap2c.html

Если вы сосредоточитесь на этих двух нижеследующих строках кода, вы увидите, как задается цвет ломаной линии, а также как она передается на directionsRenderer. 

directionsDisplayActual = new google.maps.DirectionsRenderer({suppressMarkers: true, polylineOptions: polylineOptionsActual})

var polylineOptionsActual = {
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 10
      };

Следующие путевые коды для ваших маршрутов.:

http://code.google.com/apis/maps/documentation/javascript/examples/directions-waypoints.html

Еще один хороший пример. 

var request = {
    origin: start, 
    destination: end,
    waypoints: waypts,
    optimizeWaypoints: true,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {

Если вы сосредоточитесь на приведенном выше коде в приведенном примере Google, вы увидите waypts var.Вот где будет установлен ваш промежуточный маркер (как вы говорите, пункт b).Вы сделаете это, выполнив waypts.push(.....).Отправной точкой и пунктом назначения будет ваша точка a и точка b.

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

...