Location on the Google Map
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> | |
<title>Google Map</title> | |
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=Your API Key" type="text/javascript"></script> | |
</head> | |
<body onunload="GUnload()"> | |
<div id="map" style="width: 550px; height: 450px"></div> | |
<script type="text/javascript"> | |
//<![CDATA[ | |
if (GBrowserIsCompatible()) { | |
// A function to create the marker and set up the event window | |
// Dont try to unroll this function. It has to be here for the function closure | |
// Each instance of the function preserves the contends of a different instance | |
// of the "marker" and "html" variables which will be needed later when the event triggers. | |
function createMarker(point,html) { | |
var marker = new GMarker(point); | |
GEvent.addListener(marker, "click", function() { | |
marker.openInfoWindowHtml(html); | |
}); | |
return marker; | |
} | |
// Display the map, with some controls and set the initial location | |
var map = new GMap2(document.getElementById("map")); | |
map.addControl(new GLargeMapControl()); | |
map.addControl(new GMapTypeControl()); | |
map.setCenter(new GLatLng(43.907787,-79.359741),8); | |
// Set up three markers with info windows | |
var point = new GLatLng(43.65654,-79.90138); | |
var marker = createMarker(point,'<div style="width:240px">Some stuff to display in the First Info Window. With a <a href="http://www.sanjaybhowmick.com">Link</a> to my home page</div>') | |
map.addOverlay(marker); | |
var point = new GLatLng(43.91892,-78.89231); | |
var marker = createMarker(point,'Some stuff to display in the<br>Second Info Window') | |
map.addOverlay(marker); | |
var point = new GLatLng(43.82589,-79.10040); | |
var marker = createMarker(point,'Some stuff to display in the<br>Third Info Window') | |
map.addOverlay(marker); | |
} | |
// display a warning if the browser was not compatible | |
else { | |
alert("Sorry, the Google Maps API is not compatible with this browser"); | |
} | |
//]]> | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment