am trying to get the coordinates generated by the geocode passed to the function initialize so that a map with the location can be drawn. i have carried over the variables from the php to the function initialize() but it is not reading the lati and longi values.
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<?php
$dlocation =$_POST['address'];
// Get lat and long by address
$address = $dlocation; // Google HQ
$prepAddr = str_replace(' ','+',$address);
$geocode=file_get_contents('http://maps.google.com/maps/api/geocode/json?address='.$prepAddr.'&sensor=false');
$output= json_decode($geocode);
$latitude = $output->results[0]->geometry->location->lat;
$longitude = $output->results[0]->geometry->location->lng;
echo 'latitute:'.$latitude . "
";
echo 'Longitude:'. $longitude. "
";
?>
<script type="text/javascript">
function initialize()
{ var lati = "<?php echo $latitude;?>";
var longi = "<?php echo $longitude;?>"
var latlng = new google.maps.LatLng(('lati', 'longi'));
var mapOptions = {
center: new google.maps.LatLng('lati', 'longi'),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-canvas"),mapOptions);
}
</script>
<title></title>
</head>
<body onload="initialize()">
<div id="map-canvas" style="width: 1000px; height: 900px">
</div>
</body>
</html>
please help ASAP
var longi = "<?php echo $longitude;?>"
^ semi-colon is missing
and it should be number, not string
And
var latlng =
new google.maps.LatLng(('lati', 'longi'));
^ you should pass variable value not string
And
center: new google.maps.LatLng('lati', 'longi'),
^ same as above, variable, not string
Change you function to look like this
Give the API reference , google.maps.LatLng class constructor accepts Number
value
function initialize()
{
var lati = parseFloat("<?php echo $latitude;?>");
var longi= parseFloat("<?php echo $longitude;?>");
var latlng = new google.maps.LatLng((lati, longi));
var mapOptions = {
center: new google.maps.LatLng(lati, longi),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-canvas"),mapOptions);
}
I don't know the correctness of your function w.r.t Google Maps , this is just javascript fix