Click here to Skip to main content
14,331,865 members
Rate this:
Please Sign up or sign in to vote.
I want to refresh location in google maps in javascript automatically if variables latitude and longitude present in the database changes.

My code : It is working fine. But it shows a static map. I want to show current location in database and not a static location. I added a refresh button. But it is not an effective method. So help me to refresh location automatically. Thanks in advance.

//code starts here //javascript code is in last

locate_driver.php

$did = $_POST[did];
$cid = $_POST[cid];

$con=mysqli_connect("mysql4.000webhost.com","username","password","database_name");

if (mysqli_connect_errno($con))
{
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}

if($cid==null)
{
$sql = "SELECT busno, latitude, longitude, noofpassengers FROM schedule where did=$did";
$result = mysqli_query($con,$sql) or die(mysql_error());

while ($array = mysqli_fetch_array($result))
{
$busno=$array['busno'];
echo " Bus No : ";
echo $busno; echo "
";
$lat = $array['latitude'];
echo "Latitude : ";
echo $lat; echo "
";
$long=$array['longitude'];
echo "Longitude : ";
echo $long; echo "
";
$nop=$array['noofpassengers'];
if($nop!=null)
{
echo " No of passengers : ";
echo $nop; echo "
";
}
else
{ echo "NA"; }
}
}

else
{
$sql = "SELECT busno, latitude, longitude, noofpassengers FROM schedule where cid=$cid";
$result = mysqli_query($con,$sql) or die(mysql_error());

while ($array = mysqli_fetch_array($result))
{
$busno=$array['busno'];
echo " Bus No : ";
echo $busno; echo "
";
$lat = $array['latitude'];
echo "Latitude : ";
echo $lat; echo "
";
$long=$array['longitude'];
echo "Longitude : ";
echo $long; echo "
";
$nop=$array['noofpassengers'];
echo " No of passengers : ";
echo $nop; echo "

";
}
}

?>

<html>
<body onload="sp()">



<form action="locate_driver.php" method="POST">
<input type="hidden" name="did" value="">
<input type="hidden" name="cid" value="">
<input type="submit" value="Refresh">
</form>



<script src="http://maps.google.com/maps/api/js?sensor=false"></script>

<script>
var x = document.getElementById("demo");

function sp() {
lat = ;
lon = ;
latlon = new google.maps.LatLng(lat, lon)
mapholder = document.getElementById('mapholder')
mapholder.style.height = '320px';
mapholder.style.width = '270px';

var myOptions = {
center:latlon,zoom:14,
mapTypeId:google.maps.MapTypeId.ROADMAP,
mapTypeControl:false,
navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
}

var map = new google.maps.Map(document.getElementById("mapholder"), myOptions);
var marker = new google.maps.Marker({position:latlon,map:map,title:"Bus is here!"});
}

function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
}
</script>

</body>
</html>







Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100