Web Guru...: Simple Google Map using php

<?
$address="Kapshera, New Delhi, Delhi";
$geocode=file_get_contents('http://maps.google.com/maps/api/geocode/json?address='.urlencode($address).'&sensor=false');

$output= json_decode($geocode);

$lat = $output->results[0]->geometry->location->lat;
$lng = $output->results[0]->geometry->location->lng;
?>
<!DOCTYPE html>
<html dir="rtl">
<head>
    <title>Google Map</title>
    <meta charset="utf-8">
    <style>
    html, body {
height: 100%;
margin: 0;
padding: 0;
}

#map_canvas {
height: 100%;
}

@media print {
html, body {
    height: auto;
}

#map_canvas {
    height: 650px;
}
}
</style>
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false&language=en"></script>
    <script>
      function initialize() {
        var mapOptions = {
          scaleControl: true,
          center: new google.maps.LatLng(<?=$lat?>,<?=$lng?>),
          zoom: 10,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById('map_canvas'),
            mapOptions);

        var marker = new google.maps.Marker({
          map: map,
          position: map.getCenter()
        });
        var infowindow = new google.maps.InfoWindow();
        infowindow.setContent('<?=$address?>');
        google.maps.event.addListener(marker, 'click', function() {
            infowindow.open(map, marker);
        });
      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>

</head>
<body>

    <div id="map_canvas" style="height: 600px;"></div>
</body>
</html>

Web Guru...

Pages

Tuesday, October 16, 2012

Simple Google Map using php

No comments:

Post a Comment