draw two different paths on google map with php
hey here my code for the google map
function temp(){
var device_id=document.getElementById('hide').value;
//alert(device_id);
for(j=0;j<device_id;j++)
{
// alert(document.getElementById('hid'+j).value);
$.ajax({
type: 'post',
url: '<?=base_url()?>index.php/admin/tracking/get_location/'+document.getElementById('hid'+j).value,
// data: 'season_id='+season_id,
dataType: "json",
success: function(msg) {
// directionsDisplay.setMap(null);
deleteOverlays();
$.each(msg,function(index,value){
var newLatlng = new google.maps.LatLng(value['lat'],value['long']);
map.panTo(newLatlng);
if(myPoints.length>0)
{
var oldLatlng=myPoints[myPoints.length-1];
var myCoordinates = [
oldLatlng,
newLatlng
];
var myPath = new google.maps.Polyline({
path: myCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
way.push(myPath);
myPath.setMap(map);
}
//var newLatlng = new google.maps.LatLng(value['lat'],value['long']);
myPoints.push(newLatlng);
map.panTo(newLatlng);
})
}
});
}
setTimeout("temp1()",2000);
}
function temp1(){
var device_id=document.getElementById('hide').value;
//alert(device_id);
for(j=0;j<device_id;j++)
{
// alert(document.getElementById('hid'+j).value);
$.ajax({
type: 'post',
url: '<?=base_url()?>index.php/admin/tracking/get_last_location/'+document.getElementById('hide').value,
// data: 'season_id='+season_id,
dataType: "json",
success: function(msg) {
var newLatlng = new google.maps.LatLng(msg.lat,msg.lng);
map.panTo(newLatlng);
document.getElementById('speed').value=msg.speed;
if(myPoints.length>0)
{
var oldLatlng=myPoints[myPoints.length-1];
var myCoordinates = [
oldLatlng,
newLatlng
];
if(oldLatlng!=newLatlng)
{
var myPath = new google.maps.Polyline({
path: myCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
way.push(myPath);
myPath.setMap(map);
}
myPoints.push(newLatlng);
}
else
{
//var newLatlng = new google.maps.LatLng(value['lat'],value['long']);
myPoints.push(newLatlng);
}
}
});
}
setTimeout("temp1()",2000);
}
function deleteOverlays() {
if (myPoints.length>0) {
for (i in myPoints) {
myPoints[i].setMap(null);
}
myPoints.length = 0;
}
if (way.length>0) {
for (i in way) {
way[i].setMap(null);
}
way.length = 0;
}
}
</script>
</head>
<body style="font-family: Arial; border: 0 none;">
<?if (isset ($val)){$i=0;
foreach ($val as $d){?>
<input type="hidden" value="<?=$d['deviceid']?>" id="hid<?=$i?>"/>
<? $i++; }?>
<input type="hidden" value="<?=$i?>" id="hide"/>
<? }?>
<div id="map-canvas" style="width: 700px; height: 500px"></div>
<div>
<form action="<?=base_url()?>index.php/admin/tracking/index" method="post" enctype="multipart/form-data">
<select name="device[]" id="device" multiple>
<?if (isset ($adv)){
foreach ($adv as $device){?>
<option value="<?=$device['id']?>"><?=$device['device_name开发者_如何学Go']?></option>
<?}}?>
</select>
<div><input type="submit" value="Check Path" name="check" /></div>
</form>
</div>
<div id="seediv">
</div>
<div id="directionsPanel" style="width:700px;display: none"></div>
<p style="display: none">Total Distance: <span id="total"></span></p>
<div>
<label for="lname">Current Speed:</label>
<input type="text" name="speed" id="speed" disabled />
</div>
from the temp function i got started the root on map and after that temp1 function i got continuous points for path from the database. but now i wants to print multiple path on map by selecting multiple set of select option. how can i????
Your question isn't clear. If you receive N points, it looks like you're adding N paths with one point each. If you want one long path, add the points to an array and only create and add the polyline afterwards. If you want to draw multiple separate paths on the map, then send back an array of objects, and execute the previous step for each.
加载中,请稍侯......
精彩评论