Thursday, March 1, 2018

Google map show a map using address on website

<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
</script>
<script>
var geocoder;
var map;

function codeAddress() {
   geocoder = new google.maps.Geocoder();

    var latlng = new google.maps.LatLng(33.449204, -112.074387);

    var mapOptions = {

      center: latlng,
        zoom: 12,
    mapTypeId: google.maps.MapTypeId.TERRAIN
        }
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    var address = 'Indira Gandhi International Airport, New Delhi, Delhi, India';
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {

    var lat=results[0].geometry.location.lat();

    var lng=results[0].geometry.location.lng();

    map.setCenter(new google.maps.LatLng(lat, lng));

     var marker = new google.maps.Marker({

            position: results[0].geometry.location,
            map: map,
            animation: google.maps.Animation.DROP,

        });

             var infowindow = new google.maps.InfoWindow();
            infowindow.setContent('<div class="mapinfo"> Indira Gandhi International Airport, New Delhi, Delhi, India</div>');
            infowindow.open(map, marker);

            }

    });


    }


</script>
<body onload="codeAddress();">
<div id="form2left">
        <div id="map-canvas" style="width: 100%; height: 100%;"></div>
      </div>
    </body>

No comments:

Post a Comment

Subscribe to: Post Comments (Atom)