Oct 17, 2014

How To Display A Google Map In Html Providing Geo Codes

First you would need to link the latest Jquery and Google Maps  to your website.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=places"></script>

Then you will need to add a <div > tag with the an id "map_canvas" as written below.
<div id="map_canvas" style="width:650px;height:650px"></div>
Then with Jquery you will have to append the map to the div .

//you need to pass the Geo Locations the CreateMap Function

function CreateMap(Longitude,Latitude) {
 gmLon = Longitude;
 gmLan = Latitude; 
 var myLatlng = new google.maps.LatLng(gmLan, gmLon);
 
 var map = new google.maps.Map(document.getElementById("map_canvas"), {
  zoom: 12,
  center: myLatlng,
  disableDefaultUI: true
 });
 
 google.maps.event.addListenerOnce(map, 'idle', function () {
  google.maps.event.trigger(map, 'resize');
  map2.setCenter(myLatlng);
 });
 
 var marker = new google.maps.Marker({
  position: myLatlng
 });
`
 marker.setMap(map);
}

Feel Free To Email Us If You Have Any Problem Regarding This.

No comments:

JWT Token Decode Using Jquery

When it come to authentication we use many mechanism. Ones the user authenticated we must keep these details somewhere safe. So we can share...