Google maps api - привязать НЕСКОЛЬКО маркеров к ближайшей дороге

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

<script type="text/javascript"><!--//<![CDATA[
    function updateLocation(map, markersArray, labelsArray){
             $.ajax({                                      
                      url: 'update.php',                  //the script to call to get data          
                      data: "",                      
                      dataType: 'json',                //data format      
                      success: function(uniPoints){
                             clearMarkers(markersArray, labelsArray);
                             setMarkers(map, uniPoints, markersArray, labelsArray);                       
                    } 
                });
            }


            function initialize(uniPoints) {
              var myOptions = {
                zoom: 2,
                center: new google.maps.LatLng(0, 0),       
                mapTypeId: google.maps.MapTypeId.ROADMAP
              }
              var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
              var markersArray = [];
              var labelsArray = [];
              setInterval(function() { updateLocation(map, markersArray, labelsArray); }, 20000 );
            }
        ...
        ...

Функция для размещения маркеров на карте:

            function setMarkers(map, locations, markersArray, labelsArray) {
              var image1 = new google.maps.MarkerImage('pimg/1.png',  new google.maps.Size(31, 37), new google.maps.Point(0,0), new google.maps.Point(0, 37));
              var imageActive1 = new google.maps.MarkerImage('pimg/1Active.png',  new google.maps.Size(31, 37), new google.maps.Point(0,0), new google.maps.Point(0, 37));
              var shadow = new google.maps.MarkerImage('pimg/taskShadow.png', new google.maps.Size(31, 37), new google.maps.Point(0,0), new google.maps.Point(0, 37));

              var shape = {
                  coord: [0, 0, 31, 37],
                  type: 'rect'
              };
              var bounds = new google.maps.LatLngBounds();
              for (var i = 0; i < locations.length; i++) {
                        var point = locations[i];
                        var myLatLng = new google.maps.LatLng(point[2], point[3]);

                                    var image=image1;

                        var marker = new google.maps.Marker({
                            position: myLatLng,
                            map: map,
                            shadow: shadow,
                            icon: image,
                            shape: shape,
                            title: point[0],
                            zIndex: 3
                        });

                        marker.set('id', point[0]);
                        marker.set('type', point[1]);
                        var devId=0;
                       if (devId==point[1]){
                           var label = new Label({
                               map: map
                          }, '#0297af',  '#ffffff');
                       }else{
                            var label = new Label({
                           map: map
                          }, '#353638',  '#0297af');
                       }

                      label.set('zIndex', 1234);
                      label.set('id', point[0]);
                      label.bindTo('position', marker, 'position');
                      label.set('text', point[1]);

                      labelsArray.push(label);
                      markersArray.push(marker);

                      bounds.extend(myLatLng);
              }
                map.fitBounds(bounds);
            } 


           $(window).load(initialize);
//]]>--></script> 

После поиска в Интернете решения я обнаружил, что возможность привязать точку к ближайшей дороге может быть реализована с помощью DirectionsService. Если мы берем одну точку, то это можно реализовать так:

<script type="text/javascript">
var directionsService = new google.maps.DirectionsService();
    function initialize() {

        var homeLatlng = new google.maps.LatLng(24.696554,-81.328238);
        var myOptions = {
            zoom: 15,
            center: homeLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var image = new google.maps.MarkerImage(
            'http://maps.google.com/mapfiles/ms/micons/green-dot.png',
            new google.maps.Size(32, 32),   // size
            new google.maps.Point(0,0), // origin
            new google.maps.Point(16, 32)   // anchor
        );

        var shadow = new google.maps.MarkerImage(
            'http://maps.google.com/mapfiles/ms/micons/msmarker.shadow.png',
            new google.maps.Size(59, 32),   // size
            new google.maps.Point(0,0), // origin
            new google.maps.Point(16, 32)   // anchor
        );


        directionsService.route({origin:homeLatlng, destination:homeLatlng, travelMode: google.maps.DirectionsTravelMode.DRIVING}, function(response, status) {

            if (status == google.maps.DirectionsStatus.OK)
          {
            var homeMarker = new google.maps.Marker({
              position: response.routes[0].legs[0].start_location, 
              map: map,
              title: "Check this cool location",
              icon: image,
              shadow: shadow
            });
          } else {
            var homeMarker = new google.maps.Marker({
              position: homeLatlng,
              map: map,
              title: "Check this cool location",
              icon: image,
              shadow: shadow
            });
          }
    });

    }

    google.maps.event.addDomListener(window, 'load', initialize);
</script>

Однако, когда я пытаюсь ввести свой код, на карте не появляются маркеры. Кажется, проблема в том, что DirectionsService работает асинхронно... У кого есть идеи по изменению первого кода, который ставит несколько маркеров и привязывает каждый из них к ближайшей улице (дороге)?


person wahas    schedule 27.05.2013    source источник
comment
возможный дубликат API карт Google - привязать несколько точек к каждой ближайшая дорога   -  person geocodezip    schedule 29.05.2013
comment
Согласно вашему ответу на этот вопрос, у вас есть от 2 до ~10. Местоположение обновляется каждые 5 секунд. Вы столкнетесь с ограничением скорости, если будете использовать для этого службу маршрутов. Твои точки двигаются?   -  person geocodezip    schedule 29.05.2013
comment
Да, точки двигаются.. Вроде нет возможности реализовать такой скрипт..   -  person wahas    schedule 17.11.2013