我在一个标记上实现了以下代码，并且工作正常。但是使用多个标记时出现问题。标记无法平稳移动。有没有人经历过这样的情况？

我使用ajax从第三方获取最新的纬度和经度API。

下面是我自定义的源代码（用于一个标记），I got a reference from here:

<script type="text/javascript"> 
    var car_icon = 'car.gif';   
    var numDeltas = 100;
    var delay = 10; //milliseconds
    var iteration = 0;
    var position = [];
    var deltaLat,deltaLng,html_popup,map,date_popup,time_popup,bearing,posistion_description,registration;

    function get_first_coordinat(){
        $.ajax({
            url: "ajax.php?id=10",type: 'GET',dataType: 'JSON',cache: false,success: function(res) {
                if(res.status){
                    position[0] = parseFloat(res.latitude);
                    position[1] = parseFloat(res.longitude);
                    reload_api(res);
                } else {
                    console.log(res);
                }
            }
        });
    }

    //Load google map
    google.maps.event.addDomListener(window,'load',get_first_coordinat);

    function initialize(res) { 
        var latlng = new google.maps.LatLng(position[0],position[1]);
        posistion_description = res.posistion_description;
        registration = res.registration;
        bearing = res.bearing;
        date_popup = (res.event_ts).substr(8,2) + '/' + (res.event_ts).substr(5,2) +'/'+(res.event_ts).substr(0,4);
        time_popup = (res.event_ts).substr(11,5);
        html_popup = '<table>'+
                        '<tr>'+
                            '<td><b>'+(registration)+'</b></td>'+
                        '</tr>'+
                        '<tr>'+
                            '<td><b>'+(posistion_description)+'</b></td>'+
                        '</tr>'+
                        '<tr>'+
                            '<td>'+
                                '<span class="status" style="background:'+(res.vehicle_status_color)+';">'+(res.vehicle_status).toUpperCase()+'</span>'+ '<b> '+time_popup+' - '+date_popup+'</b>'
                            '</td>'+
                        '</tr>'+                                
                        '<tr>'+
                            '<td>'+
                                '<b></b>'
                            '</td>'+
                        '</tr>'+
                    '</table>';
        var myoptions = {
            zoom: 15,center: latlng,mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("gmap_canvas"),myoptions);

        marker = new google.maps.Marker({
            position: latlng,map: map,title: (res.registration),icon:car_icon,});

        var infowindow = new google.maps.InfoWindow({
            content:''
        });

        bindInfoWindow(marker,infowindow,html_popup);
    }

    // TRANSITION
    function transition(res){
        iteration = 0;
        deltaLat = (res.latitude - position[0])/numDeltas;
        deltaLng = (res.longitude - position[1])/numDeltas;

        // SET VARIABEL UNTUK POPUP
        posistion_description = res.posistion_description;
        bearing = parseInt(res.bearing);
        registration = res.registration;
        vehicle_status_color = res.vehicle_status_color;
        vehicle_status = res.vehicle_status;
        date_popup = (res.event_ts).substr(8,5);
        html_popup = '<table>'+
                        '<tr>'+
                            '<td><b>'+(registration)+'</b></td>'+
                        '</tr>'+
                        '<tr>'+
                            '<td><b>'+(posistion_description)+'</b></td>'+
                        '</tr>'+
                        '<tr>'+
                            '<td>'+
                                '<span class="status" style="background:'+(vehicle_status_color)+';">'+(vehicle_status).toUpperCase()+'</span>'+ '<b> '+time_popup+' - '+date_popup+'</b>'
                            '</td>'+
                        '</tr>'+                                
                        '<tr>'+
                            '<td>'+
                                '<b></b>'
                            '</td>'+
                        '</tr>'+
                    '</table>';

        moveMarker();
    }

    // MOVE MARKER
    function moveMarker(){          
        position[0] += deltaLat;
        position[1] += deltaLng;

        var latlng = new google.maps.LatLng(position[0],position[1]);

        marker.setTitle(registration+" - "+posistion_description);
        marker.setPosition(latlng);

        if(iteration!=numDeltas){
            iteration++;
            setTimeout("moveMarker()",delay);
        }
    }

    // POPUP WINDOW
    function bindInfoWindow(marker,html_popup) { 
        google.maps.event.addListener(marker,"click",function () {
            infowindow.setContent(html_popup); 
            infowindow.open(map,marker);
        });

        google.maps.event.addListener(marker,'mouseover',function() { 
            infowindow.setContent(html_popup); 
            infowindow.open(map,marker); 
        }); 

        google.maps.event.addListener(marker,'mouseout',function() {
            infowindow.close();
        });
    } 

    // RELOAD API
    var no = 1;
    function reload_api(result){            
        if(no == 1){
            initialize(result);
        } else {
            $.ajax({
                url: "ajax.php?id=10",success: function(res) {
                    if(res.status){
                        transition(res);
                    } else {
                        console.log(res);
                    }
                }
            });
        }
        no++;

        // SET INTERVAL API
        setTimeout(reload_api,5000);
    }

</script>