Thursday, March 6, 2014

Google maps using JavaScript

Here we are using the external JavaScript source that is provided by the google.
Now custom function initialize() that sets the google map to the div, the custom method have latitude and longitude values.

Code:
<!DOCTYPE html>
<html>
  <head>
    <style>
      #map_canvas {
        width: 100%;
        height: 600px;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script>
      function initialize() {
        var map_canvas = document.getElementById('map_canvas');
        var map_options = {
          center: new google.maps.LatLng(29.4000, 69.1833),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(map_canvas, map_options)
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas"></div>
  </body>
</html>

No comments:

Post a Comment