sharing the openness of the maps via foss4g and the web
DESCRIPTION
A presentation on FOSS4G 2012 TokyoTRANSCRIPT
![Page 1: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/1.jpg)
Sharing the Openness
of the Maps viaFOSS4G and the
WebHidenori FUJIMURA
Director for International CooperationOverseas Project Division
Ministry of Land, Infrastructure, Transport and Tourism
1
![Page 2: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/2.jpg)
Exporting Digital Japan
• One of Japan’s strategy is to export Japan’s proved technologies and policies on infrastructure to other countries.
• One prospective measure to be exported: Provision of open access to maps developed through basic and pubic survey, which is called Digital Japan.
• Can we export Digital Japan?
2
![Page 3: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/3.jpg)
Digital Japan: GSI’s strategy in Web Mapping
• Information from different entities shall be shared over authoritative maps from GeoSpatial Information Authority of Japan (GSI)
• Tiled topographic map data + API to control map frame and to overlay information.
2003- Digital Japan Web started the service.
http://cyberjapan.jp/
3
![Page 4: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/4.jpg)
Digital Japan Web System
• Version 1 (2003)– Active X component for Internet
Explorer + JavaScript API
• Version 2 (2008)– Pure JavaScript API
• Version 3 (2011)– Pure JavaScript API built on
OpenLayers library
• Version 4 (2012)– OpenLayers library add-on
Google Maps (2004)Google Maps/Japan (2005)
OpenLayers (2006)
4
![Page 5: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/5.jpg)
OpenLayers applications
5
Japan Serbia
UK
ChinaOSM
Moldova
Digital JapangeoSERBIA
OS OpenSpacegeoportal.md
Tiantidu
The slippy map
![Page 6: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/6.jpg)
Collaborative evolution via Open Source
6Everyone can improve Digital Japn by improving OpenLayers
Digital Japan can follow the evolution of OpanLayers
Japan can share the system for Digital Japan with other countries
![Page 7: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/7.jpg)
Not only OpenLayers Pt. 1:other Web Mapping
Libraries
7
Various implementation using various open source library
Open web access to tiles + open source
library
![Page 8: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/8.jpg)
Not only OpenLayers Pt. 2:map tiles generation
8In 2011 jigsaw has fallen into place – the whole package ready!(at least for introductory phase.)
![Page 9: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/9.jpg)
TileMill – the last jigsaw piece
9この地図の作成に当たっては、国土地理院長の承認を得て、同院発行の基盤地図情報を使用した。 ( 承認番号 平 24 情使、 第 29 号 ) / some map data (c) OpenStreetMap contributors
Design environment for cartography, constituting Mapnik as a renderer, Carto as a stylesheet language, a locally-served web interface with node.js. By default TileMill renders to an MBTiles, an SQLite bundle of tile images. 3-clause-BSD licensed.
![Page 10: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/10.jpg)
Proposal of tile based web mapping in
JICA training courses 2012 in GSI
10
TileMill hands-on workshop
TileMill hands-on workshop
Lecture
Lecture
![Page 11: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/11.jpg)
TileMill hands-on workshopA hands-on workshop in “JICA training course on Global Mapping for Sustainable Development” in 2012 probed that all participants could develop a tile based web mapping service within a few hours.http://tiles.mapbox.com/fujimura-h2a3/map/Global_Map_Brazil
11
![Page 12: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/12.jpg)
Steps for the hands-on workshop
1. Download and Install TileMill.2. Download Global Map data.3. Load Global Map to TileMill.4. Style Global Map data inside
TileMill.5. Export and publish the map.
12
![Page 13: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/13.jpg)
1. Download & Installhttp://mapbox.com/tilemill/
13
![Page 14: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/14.jpg)
2. Download Global Map data
http://www.iscgm.org/ -> Download
14
![Page 15: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/15.jpg)
Start TileMill and create a New Project
15
![Page 16: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/16.jpg)
Open the project you created.
16
![Page 17: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/17.jpg)
“Add Layer” for Global Map data
17
![Page 18: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/18.jpg)
“Add Layer” for Global Map data
18
![Page 19: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/19.jpg)
Select data sourceFirst try with polbnda.shp
19
![Page 20: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/20.jpg)
SRS = WGS84 and “Save & Style”
20
![Page 21: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/21.jpg)
You will see your data
21
![Page 22: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/22.jpg)
To change the style of data…
Drag to change the draw order
Edit to change the style.Syntax: click on the left for help
Click to reflect theChange to the map.
22
![Page 23: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/23.jpg)
Make a map
• Builtupa,watrcrsl, roadl, inwatera… 23
![Page 24: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/24.jpg)
Scale dependent rendering[zoom > n]
24
![Page 25: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/25.jpg)
Next: export to the webStep 1: project setting
Limit the spatial bounds and zoom span so that the data size < 50MB
25
![Page 26: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/26.jpg)
Export -> Upload
26
![Page 27: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/27.jpg)
Now your map is ready on the Web.
27
![Page 28: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/28.jpg)
Extra: text annotation
text-face-name, text-name, text-fill, text-placement 28
![Page 29: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/29.jpg)
Extra: Embedding #1 (iframe)
29
This example available athttp://www.handygeospatial.info/2012/07/26/1/
![Page 30: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/30.jpg)
Extra: Embedding #2 (Leaflet + Wax) You also need to download
some JavaScript library files from http://mapbox.com/publishing/leaflet/
30This example available athttp://www.handygeospatial.info/2012/07/26/2/
![Page 31: Sharing the Openness of the Maps via FOSS4G and the Web](https://reader035.vdocument.in/reader035/viewer/2022070304/54c7a4e54a7959e7478b462d/html5/thumbnails/31.jpg)
Conclusion• Tile based web mapping is already a
common good practice among National Mapping Agencies (NMAs), and the whole process is now easy.
• TileMill was the last piece for the first package.
• JICA training participants could publish a tile based web mapping service within a few hours TileMill hands-on workshop.
• Tile based web mapping from NMAs can be internationally promoted thanks to FOSS4G. 31