Vector tiles

Vector tiles are a way to deliver geographic data in small chunks to a browser or other client application. Vector tiles are similar to raster tiles, but instead of raster images, the data returned is a vector representation of the features in the tile. For example, a GeoJSON vector tile might include roads as LineStrings and bodies of water as Polygons. Some vector tile sources are clipped so that all geometry is bounded in the tiles, potentially chopping features in half. Other vector tile sources serve unclipped geometry so that a whole lake may be returned even if only a small part of it intersects the tile.

The Mapbox Vector Tile Specification defines a file format commonly used for serving vector data (2.5D, incl. OpenStreetMap).

The OpenStreetMap API can also be used as an ad-hoc vector tile source for OSM XML data by creating appropriate bounding box queries; the iD editor uses this mechanism to access OSM source data.

TODO

Much work required to turn this into a useful resource for people learning about vector tiles. Some sources:

• User:Bk#Vector-Tiling
• Tile data server
• WikiMiniAtlas/Vector tiles - Documentation for the Vector tile system currently in use by the WikiMiniAtlas, Stuff Wikimedia page
• Further work on links below; verify links and descriptions; discuss structure; integrate with Tile data server --Ikonor (talk)

Ongoing projects, people

• Michal Migurski:
  • I heard you like tiles... - Geomeetup April 2013 (PDF)
  • the liberty of postgreslessness: tiled vectors in mapnik (blog)
  • gl-solar, webGL rendering of OSM data (blog), Demo - with Squares based on D3
• Paweł Paprota: "my personal goal is to make OWL a source of up-to-date worldwide vector tiles"
• Kai Krueger:
  • "working on a geojson vector "renderer" for tirex"
  • testing GSoC Data Tile Service
• Pnorman:
  • Serving Vector Tiles (Nov. 2016)
  • Overview of Vector Tiles (video) (Oct. 2017)
• Klokan Tech with support by HSR: OpenMapTiles
• Lukas Martinelli: Maputnik Style Editor (Open Source)
• Stefan Keller HSR (alias User:Geonick):
  • Intro to Vector Tiles
  • Vector Tile Reader for QGIS (Open Source)
• Alan Grant:
  • GO Map - Location based games made easy
  • GO Map - Website, documentation and tutorials

Student projects

• Google Summer of Code/2012/Data Tile Service, GitHub, osm-dev Mail: GSoC Data tile example site (example offline),
• vector rendering on Marble (GSoC 2012)
• Segmentation of OpenStreetMap Data - Generating, Merging, and Distributing Tiles - Bachelor Report 09/2011, see OSMT
• OSM2VectorTiles (now OpenMapTiles) originates from a bachelor and a study thesis of Lukas Martinelli and Manuel Roth supervised by Prof. Stefan Keller (alias User:Geonick)

Discussions

• 3D OSM mit WebGl? (German)
• Libraries to render vector-based maps in the browser (GIS Stack Exchange)
• http://www.osmfoundation.org/wiki/Working_Group_Minutes/EWG_2012-02-13
• dev Forum: Real Time Rendering in the Browser - Ideas how it can be done
• dev: OSM formats optimised for client-side vector rendering?
• Forum: Rendering auf dem Clientrechner (German)
• Forum: 50 km x 50 km "Chunks" (German)
• Talk-de Projektidee: Segmentierung von OSM-Daten (German)

Others:

• gis.stackexchange.com: How to create Vector Polygons at the same amazing speeds GISCloud is able to render them?
• OpenLayers User List: GisCloud showing tons of vectors features on Web Browser

Services

• For online services there is an TileJSON, an open standard specification for representing map metadata.
• OpenMapTiles provides the fastest way how to setup custom styled world maps with open-source software. Successor of OSM2VectorTiles.

Experimental

• Mapnik Vector Tiles - Road Lines+Labels, Land Usages, Water Areas; GeoJSON + MVT
• Freemap GeoJSON Vector Tiles - Freemap API delivers GeoJSON tiles of selected areas of the UK. Please contact me (nickw) on freemapinfo at gmail dot com if interested, to avoid bandwidth issues on my server.

Server

• openstreetmap-carto-vector-tiles - port of the OSM Carto style to support vector tiles.
• vector-tile-server - node.js server based on Mapnik, protocol buffers tile format, used by OpenScienceMap (according to Tile_data_server)
• Kartotherian is a vector tile server based on open-source Mapbox stack, developed by Wikimedia Foundation for use on Wikipedia.
• TileStache
  • Providers
    • VecTiles - MVT (Mapnik Vector Tiles) and GeoJSON from PostGIS
    • Vector - GeoJSON (and others) from OGR drivers
    • PostGeoJSON - GeoJSON from PostGIS
  • Hand-Rolled Vector Tiles – TileStache (blog)
• Kothic JS json_getter.py, json_getter-setup
• Mapnik Metawriter, Demo - replaced by UTFGrid
  • SotM EU Talk - Mapnik Metawriters - Hermann Kraus (17.07.11)
• Trapi - Perl, OSM SVN
• node-tileserver - node.js server which can generate GeoJSON tiles for KothicJS

File based

• Mapsplit
• OSMT - Java OSM XML Split and Merge Tool

Others

• Cloudmade Vector Stream Server - SVG output

Formats

