SlideShare a Scribd company logo
FOSS4G と Web によ
 る地図公開の共有
       日本語仮訳

 国土交通省 海外プロジェクト推進課
       国際協力官
       藤村 英範

                     1
電子国土の海外展開
• 日本で実証されたインフラの技術と政策を
  海外展開することは日本の戦略のひとつ。

• 海外展開可能が見込まれる施策のひとつ:
  基本測量・公共測量で得られた地図をオー
  プンアクセスで提供すること=電子国土

• 電子国土を海外展開できるか?


                    2
電子国土
     国土地理院の Web マッピング戦略
• 様々な主体からの情報が国土地理院の公的地図
  の上で共有されるべき。
• タイル化された地形図データ+地図フレームを
  制御し情報を重ね合わせる API 。
2003 年 電子国土 Web サービス開始




                  http://cyberjapan.jp/

                                   3
電子国土 Web システム
• Version 1 (2003)
  – Internet Explorer 用 Active X component + JavaScript
    API                               Google Maps (2004)
                                        日本版 Google Maps (2005)
• Version 2 (2008)
                                        OpenLayers (2006)
  – ピュア JavaScript API
• Version 3 (2011)
  – OpenLayers 上に構築された JavaScript API
• Version 4 (2012)
  – OpenLayers のアドオン
                                                            4
OpenLayers アプリケーション
     電子国土       geoSERBIA


日本                  セルビア
OS OpenSpace   geoportal.md

英国               Moldova The slippy
                              map
               天地図
                              OSM
                    中国                5
オープンソースを通じた協力的な進化
   電子国土は
   OpenLayers の改良
   に追従できる



日本は
電子国土の
システムを
相手国に
共有できる




                    OpenLayers を改良すること
                    で、誰もが電子国土を改良
                    できる                  6
OpenLayers だけじゃない① :
他の Web マッピングライブラリ
様々なオープンソース   タイルへのオープンアクセス
ライブラリをもちいた   +オープンソースライブラリ
、様々な実装




                        7
OpenLayers だけじゃない② :
         地図タイル生成




2011 年 ジグソーパズルのピースがはまった。
全パッケージ(少なくとも導入フェーズの)が完成。   8
TileMill – ジグソーパズルの最後のピース
Mapnik をレンダラに使用し、 Carto をスタイルシート言語に使用
し、 node.js を用いたローカル Web サーバを使用する地図作成のための
デザイン環境。デフォルトで TileMill はタイル画像の SQLite バンドル
である MBTiles を生成する。 3 項 BSD ライセンス。




        この地図の作成に当たっては、国土地理院長の承認を得て、同院発行の基盤地図情報を使用した。 ( 承認番号 平 24 情使、
        第 29 号 ) / some map data (c) OpenStreetMap contributors
                                                                       9
国土地理院の 2012 年 JICA 研修での
タイルベース Web マッピングの提案




  TileMill
  TileMill   講義
             講義
 ハンズオン
 ハンズオン
                      10
TileMill ハンズオン
2012 年 JICA 環境地図(地球地図)作成コース
でのハンズオンを行ったところ、全研修生がタ
イルベース Web マッピングサービスを数時間で
構築できることが明らかになっ
た。 http://tiles.mapbox.com/fujimura-h2a3/map/Global_Map_Brazil




                                                             11
ハンズオンのステップ
1.   TileMill のダウンロードとインストール
2.   地球地図のダウンロード
3.   地球地図を TileMill にロード
4.   TileMill 内で地球地図をスタイリング
5.   地図の書き出しと公開




                               12
1. Download & Install
http://mapbox.com/tilemill/




                              13
2. Download Global Map data
http://www.iscgm.org/ -> Download




                                    14
Start TileMill and create a New Project




                                    15
Open the project you created.




                                16
“Add Layer” for Global Map data




                             17
“Add Layer” for Global Map data




                             18
Select data source
First try with polbnda.shp




                               19
SRS = WGS84 and “Save & Style”




                            20
You will see your data




                         21
To change the style of data…
                                           Click to reflect the
                                           Change to the map.




                                 Edit to change the style.
                                 Syntax: click    on the left
 Drag to change the draw order   for help

                                                                  22
Make a map




• Builtupa,watrcrsl, roadl, inwatera…   23
Scale dependent rendering
        [zoom > n]




                            24
Next: export to the web
 Step 1: project setting




       Limit the spatial bounds and zoom
       span so that the data size < 50MB


                                           25
Export -> Upload




                   26
