世界の測量

Sibling of "Relevant, Timely, and Accurate, " but much lighter and shorter ※自らの所属する組織の見解を示すものでない

Leaflet で電子国土タイルを使う場合のシンプルサンプル

Leaflet で電子国土タイルを使う場合、電子国土のタイルスキームをどのように表現するか悩ましいところ。次のように書くと整理して書けると思う。シンプルに使いたい場合のサンプルとして。
なお、Leafletは新しいものを使う必要がある。古いものの場合、getTileUrl(coord) について、coord.z がないバージョンがある。具体的には、Leafletから安定版として提供している 0.5 や 0.5.1 では、coord.z がとれないためか、下の方法ではうまく動かない。新しいもの（http://leafletjs.com/download.html にある Leaflet master）の場合には、coord.x, coord.y, coord.z が揃っているので以下の方法が使える。なお、mapbox.js は coord.z が使える。

<!doctype html>
<meta charset="utf-8">
<title>Digital Japan / Leaflet</title>
<link rel="stylesheet" href="leaflet.css" />
 <!--[if lte IE 8]>
     <link rel="stylesheet" href="leaflet.ie.css" />
 <![endif]-->
<script src="leaflet.js"></script>
<script src="https://raw.github.com/mlevans/leaflet-hash/master/leaflet-hash.js"></script>
<!-- <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> -->
<style>
html, body, #map {height: 100%; width:100%;}
body {padding: 0; margin: 0}
</style>
<body>
<div id="map"></div>
<script>
map = L.map(map).setView([35.6811, 139.7678], 16);
map.attributionControl.setPrefix('a map by CTKK');
layers = [
  null, null, null, null, null, 
  ['http://cyberjapandata.gsi.go.jp/sqras/all/JAIS/latest/', '.png'], // 5
  ['http://cyberjapandata.gsi.go.jp/sqras/all/JAIS/latest/', '.png'], // 6
  ['http://cyberjapandata.gsi.go.jp/sqras/all/JAIS/latest/', '.png'], // 7
  ['http://cyberjapandata.gsi.go.jp/sqras/all/JAIS/latest/', '.png'], // 8
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD1000K/latest/', '.png'], // 9
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD1000K/latest/', '.png'], // 10
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD1000K/latest/', '.png'], // 11
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD200K/latest/', '.png'], // 12
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD200K/latest/', '.png'], // 13
  ['http://cyberjapandata.gsi.go.jp/sqras/all/BAFD200K/latest/', '.png'], // 14
  ['http://cyberjapandata.gsi.go.jp/sqras/all/DJBMM/latest/', '.png'], // 15
  ['http://cyberjapandata.gsi.go.jp/sqras/all/DJBMM/latest/', '.png'], // 16
  ['http://cyberjapandata.gsi.go.jp/sqras/all/DJBMM/latest/', '.png'], // 17
  ['http://cyberjapandata.gsi.go.jp/sqras/all/FGD/latest/', '.png'] // 18
];

var layer = L.tileLayer('nil', {tileSize: 256, minZoom: 5, maxZoom: 18, attribution: '電子国土'});
layer.getTileUrl = function(coord) {
  var tid = ('0000000' + coord.x).slice(-7) + ('0000000' + coord.y).slice(-7);
  return layers[coord.z][0] + coord.z + '/' + tid.charAt(0) + tid.charAt(7) + '/' + tid.charAt(1) + tid.charAt(8) + '/' + tid.charAt(2) + tid.charAt(9) + '/' + tid.charAt(3) + tid.charAt(10) + '/' + tid.charAt(4) + tid.charAt(11) + '/' + tid.charAt(5) + tid.charAt(12) + '/' + tid + layers[coord.z][1];
}
map.addLayer(layer);
L.marker([35.6811, 139.7678]).addTo(map);
var hash = new L.Hash(map);
</script>
</body>