Я показываю трекинг на карте с маркерами и линией, соединяющей их.

Проблема в том, что я хочу показать направление движения по ссылкам;

Поэтому я не понимаю, как показать направление на линии между точками маркера.

Есть ли способ выполнить эту задачу.

10
Mohammad Sadiq Shaikh 28 Дек 2012 в 11:51

1 ответ

Лучший ответ

Указать направление на ломаной линии можно с помощью стрелок.

Есть несколько предопределенных путей, которые предоставляет Google Maps api3.

См. Этот раздел документации - СИМВОЛЫ НА ПОЛИЛИНИИ , которые можно использовать кроме стрелки.

Взгляните на эту скрипку, в которой стрелка указывает направление ломаной линии.

ДЕМО с символом сигла

Вы также можете установить свойство repeat для символа, чтобы он повторялся через равные промежутки времени.

ДЕМО с повторяющимися символами

JavaScript-

var iconsetngs = {
    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW
};
var polylineoptns = {
    path: markers,
    strokeOpacity: 0.8,
    strokeWeight: 3,
    map: map,
    icons: [{
        icon: iconsetngs,
        offset: '100%'}]
};
polyline = new google.maps.Polyline(polylineoptns);

Интересной особенностью этого предопределенного символа (особенно стрелки вперед ) является то, что стрелка указывает на точное направление, в котором расположены ваши координаты. Итак, это, очевидно, служит цели обозначения направления в системе слежения.

ОБНОВЛЕНИЕ: Не уверен, о чем вы пытаетесь рассказать в комментариях. Маркеры могут отображаться таким же образом. Вот код, который добавляет маркеры с помощью цикла, а также устанавливает ломаную линию со стрелками:

ДЕМО С МАРКЕРАМИ И ПОЛИЛИНИЕЙ

Javascript:

var polylineoptns = {
        strokeOpacity: 0.8,
        strokeWeight: 3,
        map: map,
        icons: [{
            repeat: '70px', //CHANGE THIS VALUE TO CHANGE THE DISTANCE BETWEEN ARROWS
            icon: iconsetngs,
            offset: '100%'}]
    };
    polyline = new google.maps.Polyline(polylineoptns);
    var z = 0;
    var path = [];
    path[z] = polyline.getPath();
    for (var i = 0; i < markers.length; i++) //LOOP TO DISPLAY THE MARKERS
    {
        var pos = markers[i];
        var marker = new google.maps.Marker({
            position: pos,
            map: map
        });
        path[z].push(marker.getPosition()); //PUSH THE NEWLY CREATED MARKER'S POSITION TO THE PATH ARRAY
    }
27
Shiridish 7 Янв 2013 в 09:23
Как я могу получить общее расстояние, пройденное до последней точки. Рассчитывается не по начальной и конечной точкам, а по пути движения ????
 – 
Mohammad Sadiq Shaikh
8 Янв 2013 в 16:12
1
Это другой вопрос. Подумайте о том, чтобы опубликовать это как новый вопрос.
 – 
Shiridish
8 Янв 2013 в 17:58
Большое спасибо за ответ @Cdeez! Очень полезно!
 – 
jerrygarciuh
12 Фев 2015 в 01:44
Есть ли альтернативы OSM?
 – 
Arash
20 Янв 2020 в 22:05