明治日本の産業革命遺産

「明治日本の産業革命遺産」のGeoJSONデータ作りました。

自己責任の範囲でご自由にお使いください。

GeoJSON

データ取得元

明治日本の産業革命遺産　九州・山口と関連地域

データ取得日

2015/07/07

<!DOCTYPE html>
<meta charset="utf-8">
<style>
html, body , #map {
	margin: 0px;
	padding: 0px;	
	width: 100%;
	height: 100%;
}

.popup {
	width: 200px;
}
</style>
<link rel="stylesheet" href="https://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />

function draw(geodata) {
	map = L.map('map').setView([36.3265281, 139.00918460000003], 6);
	
	//地理院地図レイヤー追加
	L.tileLayer(
		'https://cyberjapandata.gsi.go.jp/xyz/pale/{z}/{x}/{y}.png',
		{
			attribution: "<a href='https://www.gsi.go.jp/kikakuchousei/kikakuchousei40182.html' target='_blank'>国土地理院</a>"
		}
	).addTo(map);

var onEachFeature = function(feature, layer) {
			if (!feature.properties) return ;
			var p = feature.properties;
			var properties = '<div class="popup">';
			if (p.name) properties += '<center>'+ p.name + '<center>';
			if (p.img) properties += '<center><img src="'+ p.img + '" /></center>';
			if (p.link) properties += '<p><a href="'+ p.link + '">link</a>';
			properties += '</div>';
			layer.bindPopup(properties);
	}	
	
	var geojsonLayer = L.geoJson(null, {onEachFeature:onEachFeature}).addTo(map);
	geojsonLayer.addData(geodata);
}
	
</script>
</body>
</html>

Modified http://cdn.leafletjs.com/leaflet-0.7.3/leaflet-src.js to a secure url

https://cdn.leafletjs.com/leaflet-0.7.3/leaflet-src.js

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js