Now your map is ready on the Web.




                               27
発展 : テキスト注記




text-face-name, text-name, text-fill, text-
placement                                     28
発展 : 組み込み① iframe




This example available at
http://www.handygeospatial.info/2012/07/26/1/




                                                29
発展 : 組み込み② Leaflet + Wax
                                                You also need to download
                                                   some JavaScript library
                                                   files from
                                                   http://mapbox.com/publis
                                                   hing/leaflet/




This example available at
http://www.handygeospatial.info/2012/07/26/2/                       30
まとめ
• タイルベース Web マッピングは国家地図作
  成機関の間で既に共通の好実践であり、そ
  のプロセスは最近簡単になった。
• TileMill は、最初のパッケージの最後のピー
  スであった。
• TileMill ハンズオンにおいて、 JICA 研修員は
  数時間でタイルベース Web マップサービス
  を公開することができた。
• 国家地図作成機関からのタイルベース Web
  マッピングは、 FOSS4G のおかげで国際的
  に推進し得る。
                              31

More Related Content

Similar to FOSS4GとWebによる地図公開の共有 (20)

PDF
Tile map 2011_foss4g_osaka
masarunarazaki
 
PDF
タイル地図がおもしろい
Kohei Otsuka
 
PDF
自由な地図を作るオープンストリートマップの活動
Shu Higashi
 
PDF
2012 06 30_osm-ws_1a
Tom Hayakawa
 
PDF
2012 05 12_osc2012_nagoya_osm
Tom Hayakawa
 
PDF
2013 02 09_osc2013_hamamatsu_osm
Tom Hayakawa
 
PDF
電子国土Webシステムのオープン化への取り組み(国土地理院・佐藤壮紀様)
OSgeo Japan
 
PDF
2012 04 14_foss4_g_nagoya_osm
Tom Hayakawa
 
PDF
2012 07 27_osm_project10
Tom Hayakawa
 
PDF
Osm概要 20121104
Shu Higashi
 
PDF
Open streetmap intro_20121019
Shu Higashi
 
PDF
地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2
Taro Matsuzawa
 
PDF
OSMの概要
Shu Higashi
 
PDF
2012 08 11_osm_hamamatsu
Tom Hayakawa
 
PDF
2012 07 28_osm_ws3
Tom Hayakawa
 
PDF
2012 07 14_osm-ws_2
Tom Hayakawa
 
PPT
2010 09 08_nagoya-cu_osm
Tom Hayakawa
 
PPTX
Osckyoto2012 osgeojp foss4g
Takashige Nakagawa
 
PDF
FOSS4Gを利用したWebでの地理空間情報公開入門
Kosuke Asahi
 
PDF
FOSS4Gでオープンデータもかんたん
Kosuke Asahi
 
Tile map 2011_foss4g_osaka
masarunarazaki
 
タイル地図がおもしろい
Kohei Otsuka
 
自由な地図を作るオープンストリートマップの活動
Shu Higashi
 
2012 06 30_osm-ws_1a
Tom Hayakawa
 
2012 05 12_osc2012_nagoya_osm
Tom Hayakawa
 
2013 02 09_osc2013_hamamatsu_osm
Tom Hayakawa
 
電子国土Webシステムのオープン化への取り組み(国土地理院・佐藤壮紀様)
OSgeo Japan
 
2012 04 14_foss4_g_nagoya_osm
Tom Hayakawa
 
2012 07 27_osm_project10
Tom Hayakawa
 
Osm概要 20121104
Shu Higashi
 
Open streetmap intro_20121019
Shu Higashi
 
地球地図を利用した地図タイルの作成 - FOSS4G TOKYO 2014 全体セッション2
Taro Matsuzawa
 
OSMの概要
Shu Higashi
 
2012 08 11_osm_hamamatsu
Tom Hayakawa
 
2012 07 28_osm_ws3
Tom Hayakawa
 
2012 07 14_osm-ws_2
Tom Hayakawa
 
2010 09 08_nagoya-cu_osm
Tom Hayakawa
 
Osckyoto2012 osgeojp foss4g
Takashige Nakagawa
 
FOSS4Gを利用したWebでの地理空間情報公開入門
Kosuke Asahi
 
FOSS4Gでオープンデータもかんたん
Kosuke Asahi
 

More from Hidenori Fujimura (8)

PDF
150702 クライシスマッピングワークショップ@青山学院大学
Hidenori Fujimura
 
PDF
FOSS4G 2014 Tokyo 基調講演「GSI for All」
Hidenori Fujimura
 
