deck.gl

deck.gl

A GPU-powered, highly performant framework for large-scale data visualization.

API Documentation

Installation

npm install deck.gl

Using deck.gl

deck.gl offers an extensive catalog of pre-packaged visualization "layers", including ScatterplotLayer, ArcLayer, TextLayer, GeoJsonLayer, etc. The input to a layer is usually an array of JSON objects. Each layer offers highly-flexible API to customize how the data should be rendered.

Example constructing a deck.gl ScatterplotLayer:

import {ScatterplotLayer} from '@deck.gl/layers';

/**
 * data is an array of object in the shape of:
 * {
 *   "name":"Montgomery St. (MONT)",
 *   "address":"598 Market Street, San Francisco CA 94104",
 *   "entries":"43430",
 *   "exits":"45128",
 *   "coordinates":[-122.401407,37.789256]
 * }
 */
const scatterplotLayer = new ScatterplotLayer({
  id: 'bart-stations',
  data: 'https://github.com/visgl/deck.gl-data/blob/master/website/bart-stations.json',
  getRadius: d => Math.sqrt(d.entries) / 100,
  getPosition: d => d.coordinates,
  getColor: [255, 228, 0],
});

Using deck.gl with React

import DeckGL from 'deck.gl';

<DeckGL width="100%" height="100%" longitude={-122.4} latitude={37.78} zoom={8} controller={true} layers={[scatterplotLayer]} />

Using deck.gl with Pure JS

import {Deck} from '@deck.gl/core';

const deck = new Deck({
  container: document.body,
  width: '100vw',
  height: '100vh',
  longitude: -122.4,
  latitude: 37.78,
  zoom: 8,
  controller: true,
  layers: [scatterplotLayer]
});

Questions? Submit an issue on our GitHub page.

Changelog

deck.gl [v9.2.0-alpha.3] - Sep 15 2025

• fix(core): orthographic scroll zoom transitions (#9769)
• fix(widgets): Minor widget fixes (#9758)
• CARTO: Support h3 in HeatmapTileLayer (#9753)
• feat(widgets): Support custom widgets in pydeck via custom_libraries (#9745)
• feat(core): Add async DeckPicker methods (#9732)
• feat(webgpu): Enable transparency for WebGPU and ported example layers (#9730)
• fix(webgpu): Emulate constant attributes as buffers and trigger update on constant change (#9726)
• fix(layers): correctly identify elevationData strings using TMS (#9712)
• fix(mesh-layers): Include @loaders.gl/schema dependency (#9697)
• feat(layers): Port ScatterplotLayer to WebGPU / WGSL (#9432)
• chore(geo-layers): version bump A5 (#9707)
• fix(core): correct opacity in interleaved mode (#9642)
• feat(core): Support clear color, depth, and stencil on multiple views (#9650)
• fix(mapbox): Fix view selection logic in getViewport (#9688)
• chore: Bump to luma.gl@9.2.0-alpha (#9241)
• fix(google): Do not force canvas resize (#9695)
• fix(CARTO): H3 tile bounding box includes edge children (#9693)
• fix(core): onClick callback does not handle dblclick (#9629)