Partner and Head of Research at @data-desk
Public
Edited
Dec 13, 2023
1 star
lineChart(data, "Alternative data", 10, "Google searches for\n\"alternative data\"")
cell_width = 280
cell_height = 130
function lineChart(data, variable, years, title) {
return Plot.plot({
marks: [
Plot.text([title], { x: d3.utcYear.offset(new Date(), -(years - 1)), y: d3.max(data.filter(d => d.variable === variable), v => v.value) - d3.max(data.filter(d => d.variable === variable), v => v.value) / 20, textAnchor: "start" }),
Plot.lineY(
data.filter(d =>
d.variable === variable &&
d.date >= d3.utcYear.offset(new Date(), -years)
),
{ x: "date", y: "value", curve: "catmull-rom" }
),
],
y: {
label: null,
tickFormat: d3.format(",.2s"),
domain: [
d3.min(data.filter(d => d.variable === variable), v => v.value),
d3.max(data.filter(d => d.variable === variable), v => v.value) +
d3.max(data.filter(d => d.variable === variable), v => v.value) * .2
]
},
width: cell_width,
height: cell_height,
marginTop: -10
})
}
data1 = FileAttachment("data@1.csv").csv()
function bigNumber(data, variable, title) {
return Plot.plot({
marks: [
Plot.text([title], {
frameAnchor: "top",
lineHeight: 1.5
}),
Plot.text([Math.round(data.find(d => d.variable === variable).value)], {
frameAnchor: "middle",
fontSize: 80
})
],
width: cell_width,
height: cell_height,
style: {
background: "black",
color: "white"
}
})
}
data = FileAttachment("data@2.csv").csv({ typed: true }).then(d => d.map(e => ({ ...e, variable: "Alternative data" })))
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.
