Public
Edited
Feb 28, 2024
Insert cell
Insert cell
Insert cell
Insert cell
myValue = {
const a = 20;
const b = 20;

return a + b;
}
Insert cell
newValue = myValue * 20
Insert cell
myOtherValue = 300 * newValue
Insert cell
Insert cell
MyData
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
MTA_Daily_Ridership_Data__Beginning_2020-9.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
mypizza
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
myNewDatabase = DuckDBClient.of({MyData})
Insert cell
myEndpointData = d3.json("https://data.ny.gov/resource/vxuj-8kew.json")
Insert cell
myNewDatabase
SELECT * FROM MyData
Insert cell
Insert cell
MyData
X
Buses: Total Estimated Ridership
Y
Subways: Total Estimated Ridership
Color
Subways: Total Estimated Ridership
Size
Subways: Total Estimated Ridership
Facet X
Facet Y
Mark
Auto
Type Chart, then Shift-Enter. Ctrl-space for more options.

Insert cell
mypizza
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
mypizza
SELECT * FROM "mypizza"
Insert cell
mypizza
X
order_date
Y
sum
orders
Color
Size
Facet X
category
Facet Y
day_of_week
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.

Insert cell
Plot.plot({
marginLeft: 100,
marginRight: 200,
marks: [
Plot.frame({ strokeOpacity: 0.1 }),
Plot.rectY(
mypizza,
Plot.binX(
{ y: "sum" },
{
fx: "category",
fy: "day_of_week",
x: "order_date",
y: "orders",
fill: "category",
tip: true
}
)
),
Plot.ruleY([0])
],
height: 600
})
Insert cell
Plot.plot({
y: {
tickFormat: "s"
},
marks: [
Plot.areaY(industries, {x: "date", y: "unemployed", fill: "industry"}),
Plot.ruleY([0])
]
})
Insert cell
d3.version
Insert cell
import {spiralChart} from "5cd780827f3ca5bd"
Insert cell
mypizza = pizza
Insert cell
mypizza
Type SQL, then Shift-Enter. Ctrl-space for more options.

Insert cell
pizza
Type Table, then Shift-Enter. Ctrl-space for more options.

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.
Learn more