Skip to content

Instantly share code, notes, and snippets.

@ryanjm
Created May 16, 2013 01:14
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ryanjm/5588715 to your computer and use it in GitHub Desktop.
Save ryanjm/5588715 to your computer and use it in GitHub Desktop.
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>KML Test</title>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript" charset="utf-8">
// this is a function to be called when the page has loaded. In Rails we'll be using jQuery and this will be a little different
function initialize() {
// this is just used to set a "location" for the cetner fo the map. The ctaLayer below will actually recenter it.
var loc = new google.maps.LatLng(37.42222, -122.0839597145766);
// This is a javascript hash used as options for the map
var mapOptions = {
zoom: 14,
center: loc,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
// create a new map and tells it which element to attach itself to
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
// add a kml layer. Since this is a google service it needs access to the url you give it. I'm just using an example kml from here: https://developers.google.com/kml/documentation/kml_tut (SamplesInMaps)
var ctaLayer = new google.maps.KmlLayer('http://kmlscribe.googlepages.com/SamplesInMaps.kml');
// add it to the map
ctaLayer.setMap(map);
}
</script>
<style type="text/css" media="all">
#map-canvas {
width: 100%;
height: 100%;
}
</style>
</head>
<body onload="initialize()">
<div id="map-canvas">
</div>
</body>
</html>
@ryanjm
Copy link
Author

ryanjm commented May 16, 2013

KML Tutorial links to this example which is where I grabbed the KML url from.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment