Getting Started - Simplest Example

Simple example and template for displaying a web map directly from a PostGIS database using ST_AsMVT.

Map Tools

We'll walk through a very simple example to get started. DB2Vector primarily uses the PostGIS function ST_AsMVT. This function queries a PostGIS database and returns a Mapbox Vector Tile (MVT), a vector tile format developed by Mapbox. The vector tile contains the data needed to display a tile in a web map.

But, to create a web map, you don't need to know anything about vector tiles. You only need:

  1. Geospatial data in PostGIS (i.e. PostgreSQL database with the geospatial extension).
  2. Connection details for the PostGIS database and read access.
  3. The name of the schema and table of your data.
  4. The name of the geometry column of your table.
  5. The spatial reference ID (SRID) of the table.

With these, once you have created a database connection, you can use the code below as a template and swap out several terms to correspond to your case.

In our example, our schema is "demo" and the table is "brazil_states". The name of the geometry column in this table is "geom", and the SRID is 4326. 3857 is the SRID for web maps, and so the geometry from the source table is transformed to 3857 and then passed to ST_AsMVTGeom.

To adapt this simple example, you only have to replace these four terms with the appropriate ones for your use. Only change the name of the geometry for you source table, e.g. geom in our case. The geometry of the bounding box is referenced three times, and this should not be changed.

WITH boundingbox AS(
    ) AS geometry
mvtgeom AS (
      ST_Transform(sourceTable.geom, 3857),
    demo.brazil_states sourceTable,
      ST_Transform(boundingbox.geometry, 4326),

The values for the bounding box will be relayed to this function by the browser. ST_AsMVTGeom then creates vector tile for the section of the source table that intersects the bounding box. The subquery mvtgeom contains the geometry returned by ST_AsMVTGeom and the field "NAME". ST_AsMVT converts mvtgeom to vector tiles and returns it.

If there is an error with the query, this will show in the preview pane. You will have to pan to where the data should appear—Brazil in our case.

The tool defaults to only showing data at zoom levels 10 and greater to avoid calling too large amounts of data. You will likely have to decrease this value. Click Preview again after you've adjusted this.

After you have created the tile source of the DB2Vector instance, you can use Simple Styler interface to style the layer, and then create a map using Map Stacker. These last two steps do not require any code at all. We've displayed our example in the dynamic map.


Clockwork Micro is based in Seattle and Paris.



Copyright2022Clockwork Micro. All rights reserved.

Clockwork Micro