Skip to content

Instantly share code, notes, and snippets.

@pamelafox

pamelafox/kmlmap.html

Last active December 16, 2015 06:29
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pamelafox/5392232 to your computer and use it in GitHub Desktop.
Save pamelafox/5392232 to your computer and use it in GitHub Desktop.
Download ZIP
KML Gadget, Standalone HTML
Raw
kmlmap.html
<!doctype html>
<html>
<body>
<style>
body, html {
height: 100%;
width: 100%;
}
</style>
<div id=mapcontainer style="width: 100%; height: 100%;"></div>
<script src="https://www.google.com/jsapi?hl=en&key=AIzaSyCFuPeWhLOT_8ZD-niPhfeBKOAfqC0J6-Y"></script>
<script>
google.load('earth', '1');
google.load('maps', '2');
var ge = null;
var map = null;
var appPath = 'http://dl.google.com/developers/maps/';
var viewMode = 'maps';
var kmlUrl = 'https://spark-public.s3.amazonaws.com/bluebrain/SynapsesNeuronsandBrainsStudentsMap.kml';
var showNavControls = true;
var mapDefaultType = 'map';
var earth2dFallback = true;
var mapZoomOut = false;
function initGadget() {
var c = document.getElementById('mapcontainer');
while (c && c.offsetParent != c) {
c.style.height = '100%';
c = c.offsetParent;
}
createGadgetUI();
}
function createGadgetUI() {
myMapsMatch = kmlUrl.match(/maps\.google\.[a-z]+.*msid=([0-9a-f.]+)/);
if (myMapsMatch) {
kmlUrl = 'http://maps.google.com/maps/ms?msa=0&output=kml&msid=' + myMapsMatch[1];
}
if (viewMode == 'maps') {
map = new google.maps.Map2(document.getElementById('mapcontainer'));
map.setCenter(new google.maps.LatLng(0, 0), 1);
map.setUIToDefault();
var defaultMapType = mapDefaultType;
if (defaultMapType == 'map')
map.setMapType(G_NORMAL_MAP);
else if (defaultMapType == 'satellite')
map.setMapType(G_SATELLITE_MAP);
else if (defaultMapType == 'hybrid')
map.setMapType(G_HYBRID_MAP);
else if (defaultMapType == 'terrain')
map.setMapType(G_PHYSICAL_MAP);
if (kmlUrl) {
kmlUrl += (kmlUrl.indexOf('?') >= 0 ? '&' : '?') +
Number(new Date()).toString();
var geoXml = new google.maps.GeoXml(kmlUrl);
map.addOverlay(geoXml);
if (!mapZoomOut)
geoXml.gotoDefaultViewport(map);
}
} else if (viewMode == 'earth') {
if (!google.earth.isInstalled() && earth2dFallback) {
createGadgetUI('maps');
return;
}
var createOptions = {};
var sphere = 'earth';
if (sphere == 'mars' || sphere == 'moon')
createOptions = {
database: 'http://khmdb.google.com/?db=' + sphere
};
google.earth.createInstance('mapcontainer', function (pluginInstance) {
ge = pluginInstance;
if (sphere == 'sky')
ge.getOptions().setMapType(ge.MAP_TYPE_SKY);
ge.getWindow().setVisibility(true);
ge.getNavigationControl().setVisibility(
showNavControls ? ge.VISIBILITY_AUTO : ge.VISIBILITY_HIDE);
if (sphere == 'earth') {
ge.getLayerRoot().enableLayerById(ge.LAYER_BUILDINGS,
true);
ge.getLayerRoot().enableLayerById(ge.LAYER_TERRAIN,
true);
ge.getLayerRoot().enableLayerById(ge.LAYER_ROADS,
true);
ge.getLayerRoot().enableLayerById(ge.LAYER_BORDERS,
true);
}
if (kmlUrl) {
var link = ge.createLink('');
link.setHref(kmlUrl);
var nl = ge.createNetworkLink('');
nl.setLink(link);
nl.setFlyToView(true);
var originalFlyToSpeed = ge.getOptions().getFlyToSpeed();
if (!earthFlyFromSpace)
ge.getOptions().setFlyToSpeed(ge.SPEED_TELEPORT);
ge.getFeatures().appendChild(nl);
window.setTimeout(function () {
ge.getOptions().setFlyToSpeed(originalFlyToSpeed);
}, 500);
}
}, function (error) {
if (earth2dFallback) {
createGadgetUI('maps');
}
}, createOptions);
}
}
google.setOnLoadCallback(initGadget);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment