Skip to content

Instantly share code, notes, and snippets.

@lewis-munyi
Created May 3, 2018 09:15
Show Gist options
  • Select an option

  • Save lewis-munyi/15465aa2950654533c027c19b2f8c913 to your computer and use it in GitHub Desktop.

Select an option

Save lewis-munyi/15465aa2950654533c027c19b2f8c913 to your computer and use it in GitHub Desktop.
A snippet that gets a map location and shows it in a div
<html>
<head>
<!-- Bootstrap links -->
</head>
<body>
<div class="col-xs-12 col-md-12 col-lg-12 gmap_canvas_height">
<div id="gmap_canvas" style="height:500px;width:100%;"></div>
</div>
<script type="text/javascript">
function init_map() {
var myOptions = {
zoom: 14, //Zoom
center: new google.maps.LatLng(-1.320387, 36.8149044), //(Latitude , Longitude) to center the map
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("gmap_canvas"), myOptions); //Where to place the map
marker = new google.maps.Marker({
map: map,
position: new google.maps.LatLng(-1.320387, 36.8149044) //Latitude, longitude
});
infowindow = new google.maps.InfoWindow({
content: "<b>Wilson Airport</b><br/>Lang'ata road<br/> Nairobi" //Banner text
});
google.maps.event.addListener(marker, "click", function () {
infowindow.open(map, marker);
});
infowindow.open(map, marker);
}
google.maps.event.addDomListener(window, 'load', init_map); //Initialize map when page loads
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment