This document discusses hosting vector tile maps on your own server using TileServer GL. Some key benefits include having maps under your own control with a custom look and feel that remains consistent across platforms. TileServer GL is an open-source tool that can serve vector tiles and render raster tiles on demand from various data sources. It supports styling maps through Mapbox GL styles and includes fonts, icons and other assets. The tool is independent, standalone, and can run on its own servers or behind firewalls.

1. Klokan Technologies GmbH www.klokantech.com
Petr Sloup <petr.sloup@klokantech.com>
Petr Pridal <petr.pridal@klokantech.com>
August 26th, Bonn 2016
Hosting vector tile maps on
your own server

2. Klokan Technologies GmbH www.klokantech.com
Why?
• Maps hosted on your server(s)
• Under your control
• With a custom look & feel
• Same style available everywhere (web, native
mobile apps, print, offline)
• Use opendata (like OSM) or your own data

3. Klokan Technologies GmbH www.klokantech.com
www.tileserver.org

4. Klokan Technologies GmbH www.klokantech.com
vector tiles
styled maps

5. Klokan Technologies GmbH www.klokantech.com

6. Klokan Technologies GmbH www.klokantech.com
Open-source components
• Raster rendering core - MapBox GL Native -
C++ with Node.js wrapper
• MapBox GL JS - WebGL, Android + iOS SDK
Thank you, Mapbox, your open-source libs rock!

7. Klokan Technologies GmbH www.klokantech.com
Independent and
standalone
• No external services, everything included
• 100% open-source
• OpenStreetMap vector tiles: Whole world:
54 GB, country extracts ~1GB
• Your vector tiles (pre-generated or http)
• Hosting on a standard VPS, runs on a laptop
• Possible to run offline, or behind firewalls

8. Klokan Technologies GmbH www.klokantech.comServers in the Google Cloud datacenter

9. Klokan Technologies GmbH www.klokantech.com
NOAA
Computer on the board of NOAA airplane

10. Klokan Technologies GmbH www.klokantech.com
TileServer GL features
• serves vector tiles (pbf) with styles and assets
• renders raster tiles on demand as fallback
(png, jpeg, webp)
• XYZ tiles, TileJSON, WMTS
• input raster tiles to create hybrid maps
• static maps endpoint

11. Klokan Technologies GmbH www.klokantech.com
Styling with GL styles
• Alternative to OGC SLD, CartoCSS
• One style runs everywhere
• Mapbox GL style specification
• JSON format - easy manual editing
• Open-source editor with live preview
• MapBox Studio online visual editing
https://github.com/mapbox/mapbox-gl-style-spec

12. Klokan Technologies GmbH www.klokantech.com
https://github.com/erikandre/mapbox-gl-style-editor

13. Klokan Technologies GmbH www.klokantech.com
https://www.mapbox.com/studio/

14. Klokan Technologies GmbH www.klokantech.com
GL assets
• Fonts (glyphs encoded as pbf) - any unicode
font characters.
• Icons (SVG turned into PNG sprites)
• Open source tools to create assets: fontnik’s
build-glyphs utility, spritezero
• TileServer GL includes ready-to-use open
assets and styles to start
https://github.com/mapbox/fontnik
https://github.com/mapbox/spritezero-cli

15. Klokan Technologies GmbH www.klokantech.com
https://github.com/klokantech/klokantech-gl-fonts

16. Klokan Technologies GmbH www.klokantech.com
Viewer compatibility
• Browser: MapBox GL JS, OpenLayers 3
• Native mobile apps iOS / Android MapBox
SDK
• Legacy viewers via raster tiles
• Leaflet, etc.
• QGIS / ArcGIS, etc. via WMTS

17. Klokan Technologies GmbH www.klokantech.com
- XYZ for Leaflet, …
- WMTS for GIS (QGIS maps)
- mobile / hybrid map?
- static map
OSM2VectorTiles
mobile app
for Android and iOS
Powered by open-source
Mapbox iOS / Android SDK
Tiles and assets from a custom server hosting

18. Klokan Technologies GmbH www.klokantech.com
QGIS / ArcGIS, etc. via WMTS

19. Klokan Technologies GmbH www.klokantech.com
Static maps / print
• High quality raster output (300DPI+)
• Specify area / zoom (a la WMS)
• Print ready
• Great for static images of maps in a website
• Polygon overlay drawing implemented

20. Klokan Technologies GmbH www.klokantech.com
/styles/basic/static/7.1,50.7,13/800x600.png

21. Klokan Technologies GmbH www.klokantech.com
/styles/basic/static/auto/800x600.png?path=5.9,45.8|5.9,47.8|10.5,47.8|10.5,45.8|5.9,45.8

22. Klokan Technologies GmbH www.klokantech.com
Retina / HiDPI
• Supported in all raster outputs (tiles, static)
• Scaling for HiDPI / Retina displays
• Print ready output from the maps
• Add suffix: @2x, @3x, @4x to the URL

23. Klokan Technologies GmbH www.klokantech.com
Advanced use
• JSON styles can use multiple tile sources
• Rendering hybrid maps
• Remote tile sources
• Loading tiles from Amazon S3 / GCS
• and on-the-fly tiles from GeoServer,
MapServer, …

24. Klokan Technologies GmbH www.klokantech.com
Custom coordinate
systems
• Whole stack is usable with custom SRS
• No reprojection into Mercator
• Including usage in native mobile SDKs!
• Mapproxy caching possible
• Demo: http://labs.klokantech.com/swissvt/

25. Klokan Technologies GmbH www.klokantech.com

26. Klokan Technologies GmbH www.klokantech.com
Production deploy
• Scalable (no database, just launch more
identical machines)
• Docker microservices or deploy as a
component
• Web server (nginx) in front
• Security (https, password, IP restriction)
• Cache (varnish, mapproxy)

27. Klokan Technologies GmbH www.klokantech.com
info@klokantech.com
follow us on Twitter:
@klokantech
www.tileserver.org
Considering transition to vector tiles?
Production deploy of TileServer-GL?
We can help! Contact us: