Create a gist now

Instantly share code, notes, and snippets.

wellknown.js demo
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>GSI Tiles on Leaflet</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.2/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.2/dist/leaflet.js"></script>
<script src="https://cdn.rawgit.com/mapbox/wellknown/master/wellknown.js"></script>
<style>
body {padding: 0; margin: 0}
html, body, #map {height: 100%; width: 100%;}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map = L.map('map');
L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
attribution: "<a href='http://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
}).addTo(map);
map.setView([35.3622222, 138.7313889], 5);
// shinjuku gyoen
var wkt = "POLYGON ((139.703950881958 35.68637211508593, 139.7068691253662 35.688812053743945, 139.7152805328369 35.687626950002496, 139.71502304077148 35.684489825701824, 139.71613883972168 35.68225890670173, 139.71176147460938 35.6807251137039, 139.7050666809082 35.68379267021534, 139.703950881958 35.68637211508593))";
var geojson = L.geoJson(wellknown.parse(wkt));
geojson.addTo(map);
map.fitBounds(geojson.getBounds());
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment