Documentation menu
Developer guides

Render 3D Maps with deck.gl

Ola Maps 3D Maps use the OGC 3D Tiles standard, so any compatible renderer can be used to create 3D visualizations.
One supported option is the renderer provided by deck.gl. deck.gl is a high-performance, GPU-powered framework for visualizing large datasets.  It supports a layered approach to data visualization, offering precision rendering and seamless integration.

Rendering with deck.gl example

We've provided a TypeScript deck.gl example to help you get started with 3D map rendering.
 const onTilesetLoad = (tileset: any) => {
     const { cartographicCenter, zoom } = tileset;
     setInitialViewState({
       longitude: cartographicCenter[0],
       latitude: cartographicCenter[1],
       zoom,
     });

     if (updateAttributions) {
       updateAttributions(tileset.credits?.attributions);
     }
};

const tile3DLayer = new Tile3DLayer({
 id: "tile-3d-layer",
 data: 'https://api.olamaps.io/tiles/vector/v1/3dtiles/tileset.json?api_key=${your_api_key}",
 onTilesetLoad,
});