Skip to content

Instantly share code, notes, and snippets.

@And-How

And-How/index.html

Created October 10, 2013 16:56
Show Gist options
  • Save And-How/6921788 to your computer and use it in GitHub Desktop.
Save And-How/6921788 to your computer and use it in GitHub Desktop.
Download ZIP
testing vogb's layers control tilemill plugin
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet"
href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.css"/>
<link rel="stylesheet"
href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.ie.css"/>
<style>
#map {
width: 640px;
height: 480px;
}
</style>
</head>
<body>
<div id="map"></div>
<script src="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.js"></script>
<script src="../node_modules/Leaflet.ActiveLayers/dist/leaflet.active-layers.min.js"></script>
<script src="../dist/leaflet.select-layers.min.js"></script>
<script>
function test() {
var attribution = '&copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>';
var mapnik = L.tileLayer(
'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
, {attribution: attribution}
)
var blackAndWhite = L.tileLayer(
'http://{s}.www.toolserver.org/tiles/bw-mapnik/{z}/{x}/{y}.png'
, {attribution: attribution}
)
var clouds = L.tileLayer('http://{s}.tile.openweathermap.org/map/clouds/{z}/{x}/{y}.png', {
attribution: 'Map data &copy; <a href="http://openweathermap.org">OpenWeatherMap</a>'
, opacity: 0.5
})
var wind = L.tileLayer('http://{s}.tile.openweathermap.org/map/wind/{z}/{x}/{y}.png', {
attribution: 'Map data &copy; <a href="http://openweathermap.org">OpenWeatherMap</a>'
, opacity: 0.5
})
var temperature = L.tileLayer('http://{s}.tile.openweathermap.org/map/temp/{z}/{x}/{y}.png', {
attribution: 'Map data &copy; <a href="http://openweathermap.org">OpenWeatherMap</a>'
, opacity: 0.5
})
var map = L.map('map', {
center: new L.LatLng(39.73, -104.99), zoom: 10, layers: [mapnik, clouds]
});
var baseMaps = {
"Mapnik": mapnik, "Black and White": blackAndWhite
};
var overlayMaps = {
"Clouds": clouds,
"Wind": wind,
"Temperature": temperature
};
//var control = L.control.layers(baseMaps, overlayMaps)
var control = L.control.selectLayers(baseMaps, overlayMaps)
control.addTo(map);
}
test()
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment