Serving Dynamic Vector Tiles from a PostGIS Database to OpenLayers Map Using FastAPI

Serving Dynamic Vector Tiles from a PostGIS Database to OpenLayers Map Using FastAPI


FastAPI is a powerful and efficient web framework for creating APIs in Python that has gained popularity due to its speed and simplicity. This blog will delve into the specifics of how FastAPI can serve vector tiles from a PostGIS database. Our journey will involve SQL query templates, FastAPI endpoints, and a PostGIS database connection and finally rendering on dynamically generated vector tiles in OpenLayers Map

Preparing the Environment

Before diving into code, ensure that necessary libraries such as FastAPI, SQLAlchemy, uvicorn and gzip are installed in your Python environment. These libraries can be installed using pip:

Establishing Database Configuration

The first step is to define our database credentials. We create a dictionary named db_config that contains our database name, user, password, host, and port.

Creating the Database Engine

Next, we use SQLAlchemy to establish a connection to our PostGIS database. Using the database configuration defined earlier, we formulate a connection string and create a SQLAlchemy engine. SQLAlchemy’s sessionmaker is utilized to generate a Session, which serves as our primary interface with the database.

Crafting the SQL Query Template

For this application, we’ll need a SQL query that fetches geometries based on tile coordinates. In the SQL query template, we are selecting features, transforming them to web mercator, and encoding them into a Mapbox Vector Tile (MVT).

Initializing the FastAPI Application

We begin by initializing a FastAPI instance and mounting a static file directory. This directory can serve any files needed for our web application, such as HTML, CSS, and JavaScript files.

Defining API Endpoints

Our FastAPI app will have two main endpoints:

  1. The root endpoint (/) returns a simple message indicating a blank page.
  1. The tiles endpoint (/tiles/{z}/{x}/{y}.mvt) takes the z, x, and y coordinates of a tile, fetches corresponding data from the PostGIS database, compresses the data using gzip, and returns the data as a response.

Running the Application

Finally, the FastAPI application can be started using Uvicorn, an ASGI server, with the specified host and port.

Your FastAPI application is now up and running and will serve vector tiles from your PostGIS database.

Rendering Dynamically Generated Vector Tiles in OpenLayers

Now that you have a FastAPI server generating vector tiles from a PostGIS database, let’s see how we can visualize these tiles in a web map using OpenLayers.

OpenLayers is a powerful, open-source JavaScript library used for displaying rich interactive maps.

Firstly, ensure that OpenLayers is included in your project. You can include the OpenLayers package directly from a CDN in your HTML file.

Once you have OpenLayers ready, you can proceed to create a map and add a vector tile layer.

In this JavaScript snippet, we are:

  1. Creating a VectorTile source, pointing to our FastAPI server’s tile endpoint.
  2. Defining a VectorTile layer, setting its source to the VectorTile source and providing a simple style for the features.
  3. Creating a Map, adding an OSM base layer and our VectorTile layer, and setting a default view.

Ensure to replace 'http://localhost:8000/tiles/{z}/{x}/{y}.mvt' with your actual FastAPI server’s tile endpoint if it’s different.

After completing these steps, you should be able to see your dynamically generated vector tiles from your FastAPI server displayed on your OpenLayers map.

Complete Python Code for dynamically generating Vector Tiles from PostGIS using FastAPI

Complete OpenLayers Code for rendering dynamically generated Vector Tiles from FastAPI end point


By following this guide, you’ve taken the first steps into serving vector tiles from a PostGIS database using FastAPI. You can now adapt this framework to suit the specifics of your application. FastAPI’s speed and flexibility make it an excellent tool for serving data in web applications.

I hope this tutorial will create a good foundation for you. If you want tutorials on another GIS topic or you have any queries, please send an email at

We also offer freelancing services. Please email us at for any query.

Leave a ReplyCancel reply