PDF
140619 地理院ckanの舞台裏から
Hidenori Fujimura
 
PDF
JavaScriptでキャッシュつき地図(GEO x CODEライトニングトーク)
Hidenori Fujimura
 
PDF
FOSS4Gで地理院地図
Hidenori Fujimura
 
PDF
地図インフラのAPIからの独立について
Hidenori Fujimura
 
PPT
Sharing the Openness of the Maps via FOSS4G and the Web
Hidenori Fujimura
 
ZIP
Web+GISという視点から見たGISの方向性
Hidenori Fujimura
 
150702 クライシスマッピングワークショップ@青山学院大学
Hidenori Fujimura
 
FOSS4G 2014 Tokyo 基調講演「GSI for All」
Hidenori Fujimura
 
140619 地理院ckanの舞台裏から
Hidenori Fujimura
 
JavaScriptでキャッシュつき地図(GEO x CODEライトニングトーク)
Hidenori Fujimura
 
FOSS4Gで地理院地図
Hidenori Fujimura
 
地図インフラのAPIからの独立について
Hidenori Fujimura
 
Sharing the Openness of the Maps via FOSS4G and the Web
Hidenori Fujimura
 
Web+GISという視点から見たGISの方向性
Hidenori Fujimura
 
Ad

Recently uploaded (9)

PDF
TaketoFujikawa_ComicComputing12th_inKumamoto
Matsushita Laboratory
 
PDF
LoRaWAN ウェザーステーションキット v3 -WSC3-L 日本語ユーザーマニュアル
CRI Japan, Inc.
 
PDF
【学会聴講報告】CVPR2025からみるVision最先端トレンド / CVPR2025 report
Sony - Neural Network Libraries
 
PDF
MahiroYoshida_セリフに着目したキャラクタロール推定に関する基礎検討_sigcc12th2025
Matsushita Laboratory
 
PDF
第三世代 ウェザーステーションキット v3 ー WSC3-L 日本語カタログ
CRI Japan, Inc.
 
PDF
20250726_Devinで変えるエンプラシステム開発の未来
Masaki Yamakawa
 
PPTX
2025_7_25_吉祥寺_設計ナイト_ADR運用におけるデータ利活用の考え方.pptx
ssuserfcafd1
 
PDF
VMUG Japan book vsan 20250515 CPU/Memory vSAN
Kazuhiro Sota
 
PPTX
baserCMS『カスタムコンテンツ』徹底活用術〜あなただけの管理画面を自由自在に〜
Ryuji Egashira
 
TaketoFujikawa_ComicComputing12th_inKumamoto
Matsushita Laboratory
 
LoRaWAN ウェザーステーションキット v3 -WSC3-L 日本語ユーザーマニュアル
CRI Japan, Inc.
 
【学会聴講報告】CVPR2025からみるVision最先端トレンド / CVPR2025 report
Sony - Neural Network Libraries
 
MahiroYoshida_セリフに着目したキャラクタロール推定に関する基礎検討_sigcc12th2025
Matsushita Laboratory
 
第三世代 ウェザーステーションキット v3 ー WSC3-L 日本語カタログ
CRI Japan, Inc.
 
20250726_Devinで変えるエンプラシステム開発の未来
Masaki Yamakawa
 
2025_7_25_吉祥寺_設計ナイト_ADR運用におけるデータ利活用の考え方.pptx
ssuserfcafd1
 
VMUG Japan book vsan 20250515 CPU/Memory vSAN
Kazuhiro Sota
 
baserCMS『カスタムコンテンツ』徹底活用術〜あなただけの管理画面を自由自在に〜
Ryuji Egashira
 
Ad

