Mathematical engineer. Software developer at Act Now Coalition.
data = FileAttachment("bandcamp-oneday.csv").csv({ typed: true })
Inputs.table(data)
sample = data.filter(d => d.country == "Netherlands")
Plot.plot({
marks: [
Plot.dot(sample, {x: "utc_timestamp", y: "amount_paid"})
]
})
// hint:
sample.map(d => d.amount_paid)
// type your code here:
Plot.plot({
marks: [
Plot.dot(sample, { x: "utc_timestamp", y: "amount_paid", fill: "red" }),
Plot.dot(sample, { x: "utc_timestamp", y: "item_price", stroke: "blue" })
]
})
// type your code here:
Plot.plot({
marks: [
Plot.dot(sample, {
x: "utc_timestamp",
y: "item_price",
stroke: "orange"
}),
Plot.arrow(sample, {
x1: "utc_timestamp",
x2: "utc_timestamp",
y1: "item_price",
y2: "amount_paid"
})
]
})
// type your code here:
Plot.dot(sample, {
x: "utc_timestamp",
y: (d) => d.amount_paid - d.item_price
}).plot()
// type your code here:
Plot.dot(sample, {
x: "utc_timestamp",
y: (d) => d.amount_paid - d.item_price,
fill: "blue"
}).plot()
// hint:
d3.extent(sample, d => d.amount_paid - d.item_price)
// type your code here:
Plot.dot(sample, {
x: "utc_timestamp",
y: (d) => d.amount_paid - d.item_price,
stroke: (d) => d.amount_paid - d.item_price > 0
}).plot({ color: { range: ["orange", "steelblue"] } })
// hint:
sample.map(d => d.amount_paid - d.item_price > 0)
// type your code here
Plot.barX(
data,
Plot.groupY(
{ x: "mean" },
{ x: "amount_paid", y: "type", sort: { y: "x", reverse: true, limit: 3 } }
)
).plot({ marginLeft: 100 })
// type your code here
Plot.rectY(
data,
Plot.binX(
{ y: "count" },
{ x: (d) => d.amount_paid - d.item_price, thresholds: 40 }
)
).plot({ grid: true })
// type your code here
Plot.rectY(
data,
Plot.binX(
{ y: "sum" },
{
x: "utc_timestamp",
y: "amount_paid",
fill: "type",
thresholds: d3.utcHour
}
)
)
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.
