Platform
Resources
Pricing
Sign in
Contact us
Dylan
Senior Software Engineer at the Center for Spatial Data Science, UChicago. Lead engineer on the US Covid Atlas
Workspace
Fork
Public
By
Dylan
Edited
Sep 19, 2023
Fork of
deck.gl
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
deck
=
require
(
'deck.gl@6.2.3/deckgl.min.js'
)
Insert cell
mapboxgl
=
require
(
'mapbox-gl@~0.50.0/dist/mapbox-gl.js'
)
Insert cell
deckgl
=
{
// This is an Observable hack: clear previously generated content
baseMap
.
innerHTML
=
''
;
return
new
deck
.
DeckGL
(
{
// The HTML container to render into
container
:
baseMap
,
// Mapbox settings
// set `map: false` to turn off Mapbox base map
map
:
mapboxgl
,
// This token is for demo-purpose only and rotated regularly. Get your token at https://www.mapbox.com
mapboxApiAccessToken
:
'pk.eyJ1IjoidWJlcmRhdGEiLCJhIjoiY2pudzRtaWloMDAzcTN2bzN1aXdxZHB5bSJ9.2bkj3IiRC8wj3jLThvDGdA'
,
mapStyle
:
'mapbox://styles/mapbox/dark-v9'
,
// Viewport settings
longitude
:
-
105.7821
,
latitude
:
39.5501
,
zoom
:
4
,
pitch
:
0
,
bearing
:
0
,
layers
:
[
geojLayer
]
}
)
;
}
Insert cell
ccData
=
FileAttachment
(
"3261.json"
)
.
json
(
)
Insert cell
geojLayer
=
new
deck
.
GeoJsonLayer
(
{
data
:
ccData
.
geographies
,
filled
:
true
,
id
:
"geoj-test"
,
getFillColor
:
d
=>
[
255
*
Math
.
random
(
)
,
0
,
0
]
}
)
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Compare fork
Fork
View
Export
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
baseMap
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
deck
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
mapboxgl
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
deckgl
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ccData
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
geojLayer
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML