The end-to-end solution for building and hosting better data apps, dashboards, and reports.
Public
Edited
Jul 14, 2023
16 forks
Importers
16 stars
Plot.plot({
marks: [
Plot.dot(cars, {x: "power (hp)", y: "economy (mpg)"})
]
})
cars
FileAttachment("data101.xlsx").xlsx()
nycSpreadsheet = FileAttachment("data101.xlsx").xlsx()
Select a data source…
Type Table, then Shift-Enter. Ctrl-space for more options.
nycData = nycSpreadsheet.sheet(0, { headers: true })
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice"})
]
})
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill: "neighborhood"})
],
marginLeft: 100
})
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill: "neighborhood"})
],
color: { legend: true },
marginLeft: 100
})
Plot.plot({
marks: [
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", r: "priceCutShare", fill: "neighborhood"})
],
color: { legend: true },
marginLeft: 100
})
Plot.plot({
marks: [
Plot.ruleY([0]),
Plot.line(nycData, { x: "date", y: "medianAskingPrice", stroke: "neighborhood"}),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill: "neighborhood", r: "priceCutShare"}),
],
color: { legend: true },
marginLeft: 100,
})
Plot.plot({
facet: {
data: nycData,
y: "borough",
marginRight: 100,
},
marks: [
Plot.frame({ stroke: "lightgray" }),
Plot.ruleY([0]),
Plot.dot(nycData, {x: "date", y: "medianAskingPrice", fill: "neighborhood", r: "priceCutShare"}),
Plot.line(nycData, { x: "date", y: "medianAskingPrice", stroke: "neighborhood", z: "neighborhood"}),
],
color: { legend: true },
marginLeft: 100,
})
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.
