Plot.plot({
marks: [
Plot.dot(salamanders, {
x: "totalLength",
y: "weight",
fill: "creekSection",
opacity: 0.45
})
]
})
Plot.plot({marks: [
Plot.rectY(salamanders, Plot.binX({y:"mean"}, {x: "date", y:"totalLength", interval: "5 years"}))
]})
stocksBig3
X*
—
Y*
—
Color
—
Size
—
Facet X
—
Facet Y
—
Mark
Auto
Type Chart, then Shift-Enter. Ctrl-space for more options.
stocksBig3 = stocks.filter(
(d) =>
d.stock_symbol === "AAPL" ||
d.stock_symbol === "GOOGL" ||
d.stock_symbol === "TSLA"
)
Plot.plot({
marks: [
Plot.lineY(stocksBig3, { x: "date", y: "close", stroke: "stock_symbol" })
],
color: { legend: true }
})
Plot.plot({
marks: [
Plot.lineY(stocksBig3, { x: "date", y: "close", stroke: "stock_symbol", opacity:0.4 }),
Plot.lineY(stocksBig3,Plot.windowY(
{k: 30,anchor: "middle",reduce:"mean"},
{x:"date", y:"close", stroke:"stock_symbol", tip:true})
),
Plot. text(stocksBig3, Plot.selectLast({ x: "date", y:"close", text:"stock_symbol",fill:"stock_symbol"}))
],
color: { legend: true }
})
Plot.plot({
marks: [
Plot.lineY(stocksBig3,{x:"date", y:"close", fill:"stock_symbol", opacity:0.45, tip:true}),
Plot.tip(stocksBig3, Plot.selectMaxY({x:"date", y:"close", stroke:"stock_symbol",anchor:"right",fill:"yellow"}))
]
})
viewof pickColor = Inputs.color({ label: "Favorite color", value: "#4682b4" })
wb = FileAttachment("wb_tidy.csv").csv({ typed: true })
wb2010 = wb.filter((d) => d.year === 2010)
Plot.plot({
marks: [
Plot.dot(wb2010, { x: "gdp", y: "life_exp", fill: "gray" }),
],
x: { type: "log" },
margin: 50
})
viewof selectRegion = Inputs.select(
wb.map((d) => d.region),
{ label: "Select region:", unique: true }
)
Plot.plot({
marks: [
Plot.dot(wb, { x: "gdp", y: "co2", fill: "country_name", filter: d => d.region == selectRegion && d.year }),
],
x: { type: "log" },
margin: 50
})
viewof pickYear= Inputs.range(d3.extent(wb,d=>d.year),{label:"Year", step: 1,value:d3.min(wb,(d)=> d.year)})
Plot.plot({
marks: [
Plot.dot(salamanders, {
x: "totalLength",
y: "weight",
fill: "creekSection",
fy:"creekSection"
})
]
})
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.
