Questions tagged [deck.gl]

deck.gl is a WebGL-powered framework for visual exploratory data analysis of large datasets.

About

deck.gl is a WebGL-powered framework for visual exploratory data analysis of large datasets. The basic idea of using deck.gl is to render a stack of visual overlays, usually (but not always) over maps.

To make this simple concept work, it handles a number of challenges:

  • Large data sets and performant updates
  • Interactive event handling such as picking
  • Cartographic projections and integration with underlying map
  • A catalog of proven, well-tested layers
  • Easy to create new layers or customize existing layers

deck.gl has been designed according to the principles of the Reactive Programming Model, inspired by .

The key to writing good, performant deck.gl applications and layers lies in understanding how to minimize updates and redundant calculations.

Links

238 questions
8
votes
1 answer

change layer property based on slider input with deck.gl

I am following an example provided on the deck.gl github repository that displays polygons from a geojson. I've since changed the initial focus of the map and provided my own geojson to visualise, the data I've replaced the examples with has a…
zacdav
  • 4,603
  • 2
  • 16
  • 37
7
votes
2 answers

Display: none on Deck.gl React component causes huge performance issue

EDIT: This issue is specific to this setup. Please use the code from here if you wish to help. Thanks! I am using Deck.gl with react to display a map. When I try to hide the map with display: none it starts to freeze up my whole computer. I have…
7
votes
4 answers

How to embed kepler.gl map in HTML page?

I have downloaded the source codes for kepler.gl from https://github.com/uber/kepler.gl and I have successfully created a local map using a dataset stored in geojson: Now my question is, how do I embed this map into an HTML page on my website? I…
sveti petar
  • 3,637
  • 13
  • 67
  • 144
7
votes
2 answers

Deck.gl how to show popup onClick

Setup: Basic react app using react-map-gl to show a map with a deck.gl ScatterplotLayer over the top to visualise the data Goal: 1) To show points on a map as circles of a given radius and colour. 2) When a user clicks on a circle, a tooltip/popup…
Naadof
  • 459
  • 5
  • 16
6
votes
1 answer

How to display Superset data as polygons in deck.gl

Superset has a deck.gl Polygon visualisation type. I am trying to use this type of chart to display polygons taken from a PostGIS enabled postgres database; however, no visual information is displayed other than the legend. My database query is as…
songololo
  • 4,724
  • 5
  • 35
  • 49
6
votes
3 answers

deck.gl + tripslayer without react.js

How can I enable animation of TripsLayer without react? TripsLayer example uses React and I really don't know, how to convert it to pure js. Please look at "animate" function in the code below. I tried to update state of layer but it doesn't work…
elniño
  • 121
  • 1
  • 7
6
votes
2 answers

How to run the Deck.gl getting started examples

I am a newbie in terms of react, js and deck.gl and would like to run the basic getting started example from deck.gl: Where do I put this code, which extension do I use, do I need other files e.g. app.js to run this: import DeckGL from…
user7684764
5
votes
0 answers

React, Mapbox, Deck.GL Scatterplot Layer: Data Not Updating

I am trying to create a React app that uses deck.gl on a Mapbox map, and I am having trouble updating the "data" prop within a deck.gl Scatterplot layer. I left out some code where I am returning elements, etc. I am initializing the data props as…
5
votes
1 answer

How do I dynamically toggle multiple layers in Deck.gl?

I am building a basic visualization system that layers can be toggled from the control box. I have layers that merge individual layers into one. const [layers, setLayers] = useState([densityLayer, pedestrianLayer]); I have filterState that tracks…
D Park
  • 504
  • 10
  • 19
5
votes
1 answer

deck.gl GeoJsonLayer: update feature color on click

I'm using the deck.gl GeoJsonLayer to display regions on a map. through an event, I was able to make these regions selectable. what I am struggling with, is to change the color of a feature in the feature selection after clicking on it. this is the…
jaronimoe
  • 595
  • 1
  • 6
  • 12
5
votes
1 answer

Deck.gl (Mapbox) StaticMap doesn't resize - overwrites everything on the screen

I am trying to add a basic deck.gl (mapbox static map) to a react project - which I can do; however, once the map is loaded it takes up the entire page and any other information is hidden behind the map. For example, I have some text in a

above…

Liam G
  • 771
  • 2
  • 9
  • 26
5
votes
1 answer

Unable to capture onClick events on Marker's children included in deck.gl@^7.1.10

I used deck.gl@^6.4.7 and react-map-gl@^5.0.7, and I had placed a Marker with an icon children that was listening on click events. When I updated the deck.gl to version 7.1.10, the icon's click events stopped working. Do you have any idea how to…
5
votes
4 answers

Meteor app not finding 'xhr-sync-worker.js'?

I am trying to run a deck.gl example inside a meteor app. But I am facing this error. modules-runtime.js?hash=8587d18…:231 Uncaught Error: Cannot find module './xhr-sync-worker.js' at makeMissingError (modules-runtime.js?hash=8587d18…:231) …
fccoelho
  • 6,012
  • 10
  • 55
  • 67
4
votes
1 answer

How to serve multiple .pbf files instead of .mbtiles with TileServer-GL or OpenMapTiles server as vector tiles into Google Maps with Deck.GL MVTLayer?

Summary I have .geojson files and want to convert them (with tippecanoe / geobuf / other) to .mbtiles or .pbf files to serve them as vector tiles from a server (TileServer-GL / OpenMapTiles / other vector tile server) into Google Maps with Deck.GL's…
Florin Vîrdol
  • 395
  • 2
  • 10
  • 28
4
votes
2 answers

Using deck.gl with react-leaflet

Is it possible to use react-leaflet as a base map for deck.gl overlay? I am experimenting with the earthquake example and when I try to use leaflet-react instead of {StaticMap} from 'react-map-gl' it doesn't seem to work. Any ideas? import React,…
johnny
  • 2,032
  • 1
  • 25
  • 45
1
2 3
15 16