Skip to content

Instantly share code, notes, and snippets.

@tmcw

tmcw/index.html

Forked from wboykinm/index.html
Last active December 12, 2015 03:48
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 tmcw/4709607 to your computer and use it in GitHub Desktop.
Save tmcw/4709607 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<DOCTYPE html>
<html>
<head>
<script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.js'></script>
<link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.7/mapbox.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
#map-ui {
position:absolute;
top:50px;left:10px;
z-index:100;
}
#map-ui ul {
list-style:none;
margin:0;padding:0;
}
#map-ui a {
font-size:14px;
background:#FFF;
color:#3C4E5A;
display:block;
margin:0;padding:0;
border:1px solid #BBB;
min-width:138px;
padding:10px;
text-decoration:none;
-webkit-border-radius:8px;
border-radius:8px;
}
#map-ui a.active {
background:#3887BE;
border-color:#3887BE;
color:#FFF;
}
</style>
</head>
<body>
<div id='map'>
<div id='map-ui'>
<ul>
<li><a href='#' class='active' id='reference'>Turn Labels Off</a></li>
</ul>
</div>
</div>
<script>
//@ewedistrict's S3 tileset parser
function setViewportFromArgs(){
var urlhash = window.location.hash;
if( urlhash != "" ){
urlhash = urlhash.substring(1); //remove the hash
var parts = urlhash.split("&");
var coord = {};
for(var i=0; i<parts.length; i++){
var keyval = parts[i].split("=");
if(keyval[0]==="lat" || keyval[0]==="lon") {
coord[keyval[0]] = parseFloat(keyval[1])
} else if(keyval[0]==="z"){
coord.z = parseInt(keyval[1]);
} else if(keyval[0]==="o"){
coord.o = keyval[1];
}
}
if( coord.lat && coord.lon ){
lat = coord.lat;
lon = coord.lon;
}
if( coord.z ){
zoom = coord.z;
}
if( coord.o ){
labels = coord.o==="t";
}
}
}
function roundToPlace(x,places){
return Math.round(x*Math.pow(10,places))/Math.pow(10,places);
}
//Mapbox.js implementation
var m = mapbox.map('map');
m.addLayer(new MM.TemplatedLayer('http://mt{S}.bmander.com/tiles/{Z}/{X}/{Y}.png', [0, 1, 2, 3]));
var reference = mapbox.layer().id('landplanner.map-mcowljes');
m.addLayer(reference);
//m.addLayer(mapbox.layer().id('landplanner.map-mcowljes'));
m.ui.attribution.add().content('Reference Data <a href="http://openstreetmap.org">&copy; OpenStreetMap Contributors</a>.');
m.ui.zoomer.add();
m.ui.zoombox.add();
m.zoom(4).center({ lat: 40, lon: -90 });
document.getElementById('reference').onclick = function() {
(!reference.enabled) ? reference.enable() : reference.disable();
this.className = reference.enabled ? 'active' : '';
return false;
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment