Добавление маркеров на Google Map - PullRequest
0 голосов
/ 29 января 2012

Я пытаюсь обновить маркер в режиме реального времени на карте Google. Мне нужен маркер для начального местоположения, а затем, когда местоположение меняется (пользователь перемещается), будет нарисована ломаная линия, и маркер покажет текущее местоположение. Итак, для каждого пользователя будет два маркера; один, показывающий начальное местоположение, и тот, который продолжает обновляться и показывающий текущее местоположение.

Я могу заставить нарисованные линии и маркер начала работать, но с этим кодом каждый раз, когда меняется местоположение, вместо старого обновляется новый маркер. Я пытаюсь использовать setPosition (); но это не похоже на работу. Есть мысли?

   function initialize() {
    var myLatlng = new google.maps.LatLng(39, -86);
    var myOptions = {
        zoom: 6,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
    }       
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

    var loc = {};
    var mark = {};
    var markers = {};

    $(function () {
        $(document).ready(function(){
            setInterval(function(){
                $.ajax({                                      
                    url: 'api.php',                  //the script to call to get data          
                    //data: "",                       
                    dataType: 'json',                //data format      
                    success: function(data){          //on recieve of reply                          


                        var user_id = data[0];
                        var lati = data[1];              //get id
                        var longi = data[2];           //get name

                        var myLatlngt = new google.maps.LatLng(lati, longi);

                        if (typeof loc[user_id] === 'undefined') {
                            loc[user_id] = [];
                            }

                        //if (typeof markers[user_id] === 'undefined') {
                            //markers[user_id] = [];
                            //}

                        if (typeof mark[user_id] === 'undefined') {
                            mark[user_id] = myLatlngt;
                            }

                        loc[user_id].push(myLatlngt);
                        //markers[user_id].push(myLatlngt);
                        var marker1;
                        var x;
                        for (x in loc) {
                            var polyline = new google.maps.Polyline({
                                map: map,
                                path: loc[x],
                                strokeColor: "#FF0000",
                                strokeOpacity: 1.0,
                                strokeWeight: 2
                                });
                            polyline.setMap(map);

                            ///location variables
                            var start_loc = loc[user_id];
                            var start_marker = start_loc[0]; //start location of given user
                            var current_loc = start_loc[start_loc.length -1]; //last known location of given user

                            //set the start marker
                            var marker = new google.maps.Marker({
                                position: start_marker,
                                title: user_id
                            });
                            marker.setMap(map); 

                            //update the current location marker
                            if (marker1 != null) {
                                marker1.setPosition(current_loc);
                            }
                            else {
                                marker1 = new google.maps.Marker({
                                    position: current_loc,
                                    map: map
                                });
                            }                   
                        }
                            //console.log('location :::', x);
                            console.log('Marker: ', mark);
                    } 
                });
            }, 1000);
        });
    });
}

1 Ответ

1 голос
/ 29 января 2012

Попробуйте объявить переменную marker1 (var marker1;) вне функции, чтобы сделать ее глобальной (область действия). Сразу после var markers = {}; должен это сделать. Дайте мне знать, если это не сработает, и я посмотрю на это глубже.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...