# deck.gl
**Repository Path**: renegade000/deck.gl
## Basic Information
- **Project Name**: deck.gl
- **Description**: WebGL2 powered geospatial visualization layers
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 0
- **Created**: 2019-08-08
- **Last Updated**: 2020-12-19
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
WebGL2-powered, highly performant large-scale data visualization
[](https://uber.github.io/deck.gl)
## Installation
```
npm install deck.gl
```
## Using deck.gl
deck.gl offers an extensive catalog of pre-packaged visualization "layers", including [ScatterplotLayer](http://deck.gl/#/documentation/deckgl-api-reference/layers/scatterplot-layer), [ArcLayer](http://deck.gl/#/documentation/deckgl-api-reference/layers/arc-layer), [TextLayer](http://deck.gl/#/documentation/deckgl-api-reference/layers/text-layer), [GeoJsonLayer](http://deck.gl/#/documentation/deckgl-api-reference/layers/geojson-layer), 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:
```js
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/uber-common/deck.gl-data/blob/master/website/bart-stations.json',
getRadius: d => Math.sqrt(d.entries) / 100,
getPosition: d => d.coordinates,
getFillColor: [255, 228, 0],
});
```
## Using deck.gl with React
```js
import DeckGL from 'deck.gl';
```
## Using deck.gl with Pure JS
```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]
});
```
Minimum setups of end-to-end deck.gl usage is also showcased in the [hello-world examples](./examples/get-started), using both [webpack](https://webpack.js.org/) and [browserify](http://browserify.org/), so you can choose which bundler you prefer or are more familiar with.
To learn how to use deck.gl through the many examples that come with the deck.gl repo, please clone the latest **release** branch:
```
git clone -b 6.2-release --single-branch https://github.com/uber/deck.gl.git
```
For the most up-to-date information, see our [API documentations](http://deck.gl/#/documentation)
## Contributing
PRs and bug reports are welcome, and we are actively opening up the deck.gl [roadmap](./dev-docs) to facilitate for external contributors.
Note that you once your PR is about to be merged, you will be asked to register as a contributor by filling in a short form.
## Attributions
#### Data sources
Data sources are listed in each example.
#### The deck.gl project is supported by
