Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
地球地図を利用した 
地図タイルの作成 
Taro Matsuzawa 
Georepublic Japan 
FOSS4G TOKYO 2014 全体セッション2 
手軽に使えるグローバル地理空間情報とFOSS4G
自己紹介 
• プログラマ 
• 過去に某OSSの組で組長をやっていました 
• 地理空間情報系の経験は約3年 
• 学生時代のアルバイト(馬場さんの元部下)半年 
• Georepublic Japan で二年ちょい 
• ブレイクコアガチ勢
執筆とか 
• Firefox 3 Hacks, Firefox Hacks 
Rebooted (O’REILLY JAPAN) 
• C Magazine 
• Software Design 
• いずれもFirefoxの話
肩書 
• Georepublic Japan シニアエンジニア 
• 日本UNIXユーザ会理事 
• OSMFJメンバー 
• OSGeo財団日本支部運営委員<-New 
• 株式会社Coaido CTO (副業) <- New
アカウント 
• github: https://github.com/smellman/ 
• Twitter: @smellman 
• Facebook: 名前で探せば出てくる
面倒なので 
組長と呼ばれてます
専門家? 
• たまたま国土地理院の「地球地図Web提供用デー 
タ整備ツール作成 」を受注できた 
• JICAの講習(10/29-30)を担当 
• 同じネタを使ってFOSS4G TOKYOのハンズ 
オンを担当(10/31) 
• ベース...
今日のトピック 
• タイルの話 
• 地球地図のベクターファイルをタイルにする 
• 地球地図のラスターファイルをタイルにする 
• タイルを使ったデモ 
• 細かいやり方はワークショップのテキストを公 
開するのでそっちを見て欲しい
ポイント 
• 今回の話は地球地図を使っているけど、地球地 
図以外でも使える話 
• タイルを作る勉強用の素材としても地球地図は 
使える 
• タイル仕様をdisる
タイルの話
ややこしいタイル 
• 有名な仕様が二つある 
• TMS, WMTS 
• TMSとWMTSは原点が違う 
• TMSは左下(数学的) 
• WMTSは右上(コンピュータ的)
世界は雑 
• TMSもWMTSも面倒 
• TMSのY座標を逆にすればよくね? 
• Y coordinate flipped 
• OpenStreetMap
メタデータなにそれ? 
• TMSもWMTSもメタデータの仕様がある 
• どのようなURLでタイルにアクセスできるか? 
• どのようなタイルが利用可能なのか? 
• みんなもはや無視してる 
• http://…/{z}/{x}/{y}.p...
無視した事案 
• OpenStreetMap 
• メタデータ見たことない 
• 国土地理院 
• 仕様に見当たらない
本当に欲しいもの
XMLっぽく言うと 
我々が必要だったのは 
WSDLでもSOAPでも 
なくXML-RPCだった 
だろ?
そもそもJSONで?
タイルも二の舞いになってはいけない
xyzタイル 
• y coordinate flipped TMS と WMTS がだいた 
い同じタイルを出している 
• 便宜上xyzタイルと呼ぶ 
• 今回作るのはこいつ
もういいよこれで 
http://portal.cyberjapan.jp/help/development/siyou.html
悪巧み 
• xyz tileをRFC化 
• 4/1にリリースして世界を混乱させよう
_人人人人人人人人_ 
> タイル三兄弟 < 
‾Y^Y^Y^Y^Y^Y^Y‾
タイルを作る
用意するもの 
• OSGeoLive 8.0 
• ベースはこれだけでOK! 
• OSGeo4W+Tilemillでも別々に入れてもOK 
• batchファイルをいれる必要がある 
• tms2xyz.pyというプログラムは別途紹介
ダウンロード 
• https://iscgm.org/gmd/
ベクタから変換の 
ワークフロー 
ogr2ogr 
Tilemill 
mb-util 
gmlファイルをshpファイルに変換 
デザインを作成して、 
mbtiles形式でタイルを出力 
mbtiles形式のタイルを 
xyzタイルに変換
mbtiles 
• MapBoxが作成したタイルの仕様 
• SQLiteにタイルを格納するもの 
• 取り出しもクエリ吐くだけでよい 
• 中身のY座標はTMS準拠 
• 作者が後悔してて笑える 
• スマートフォンに入れてオフラインマップ...
gmlからshpに変換 
• ogr2ogrを使って変換を行う 
$ ogr2ogr -s_srs "+proj=latlong +datum=WGS84 
+axis=neu +wktext"  
-t_srs "+proj=latlong ...
Tilemillでデザイン 
• Tilemillでshpのレイヤーを追加 
• CartoCSSを駆使してデザインをする 
• デザインセンスが問われる
コツ 
• MapBoxにデザイン方法の解説があるのでパクりまくる 
• https://www.mapbox.com/tilemill/docs/manual/ 
carto/ 
• Pointの画像はMakiを利用するとよい 
• http...
Tilemillの編集例
Tilemillの編集例
仕様の読み方
mbtilesを出力
mbtilesを出力
mbutilで変換 
$ git clone https://github.com/mapbox/mbutil.git 
$ cd mbutil/ 
$ sudo python setup.py install 
$ cd ~/work/lka...
できたもの 
work/lka/tiles/lka_bnd/9/370/242.png
ラスタから変換の 
ワークフロー 
gdal_buildvrt 
gdaltraslate 
QGIS 
gdal2tiles.py 
BILファイルからGeoTiffを作成 
色付けをしたGeoTiffを作成 
GeoTiffからTMSタイル...
GeoTiffを作成 
• 地球地図で配ってるTiffファイルはgdal2tilesで 
処理できないのでBILファイルから処理をする 
• BILファイルは分割されてるので一つにまとめる 
$ gdalbuildvrt --config GD...
QGISで開く
スタイル付けをする
色付けしたGeoTiff
gdal2tiles.pyを使って 
TMSタイルを作成 
• -r: サンプリング方法 
• -e: レジューム 
• -z: ズームレベルの範囲 
$ gdal2tiles.py -r near -e -v -z 0-11  
raster...
tms2xyz.pyを使って 
xyzタイルを作成 
• https://github.com/smellman/ 
creating_tiles_with_global_map_support_files
ラスタからの変換時の注意点 
• gdal2tilesでたまにコケる 
• フィリピンの標高データでひっかかってるのは 
確認 
• gdalwarpで解像度を変更すれば回避可能 
• というかgdal2tilesのバグ
デモ
Leafletで表示
とっても簡単 
var bnd_layer = L.tileLayer( 
'./lka/tiles/lka_bnd/{z}/{x}/{y}.png'); 
var overlay_layers = { 
"Boundary": bnd_lay...
おまけ
とある質問 
• JICAの研修生から質問 
• 「なぜコマンドラインのような面倒なものを使 
うのか?ArcGIS使えばいいのではないか」
使った事ないので 
知らない
なぜFOSSで? 
• コマンドの方が楽(身も蓋もない話) 
• コマンドを使えば繰り返し処理が楽 
• OSの壁があまりない(今回のはWindows, Linux, 
Macで動く)
タイル化の良いとこ 
• file urlを使えばローカルで動かせる(PC環境) 
• mbtilesを使えば持ち運びはもっと楽 
• スマートフォンに地図をいれて調査に出るとか 
簡単に可能
もっとタイル化 
• 標高データは上手く加工すれば地理院地図3D的な 
ことも可能 
• 標高タイルの分野は結構熱い(Cesium 
quantized-mesh, heightmap) 
• こいつらもTMS準拠でさらにrootが異なるの 
...
タイル化の注意 
• 世界中を吐き出すと大量のファイルを書き出す 
• zoom=18 - 680億ファイルぐらい 
• Ext4のデフォルトの限界を超える(40億ファイ 
ル) 
• ファイルシステムを作るときにファイル作成数及 
びファイル...
gdal2tilesが遅い 
• 地球地図の全球版のファイルを変換するとすご 
い時間がかかる 
• Core i3+4GB Memoryのマシンで1週間以上 
かかる 
• 遅い理由は分散処理をしてなく1つずつタイル 
を作るから
高速なgdal2tiles 
• タイルを作成するプロセスをファイル単位で 
offsetを設定して分散化する 
プロセス1 2 3 4 
ファイル0.png 1.png 2.png 3.png 
ファイル4.png 5.png 6.png 7...
人類のためにgdal2tiles作り 
なおした方がいい気がする 
(TMSしか吐かないし!)
以上
地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2
地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2
Upcoming SlideShare
Loading in …5
×

地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2

6,021 views

Published on

FOSS4G TOKYO 2014の全体セッション2でやった(これから発表する)スライドです。
地球地図をタイル化します。
ただそれだけです。
きっとそれだけです...

Published in: Engineering
  • Be the first to comment

地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2

  1. 1. 地球地図を利用した 地図タイルの作成 Taro Matsuzawa Georepublic Japan FOSS4G TOKYO 2014 全体セッション2 手軽に使えるグローバル地理空間情報とFOSS4G
  2. 2. 自己紹介 • プログラマ • 過去に某OSSの組で組長をやっていました • 地理空間情報系の経験は約3年 • 学生時代のアルバイト(馬場さんの元部下)半年 • Georepublic Japan で二年ちょい • ブレイクコアガチ勢
  3. 3. 執筆とか • Firefox 3 Hacks, Firefox Hacks Rebooted (O’REILLY JAPAN) • C Magazine • Software Design • いずれもFirefoxの話
  4. 4. 肩書 • Georepublic Japan シニアエンジニア • 日本UNIXユーザ会理事 • OSMFJメンバー • OSGeo財団日本支部運営委員<-New • 株式会社Coaido CTO (副業) <- New
  5. 5. アカウント • github: https://github.com/smellman/ • Twitter: @smellman • Facebook: 名前で探せば出てくる
  6. 6. 面倒なので 組長と呼ばれてます
  7. 7. 専門家? • たまたま国土地理院の「地球地図Web提供用デー タ整備ツール作成 」を受注できた • JICAの講習(10/29-30)を担当 • 同じネタを使ってFOSS4G TOKYOのハンズ オンを担当(10/31) • ベースはいずれも国土地理院の案件の知見
  8. 8. 今日のトピック • タイルの話 • 地球地図のベクターファイルをタイルにする • 地球地図のラスターファイルをタイルにする • タイルを使ったデモ • 細かいやり方はワークショップのテキストを公 開するのでそっちを見て欲しい
  9. 9. ポイント • 今回の話は地球地図を使っているけど、地球地 図以外でも使える話 • タイルを作る勉強用の素材としても地球地図は 使える • タイル仕様をdisる
  10. 10. タイルの話
  11. 11. ややこしいタイル • 有名な仕様が二つある • TMS, WMTS • TMSとWMTSは原点が違う • TMSは左下(数学的) • WMTSは右上(コンピュータ的)
  12. 12. 世界は雑 • TMSもWMTSも面倒 • TMSのY座標を逆にすればよくね? • Y coordinate flipped • OpenStreetMap
  13. 13. メタデータなにそれ? • TMSもWMTSもメタデータの仕様がある • どのようなURLでタイルにアクセスできるか? • どのようなタイルが利用可能なのか? • みんなもはや無視してる • http://…/{z}/{x}/{y}.png でいいだろ
  14. 14. 無視した事案 • OpenStreetMap • メタデータ見たことない • 国土地理院 • 仕様に見当たらない
  15. 15. 本当に欲しいもの
  16. 16. XMLっぽく言うと 我々が必要だったのは WSDLでもSOAPでも なくXML-RPCだった だろ?
  17. 17. そもそもJSONで?
  18. 18. タイルも二の舞いになってはいけない
  19. 19. xyzタイル • y coordinate flipped TMS と WMTS がだいた い同じタイルを出している • 便宜上xyzタイルと呼ぶ • 今回作るのはこいつ
  20. 20. もういいよこれで http://portal.cyberjapan.jp/help/development/siyou.html
  21. 21. 悪巧み • xyz tileをRFC化 • 4/1にリリースして世界を混乱させよう
  22. 22. _人人人人人人人人_ > タイル三兄弟 < ‾Y^Y^Y^Y^Y^Y^Y‾
  23. 23. タイルを作る
  24. 24. 用意するもの • OSGeoLive 8.0 • ベースはこれだけでOK! • OSGeo4W+Tilemillでも別々に入れてもOK • batchファイルをいれる必要がある • tms2xyz.pyというプログラムは別途紹介
  25. 25. ダウンロード • https://iscgm.org/gmd/
  26. 26. ベクタから変換の ワークフロー ogr2ogr Tilemill mb-util gmlファイルをshpファイルに変換 デザインを作成して、 mbtiles形式でタイルを出力 mbtiles形式のタイルを xyzタイルに変換
  27. 27. mbtiles • MapBoxが作成したタイルの仕様 • SQLiteにタイルを格納するもの • 取り出しもクエリ吐くだけでよい • 中身のY座標はTMS準拠 • 作者が後悔してて笑える • スマートフォンに入れてオフラインマップとかできる • MapBox iOS SDK, MapBox Android
  28. 28. gmlからshpに変換 • ogr2ogrを使って変換を行う $ ogr2ogr -s_srs "+proj=latlong +datum=WGS84 +axis=neu +wktext" -t_srs "+proj=latlong +datum=WGS84 +axis=enu +wktext" -f "ESRI Shapefile" coastl_lka.shp coastl_lka.gml
  29. 29. Tilemillでデザイン • Tilemillでshpのレイヤーを追加 • CartoCSSを駆使してデザインをする • デザインセンスが問われる
  30. 30. コツ • MapBoxにデザイン方法の解説があるのでパクりまくる • https://www.mapbox.com/tilemill/docs/manual/ carto/ • Pointの画像はMakiを利用するとよい • https://www.mapbox.com/maki/ • zoomレベルによる振り分けは根気よくやる • 仕様を見ながら表示するものを決める
  31. 31. Tilemillの編集例
  32. 32. Tilemillの編集例
  33. 33. 仕様の読み方
  34. 34. mbtilesを出力
  35. 35. mbtilesを出力
  36. 36. mbutilで変換 $ git clone https://github.com/mapbox/mbutil.git $ cd mbutil/ $ sudo python setup.py install $ cd ~/work/lka $ mkdir tiles $ mb-util mbtiles/lka_bnd.mbtiles tiles/lka_bnd
  37. 37. できたもの work/lka/tiles/lka_bnd/9/370/242.png
  38. 38. ラスタから変換の ワークフロー gdal_buildvrt gdaltraslate QGIS gdal2tiles.py BILファイルからGeoTiffを作成 色付けをしたGeoTiffを作成 GeoTiffからTMSタイルを作成 tms2xyz.py TMSタイルからxyzタイルを作成
  39. 39. GeoTiffを作成 • 地球地図で配ってるTiffファイルはgdal2tilesで 処理できないのでBILファイルから処理をする • BILファイルは分割されてるので一つにまとめる $ gdalbuildvrt --config GDAL_CACHEMAX 2048 el_lka.vrt el/globalm/area/raster/el*.bil $ gdal_translate -a_srs EPSG:4326 --config GDAL_CACHEMAX 2048 el_lka.vrt el_lka.tif
  40. 40. QGISで開く
  41. 41. スタイル付けをする
  42. 42. 色付けしたGeoTiff
  43. 43. gdal2tiles.pyを使って TMSタイルを作成 • -r: サンプリング方法 • -e: レジューム • -z: ズームレベルの範囲 $ gdal2tiles.py -r near -e -v -z 0-11 raster/el_lka.tiff tms/el_lka
  44. 44. tms2xyz.pyを使って xyzタイルを作成 • https://github.com/smellman/ creating_tiles_with_global_map_support_files
  45. 45. ラスタからの変換時の注意点 • gdal2tilesでたまにコケる • フィリピンの標高データでひっかかってるのは 確認 • gdalwarpで解像度を変更すれば回避可能 • というかgdal2tilesのバグ
  46. 46. デモ
  47. 47. Leafletで表示
  48. 48. とっても簡単 var bnd_layer = L.tileLayer( './lka/tiles/lka_bnd/{z}/{x}/{y}.png'); var overlay_layers = { "Boundary": bnd_layer }; L.control.layers(base_layers, overlay_layers).addTo(map);
  49. 49. おまけ
  50. 50. とある質問 • JICAの研修生から質問 • 「なぜコマンドラインのような面倒なものを使 うのか?ArcGIS使えばいいのではないか」
  51. 51. 使った事ないので 知らない
  52. 52. なぜFOSSで? • コマンドの方が楽(身も蓋もない話) • コマンドを使えば繰り返し処理が楽 • OSの壁があまりない(今回のはWindows, Linux, Macで動く)
  53. 53. タイル化の良いとこ • file urlを使えばローカルで動かせる(PC環境) • mbtilesを使えば持ち運びはもっと楽 • スマートフォンに地図をいれて調査に出るとか 簡単に可能
  54. 54. もっとタイル化 • 標高データは上手く加工すれば地理院地図3D的な ことも可能 • 標高タイルの分野は結構熱い(Cesium quantized-mesh, heightmap) • こいつらもTMS準拠でさらにrootが異なるの で注意 • 範囲が-90deg ~ 90degなのも注意
  55. 55. タイル化の注意 • 世界中を吐き出すと大量のファイルを書き出す • zoom=18 - 680億ファイルぐらい • Ext4のデフォルトの限界を超える(40億ファイ ル) • ファイルシステムを作るときにファイル作成数及 びファイル容量を試算しておく必要がある
  56. 56. gdal2tilesが遅い • 地球地図の全球版のファイルを変換するとすご い時間がかかる • Core i3+4GB Memoryのマシンで1週間以上 かかる • 遅い理由は分散処理をしてなく1つずつタイル を作るから
  57. 57. 高速なgdal2tiles • タイルを作成するプロセスをファイル単位で offsetを設定して分散化する プロセス1 2 3 4 ファイル0.png 1.png 2.png 3.png ファイル4.png 5.png 6.png 7.png ファイル8.png 9.png 10.png 11.png
  58. 58. 人類のためにgdal2tiles作り なおした方がいい気がする (TMSしか吐かないし!)
  59. 59. 以上

×