Skip to content

Instantly share code, notes, and snippets.

@tyrasd

tyrasd/index.html

Last active December 16, 2015 22:49
Show Gist options
  • Save tyrasd/5509502 to your computer and use it in GitHub Desktop.
Save tyrasd/5509502 to your computer and use it in GitHub Desktop.
Download ZIP
compare osm with province BZ data
Raw
index.html
<!DOCTYPE html>
<!-- this document under WFTPL -->
<!-- this document shows data from various sources (OSM data under ODbL, data from province of Bolzano / Italy (unknown licence) -->
<html>
<head>
<title>compare osm with province BZ data</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.ie.css" /><![endif]-->
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script>
</head>
<body>
<h1>compare osm with province BZ data</h1>
<div id="map1" style="width: 800px; height: 400px; margin:10px;"></div>
<div id="map2" style="width: 800px; height: 400px; margin:10px;"></div>
<script>
var map1 = L.map('map1').setView([46.48173, 11.33000], 15);
L.tileLayer('http://{s}.tile.openstreetmap.com/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: 'data and imagery &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors (<a href="http://osm.org/copyright">terms</a>)'
}).addTo(map1);
var map2 = L.map('map2').setView([46.48173, 11.33000], 15);
var tnLayer = L.tileLayer.wms("http://sdi.provinz.bz.it/geoserver/wms", {
layers: "WMTS_TRANSPORT-NETWORK_APB-PAB",
format: "image/png",
version: "1.3",
srs: "EPSG:3857",
attribution: 'data and imagery &copy; <a href="http://sdi.provinz.bz.it">province of BZ</a> (unknown licence)'
}).addTo(map2);
var topoLayer = L.tileLayer.wms("http://sdi.provinz.bz.it/geoserver/gwc/service/wms", {
layers: "WMTS_TOPOMAP_APB-PAB",
format: "image/png",
version: "1.3",
srs: "EPSG:3857",
attribution: 'data and imagery &copy; <a href="http://sdi.provinz.bz.it">province of BZ</a> (unknown licence)'
});
var grenzLayer = L.tileLayer.wms("http://sdi.provinz.bz.it/geoserver/inspire/wms", {
layers: "AU.AdministrativeBoundary",
format: "image/png",
version: "1.3",
srs: "EPSG:3857",
attribution: 'data and imagery &copy; <a href="http://sdi.provinz.bz.it">province of BZ</a> (unknown licence)'
});
L.control.layers({
"transport network": tnLayer,
"topomap": topoLayer,
"boundaries": grenzLayer,
}).addTo(map2);
var m_marker = L.marker([0,0]).addTo(map2);
map1.on("moveend zoomend", function(e) {
map2.setView(map1.getCenter(), map1.getZoom(), true);
});
map1.on("mousemove", function(e) {
m_marker.setLatLng(e.latlng);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment