开发者

Trouble with google maps api v3 polyline and markers

开发者 https://www.devze.com 2023-02-12 20:36 出处:网络
Well im making this GPS tracking app , the gps are constantly sending data to a database so all i need to do i fetch that data and use the api, the app is suposed to draw the route of one given car id

Well im making this GPS tracking app , the gps are constantly sending data to a database so all i need to do i fetch that data and use the api, the app is suposed to draw the route of one given car id. this is my code

for($i=0;$i<sizeof($losDatos);$i++)
{
if($losDatos[$i+1]['latitud']<>$losDatos[$i]['latitud'] || $losDatos[$i+1]['longitud']<>$losDatos[$i]['longitud'])
{
$script.="latArray.push(".$losDatos[$i]['latitud'].");";
$script.="lngArray.push(".$losDatos[$i]['longitud'].");";
$script.="codigos.push(".$losDatos[$i]['codigo'].");";
$script.="fechas.push('".$losDatos[$i]['fecha']."');";
$script.="velocidades.push(".$losDatos[$i]['velocidad'].");";
}
}

once ive filled all the array i call a function of mine called route. all the parameters in this function are arrays

 route(latArray,lngArray,codigos,fechas,velocidades);


function route(lats,lngs,codigos,fechas,vs,weight)
{
var pointsArray=[];
//make a new point for each lat,lng 
for(i=0;i<latArray.length;i++)
    {
    pointsArray.push(new google.maps.LatLng(lats[i],lngs[i]));

    //this next function adds a marker and sets an infowindow with code,date and speed for each one.
    addMarker(lats[i],lngs[i],codigos[i],fechas[i],vs[i]);
    }

//then I send my pointsArray to the polyline 
var ruta = new google.maps.Polyline({
    path: pointsArray,
   开发者_运维技巧 strokeColor: "#FF0000",
    strokeOpacity: 0.5,
    strokeWeight: weight});

ruta.setMap(map);
}

the trouble is that my polyline points and the marker points do not match they are like 30 pixels away from each other when they are supposed to be in the same location


well problem solved i had a problem with the image size i was originally using thin

var marker = new google.maps.Marker({
            position: pos, 
            map: map,
                icon:'img/bluedot.png' 
});

but it seemed i needed to be more specific so i did this

var icon=new google.maps.MarkerImage('img/bluedot.png',new google.maps.Size(6,6),new google.maps.Point(0,0),new google.maps.Point(0,1));

 var marker = new google.maps.Marker({
                position: pos, 
                map: map,
                        icon:icon 
    });
0

精彩评论

暂无评论...
验证码 换一张
取 消