// Quite heavy to load, leaving it her to show how the passes data have been agreggated to compute force field
// passes = d3.dsvFormat(',').parse(((await FileAttachment("pass.csv").text())), d3.autoType)
// .filter(d => d.pass_end_location)
// .map(d => {
// const end = {
// x: +d.pass_end_location.split(',')[0].slice(1),
// y: +d.pass_end_location.split(',')[1].slice(0, -1)
// }
// const deltaY = Math.sin(d.pass_angle) * d.pass_length;
// const deltaX = Math.cos(d.pass_angle) * d.pass_length;
// const x = end.x - deltaX
// const y = end.y - deltaY
// return {
// ...d,
// x,
// y,
// end,
// angle: d.pass_angle,
// dist: d.pass_length,
// key: `${Math.floor(x)}_${Math.floor(y)}`
// }})
// passFlowField = _(passes)
// .groupBy('key')
// .map(cell => {
// return {
// key: cell[0].key,
// x: Math.floor(cell[0].x),
// y: Math.floor(cell[0].y),
// angle: meanAngleDeg(cell.map(d => d.angle)),
// dist: d3.mean(cell, d => d.dist)
// }
// })
// .keyBy('key')
// .value()
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.