• MBTiles is a file format (SQLite binary file) for storing tilesets incl. raster and vector tiles with metadata.
• MVT (Mapnik Vector Tiles) - binary with WKB (well-known binary), optimized for Mapnik as Client, supported by TileStache VecTiles provider, blog
• Mapbox vector tile format - A format based on Google Protocol Buffers, using a serialization of the Mapnik API
• OpenScienceMap OSciM-PBF: binary Protocol Buffers format. The current version is implemented by TileStache OSciMap4 provider. Version 2: oscim-draft.txt [1], supported by vector-tile-server [2] and TileStache OSciMap provider
• GSoC2012 Data Tile Service - similar to Kothic
• Kothic JSON: custom GeoJSON-like, supported by Kothic json_getter.py and TileStache JsonOSciMap provider
• GeoJSON, provided by TileStache
• Mapsforge: Specification: Mapsforge Binary Map File Format

Client/renderer

Tile layers

• Leaflet
  • MaZderMind/leaflet-geojson-layer
  • https://github.com/mapbox/owlviewer/blob/gh-pages/geojson-tiles.js
  • https://github.com/glenrobertson/leaflet-tilelayer-geojson
  • Kothic JS
• OpenLayers
  • Strategy.Grid (Metawriter Demo, see below)
  • vector-behavior sandbox OpenLayers.Grid + OpenLayers.Strategy.Grid
    • Grid Strategy - feedback and few questions - what still needs to be done
    • Blog: Adding Grid Strategy to the mix - make it work with the Cluster Strategy
    • Ticket #2720: Refactor Layer.Grid into separate Grid class
  • Strategy.TFS, Protocol.TFS: Tile Feature Strategy in OpenLayers
    
    • OL Ticket #1401: Support for tiled WFS - State: Needs More Work
    • Patch
• Polymaps - built in, clipped and unclipped, supported by TileStache
• WhirlyGlobe-Maply Supports Migurski's vector tiles[3], their own format[4], and MapBox's format[5]
• Avecado (by Mapquest.com) is a library for building Mapnik vector tiles, along with language bindings for Python and some utility programs.

SVG

• Polymaps, example: http://polymaps.org/ex/statehood.html
• Cartagen, OSM-dev Cartagen - client-side vector based map renderer, dynamic maps
• Osmarender_Frontend, http://osmarenderfrontend.wordpress.com/

Canvas

• Kothic JS
• VECNIK (CartoDB, Vizzuality) - "Render Vector HTML5 maps using CartoDB and Carto as styling language, on top of ModestMaps"
  • cartodb.com: Rendering CartoDB with HTML5
• cartodb_tile_render - prototype

WebGL

• Mapbox GL JS
• OpenLayers 3 (in development), Blog
• Cesium
  • OpenLayers Adapter - KML, Shapefile
  • OpenLayers 3 integration
• OpenWebGlobe, Camptocamp news, GitHub
• xml3d.org - OpenStreetMap 3D Viewer and tools - XML3D
• Tangram is a WebGL solution for OpenStreetMap developed by Mapzen, also see blog posting about it.

Experiments, demos

• gl-solar, webGL rendering of OSM data (blog), Demo - with Squares based on D3
• OSM Buildings - iD + three.js
• Freemap 3D
• OpenScienceMap/VectorTileMap - WebGL port of VectorTileMap, written in Java (using libgdx gwt backend). OpenScienceMap

Others

• Google MapsGL
• Nokia HERE 3D
  • here.stamen.com
• MapSurfer.NET is a cartographic framework (written in C#) which allows using vector tiles as a data source

Styling

• Plain SVG CSS
  • iD Architecture: Map Rendering and Other UI
• OpenLayers Styling
• MapCSS
• carto (MapBox / TileMill)
• GSS (Cartagen)
• Cascadenic (für Mapnik)
• Mapbox GL Style Spec

Infos

• MapCSS vs CartoCSS
• Mapcss ML: Development of MapCSS?
• CSS For Maps - Tom MacWright Blog

Others

• GeoServer CSS Module (converts to SLD)

Native client-side libraries

Android

• GetYourMap
• Mapbox Android SDK
• Mapsforge
• Nutiteq Maps SDK
• Tangram ES

iOS

• GetYourMap
• Mapbox iOS SDK
• Nutiteq Maps SDK
• Tangram ES
• WhirlyGlobe-Maply

macOS

• Mapbox macOS SDK
• Tangram ES

Qt

• Mapbox Qt SDK

Windows Phone

• Nutiteq Maps SDK

Unity 3D

• GO Map - 3D Map for AR gaming

Generalization

• OpenLayers LineString.simplify
• Simplify.js / Leaflet
• PostGIS ST_Simplify, ST_SimplifyPreserveTopology
  • Kothic JS json_getter.py
  • cartodb: Speeding up tiles rendering
• TopoJSON - for topology-preserving simplification

Clipping

• PostGIS ST_Intersection
  • Kothic JS json_getter.py
• Polymaps/TileStache

Others

• Geojson CSS
• Exploring the Future: is HTML5 the solution for GIS Applications on the World Wide Web?
• http://geojason.info/2011/geojson-tiles-with-mapfish/
• How Interactivity Works with UTFGrid
• Web mapping with vector data. Is it the future ? 2012
• GIS Cloud Starts HTML5 Mapping Revolution!
• Vector tile tutorial; not OSM specific, but notes on clients and servers
• awesome implementations of the Mapbox Vector Tile specification