OGC API — Tiles in MapTiler Server

The OGC API — Tiles standard defines endpoints for creating Web APIs that support retrieving geospatial information as tiles. It is a successor to the WMTS standard.

MapTiler Server supports the following JSON endpoints:

  • Dataset landing page defines a dataset and provides access to the tiles.

    • Tileset: https://<YOUR_HOST>/api/tiles/{tilesId}/tiles
    • Rasterized map: https://<YOUR_HOST>/api/maps/{mapId}/tiles
  • Dataset TileMatrixSets describes the dataset tile matrix sets according to the OGC Web API.

    • Tileset: https://<YOUR_HOST>/api/tiles/{tilesId}/tileMatrixSet
    • Rasterized map: https://<YOUR_HOST>/api/maps/{mapId}/tileMatrixSet
  • Conformance Classes declares the conformance classes implemented within our API.

    • https://<YOUR_HOST>/api/ogc/conformance

The Dataset landing page can be used in software supporting the OGC API — Tiles specification (currently OpenLayers).

Getting started with OpenLayers

We’ve prepared an OpenLayers demo viewer for raster and vector tiles to showcase the capabilities. Implementing this in your web applications is straightforward, see the OpenLayers OGC Vector Tiles and OGC Raster Tiles examples.

  1. Load the OpenLayers library in the <head> section and set the UTF-8 encoding.

  2. Add an element to be inflated by the OpenLayers into the HTML <body>.

    <div id="map" style="width: 640px; height: 480px;"></div>

  3. Get the URL of the dataset:
    1. Go to your MapTiler Server at http://localhost:3650/admin.
    2. To get a URL of a rasterized map, click Details next to the map. For a tileset, go to page Tiles and click Details next to the desired tileset.
    3. Find the OGC Tiles API section and copy the URL.
  4. Add JavaScript code that will initialize the OpenLayers raster map.

    • Check that the target matches the id of the inflated HTML element.
    • In the layers array, there’s a raster layer Tile with the OGCMapTile source. Point its url to your map’s dataset.
    • Set the desired initial zoom level and map position in the view property.
  5. To load a vector tileset, replace Tile with VectorTile and add some basic styling.

  6. Add a proper attribution.

Custom projections with OpenLayers

OpenLayers library includes definitions for EPSG:4326 and EPSG:3857. Use proj4 to define any other projection. Here is an example for EPSG:5514:

  1. Load proj4 library in the <head> section.

  2. Define the projection before ol.Map initialization:

    1. The projection name (projName) is the crs URL:

      Look into the console for an error like this: Error: Unsupported CRS: http://www.opengis.net/def/crs/EPSG/0/5514

      Alternatively, look into the dataset definition for the crs property.

    2. The projection definition (projDef) can be obtained:

      Manually from epsg.io, e.g. from https://epsg.io/5514.proj4.

      Dynamically using the fromEPSGCode method, e.g. ol.proj.proj4.fromEPSGCode("EPSG:5514") (not recommended).

  3. Set the projection of the Non-Mercator OGCMapTile or OGCVectorTile source.

OpenLayers limitations

  • OpenLayers doesn’t automatically read or set tileGrid from the tileset tile matrix sets description.
  • The view is not initialized from the OGC API — Tiles centerPoint property.

Getting started with QGIS

To use raster tiles in QGIS, you’ll need to create two more JSON files (endpoints). In this example, we will add a satellite map into QGIS.

  1. Create a new local JSON file, e.g. tilesets.json. This endpoint declares a list of the tileset projections.

    Set the API URL to the desired tileset/map.

  2. Create another file within the same folder, e.g. landing.json. This endpoint is a dataset landing page linking the previous endpoint. This file will be always the same.

  3. OGC API — Tiles is used to request tiled data from a web service, not directly load a static local file. You have to:

    1. Upload the JSON files on some web server. Ensure that href link from landing.json to tilesets.json is correct.
    2. Start a local server to serve the JSON files. In Python:

      1. Open the terminal and go to the folder containing the JSON files.
      2. Run: python3 -m http.server
      3. The URL will be: http://localhost:8000/landing.json
  4. Load the dataset landing page endpoint in QGIS.

    1. Go to menu Layer > Add Layer > Add Raster Layer (Ctrl+Shift+R).
    2. As the Source Type, select OGC API.
    3. As Source, enter the landing.json URL.

QGIS limitations

  • OGC API — Tiles standard works only with Windows and QGIS 3.38 (GDAL 3.9).
  • Only raster tiles are supported.
  • QGIS doesn’t support reading tiles directly from the dataset landing page. QGIS can only work with raster tilesets and raster collections.

It’s important to note that GDAL/QGIS implements the draft of the OGC API — Tiles standard and the implementation is likely to change.

Supporting QGIS is on our roadmap, and we plan to expand the compatibility.