deck.gl Overlay View

  • Deck.gl is a WebGL-powered visualization framework offering diverse 2D and 3D data visualizations, easily integrated with the Maps JavaScript API using its GoogleMapsOverlay class.

  • It supports various data sources and formats, enabling composite visualizations by layering multiple visualization types on the map, best utilized with the vector map for leveraging WebGL's 3D capabilities.

  • Deck.gl can be integrated using a script tag or installed as modules from NPM, with detailed guidance available in the deck.gl documentation.

  • Numerous 2D and 3D visualization options are provided by Deck.gl, optimized for different data types, as showcased in the Layer Catalog on the deck.gl website.

  • Examples demonstrate the integration of Deck.gl and the Maps JavaScript API, including ArcLayer, Trips Layer, and ScatterPlot visualizations.

View Sample

Deck.gl is a WebGL-powered visualization framework that provides a variety of easy-to-use 2D and 3D data visualizations with support for large data sets. You can add deck.gl data visualizations with the Maps JavaScript API with deck.gl’s GoogleMapsOverlay class.

Deck.gl supports multiple datasources and formats, as well as creating composite visualizations by rendering multiple visualization layers on the map.

Requirements

To use deck.gl you must use the raster or vector map provided by the Maps JavaScript API. It is highly recommended that you use the vector map so that you can take full advantage of the WebGL-powered features of Google’s basemap, including tilt, rotation, and full 3D camera control.

See the vector map overview for details.

Loading deck.gl

Deck.gl can be loaded in your web app using either a script tag, or installed as modules from Node Package Manager (NPM).

For more information, see the @deck.gl/google-maps documentation on the deck.gl website.

Adding deck.gl visualizations to the map

Deck.gl visualizations are added to the map by creating an instance of the GoogleMapsOverlay class provided by deck.gl.

For more information, see the GoogleMapsOverlay documentation on the deck.gl website.

Available visualizations

Deck.gl provides many different 2D and 3D visualizations that are optimized for displaying different types of data. For a complete list, see the Layer Catalog on the deck.gl website.

Examples

See more examples of deck.gl and Maps JavaScript API in action: