Former physicist turned programmer with research experience building complex computational models for physical systems.
Published
Edited
Dec 21, 2021
1 fork
9 stars
data = (await FileAttachment("books@2.csv").csv()).map(d=>({
...d,
Start: new Date(d.Start),
Finish: new Date(d.Finish),
"Days to Read":+d['Days to Read'],
"Page Count":+d["Page Count"],
Speed:+d.Speed
}))
BooksbyYear = d3.group(data.filter(d=>(d.Status === "Read")), d=>d.Finish.getFullYear())
function by_line(title, author){
let split_authors = author.split(', ')
if (split_authors.length > 1)
{return title + ' by ' + split_authors.map(d=>last_name(d)).join(' & ') }
else
{return title + ' by ' + last_name(author)}
}
function last_name(name){
let parts = name.split(' ')
return parts[parts.length-1]
}
function dateDomain(dates){
let year_domain = d3.extent(dates.map(d=>d.getFullYear()))
return [new Date(year_domain[0]+'-01-01'), new Date(year_domain[1]+'-12-31')]
}
function time_line_plot(data){
return Plot.plot({
width:width,
marginRight:360,
y:{
axis: null,
domain:d3.sort(data, d=>d.Finish).map(d=>by_line(d.Title, d.Author))
},
x:{
//insetRight:400,
domain: dateDomain(data.map(d=>d.Finish)),
clamp:true,
grid:true
},
color: {
domain: ["Fiction", "Nonfiction"],
range: [fiction_color, nonfiction_color],
legend: true
},
marks:[
Plot.barX(data, {y:d=>by_line(d.Title, d.Author), x1:"Start", x2:'Finish', fill:'Fiction/Nonfiction', rx:5}),
Plot.text(data, {
x: "Finish",
y: d=>by_line(d.Title, d.Author),
text: d=>by_line(d.Title, d.Author),
textAnchor: "start",
dx: 6
})
]
})
}
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.
