Did you ever fly around a country in 3D? In your standard web browser? Without plugins? 3D for the web is an emerging technology. WebGL enables web browsers to exploit the GPU of a computer to create beautiful and fast 3D worlds. It is time for web geoportals to go 3D. swisstopo was able to create a 3D viewer for the geoportal of the swiss confederation map.geo.admin.ch. We'll show you how it was done - and how Open Source enabled it. Links to project: https://github.com/geoadmin/mf-geoadmin3

1. 3D bei swisstopo
Darstellung «Standardsetting»
Überlagern übriger 2D Daten
GL-Sitzung 10. Februar 2015
A. Buogo, A. Streilein, D. Oesch,
Swiss Federal Office of Topography - swisstopo
How to make a 3D web
geoportal
FOSS4G 2016

2. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Gilbert Jeiziner | @gilbertjeiziner | github.com/gjn
Swiss Federal Office of Topography swisstopo
geo.admin.ch | geoportal for all swiss federal offices
500+ datasets | 30k visits per day
@swiss_geoportal
2

3. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
PL: David Oesch, Cédric Moullet
Data/Terrain: Cédric Métraux, Loïc Gasser, Marcel
Clausen
Cloud: Marc Monnerat, Andrea Borghi
Front-End: Eric Lemoine, Fréd Junod, Guillaume
Beraudo, Olivier Terral
Countless contributors to open source projects
3

4. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
3D Data is available (DTM, TLM, etc)
…not as a service
…not directly usable for visualisation
High precision DTM: up to ±0.25m
Let’s put it on the web!
4

5. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
CesiumJS was only real 3D library
WGS84 only
Iván Sánchez: other WebGL libraries
5

6. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Challenge 1: triangulation
Original data is grid based
Triangulate in X/Y/Z coordinate system
Reproject to WGS84

7. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Challenge 2: size
~ 1.5 TB
Meshed triangles
?

8. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
CesiumJs uses ‘quantized mesh’ format
for terrain
https://cesiumjs.org/data-and-assets/terrain/formats/quantized-mesh-1.0.html
Optimized for web and webGL
6 bytes per coordinate triple
8

9. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
No tools to write quantized mesh
We wrote our own: 3d-forge
https://github.com/geoadmin/3d-forge
Consumes triangles – writes quantized
mesh
9

10. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
~ 1.5 TB ~ 15 GB
Reduction
100X
Raw Shapes Terrain format
Good, but not good enough

11. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
«Eventually, everything gets tiled»
Quadtree pyramid according to TMS
11
~ 1.5 TB ~ 15 GB
Reduction
100X
~ 1 - 5 MB
For a single 3D view
Reduction
3000X

12. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
The mesh [DEMO]
12

13. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
What to put on the mesh?
Easy: just drape your 2D Maps over the
terrain
Reprojection again! (Hi Calvin Metcalf)
13

14. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Challenge 3: reprojection 500+ 2D
maps
WMS/Mapserver -> too slow, doesn’t
scale well
We have 3.5 billion native WMTS tiles
Pre-Generate all in WGS84 is costly (and
insane)

15. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Tiles CH03 Tiles WGS84
2D Map 3D World
Reprojection
using Mapproxy
Terrain 3D

16. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Created plugin for mapproxy (S3
caching)
https://github.com/procrastinatio/mapproxy/tree/s3
16

17. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Challenge 4: seamless integration
Passing from 2D to 3D and back
What you see in 2D, you will see in 3D
ol3-cesium Library
http://openlayers.org/ol3-cesium/
Visit Guillaume’s talk!

18. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
[DEMO]
18

19. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
That’s all?
19

20. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
It was slow (900+ requests, 20MB
transferred)
Many questions about operations (users,
traffic, costs, etc.)
20

21. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
We let 10 people navigate Switzerland in 3D
21

22. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
1 3D user created same traffic as 50 2D
users
Scare mail
Impact on cost not tax payer friendly
22

23. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Challenge 5: reduce operational costs
and increase performance
Skip LODs
Add fog
Reduce quality of draped layers

24. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
December 2015 - Alpha Release as 2.5D
Usage is very low

25. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
From 2.5D to real 3D
-
Peak Preview [DEMO]

26. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
A couple of thougths about the future of
3D web mapping

27. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
Don’t throw away 2D
We need real 3D data with real 3D
models and symbology
Find the right use cases
VR/AR support for browsers very poor
(webVR)

28. FOSS4G 2016Swiss Federal Office of Topography - swisstopo
I think the most important aspect of 3D
web mapping is usability/navigation
Learn from games (DOOM VR)
Is immersion better?
[THE FINAL DEMO]

29. Community
Mailing list
http://groups.google.com/group/geoadmin-api
Github
http://github.com/geoadmin