FOSS4GとWebによる地図公開の共有

  • 1. FOSS4G と Web によ る地図公開の共有 日本語仮訳 国土交通省 海外プロジェクト推進課 国際協力官 藤村 英範 1
  • 2. 電子国土の海外展開 • 日本で実証されたインフラの技術と政策を 海外展開することは日本の戦略のひとつ。 • 海外展開可能が見込まれる施策のひとつ: 基本測量・公共測量で得られた地図をオー プンアクセスで提供すること=電子国土 • 電子国土を海外展開できるか? 2
  • 3. 電子国土 国土地理院の Web マッピング戦略 • 様々な主体からの情報が国土地理院の公的地図 の上で共有されるべき。 • タイル化された地形図データ+地図フレームを 制御し情報を重ね合わせる API 。 2003 年 電子国土 Web サービス開始 http://cyberjapan.jp/ 3
  • 4. 電子国土 Web システム • Version 1 (2003) – Internet Explorer 用 Active X component + JavaScript API Google Maps (2004) 日本版 Google Maps (2005) • Version 2 (2008) OpenLayers (2006) – ピュア JavaScript API • Version 3 (2011) – OpenLayers 上に構築された JavaScript API • Version 4 (2012) – OpenLayers のアドオン 4
  • 5. OpenLayers アプリケーション 電子国土 geoSERBIA 日本 セルビア OS OpenSpace geoportal.md 英国 Moldova The slippy map 天地図 OSM 中国 5
  • 6. オープンソースを通じた協力的な進化 電子国土は OpenLayers の改良 に追従できる 日本は 電子国土の システムを 相手国に 共有できる OpenLayers を改良すること で、誰もが電子国土を改良 できる 6
  • 7. OpenLayers だけじゃない① : 他の Web マッピングライブラリ 様々なオープンソース タイルへのオープンアクセス ライブラリをもちいた +オープンソースライブラリ 、様々な実装 7
  • 8. OpenLayers だけじゃない② : 地図タイル生成 2011 年 ジグソーパズルのピースがはまった。 全パッケージ(少なくとも導入フェーズの)が完成。 8
  • 9. TileMill – ジグソーパズルの最後のピース Mapnik をレンダラに使用し、 Carto をスタイルシート言語に使用 し、 node.js を用いたローカル Web サーバを使用する地図作成のための デザイン環境。デフォルトで TileMill はタイル画像の SQLite バンドル である MBTiles を生成する。 3 項 BSD ライセンス。 この地図の作成に当たっては、国土地理院長の承認を得て、同院発行の基盤地図情報を使用した。 ( 承認番号 平 24 情使、 第 29 号 ) / some map data (c) OpenStreetMap contributors 9
  • 10. 国土地理院の 2012 年 JICA 研修での タイルベース Web マッピングの提案 TileMill TileMill 講義 講義 ハンズオン ハンズオン 10
  • 11. TileMill ハンズオン 2012 年 JICA 環境地図(地球地図)作成コース でのハンズオンを行ったところ、全研修生がタ イルベース Web マッピングサービスを数時間で 構築できることが明らかになっ た。 http://tiles.mapbox.com/fujimura-h2a3/map/Global_Map_Brazil 11
  • 12. ハンズオンのステップ 1. TileMill のダウンロードとインストール 2. 地球地図のダウンロード 3. 地球地図を TileMill にロード 4. TileMill 内で地球地図をスタイリング 5. 地図の書き出しと公開 12
  • 13. 1. Download & Install http://mapbox.com/tilemill/ 13
  • 14. 2. Download Global Map data http://www.iscgm.org/ -> Download 14
  • 15. Start TileMill and create a New Project 15
  • 16. Open the project you created. 16
  • 17. “Add Layer” for Global Map data 17
  • 18. “Add Layer” for Global Map data 18
  • 19. Select data source First try with polbnda.shp 19
  • 20. SRS = WGS84 and “Save & Style” 20
  • 21. You will see your data 21
  • 22. To change the style of data… Click to reflect the Change to the map. Edit to change the style. Syntax: click on the left Drag to change the draw order for help 22
  • 23. Make a map • Builtupa,watrcrsl, roadl, inwatera… 23
  • 24. Scale dependent rendering [zoom > n] 24
  • 25. Next: export to the web Step 1: project setting Limit the spatial bounds and zoom span so that the data size < 50MB 25
  • 27. Now your map is ready on the Web. 27
  • 28. 発展 : テキスト注記 text-face-name, text-name, text-fill, text- placement 28
  • 29. 発展 : 組み込み① iframe This example available at http://www.handygeospatial.info/2012/07/26/1/ 29
  • 30. 発展 : 組み込み② Leaflet + Wax You also need to download some JavaScript library files from http://mapbox.com/publis hing/leaflet/ This example available at http://www.handygeospatial.info/2012/07/26/2/ 30
  • 31. まとめ • タイルベース Web マッピングは国家地図作 成機関の間で既に共通の好実践であり、そ のプロセスは最近簡単になった。 • TileMill は、最初のパッケージの最後のピー スであった。 • TileMill ハンズオンにおいて、 JICA 研修員は 数時間でタイルベース Web マップサービス を公開することができた。 • 国家地図作成機関からのタイルベース Web マッピングは、 FOSS4G のおかげで国際的 に推進し得る。 31