News and graphics at @ClimateLab, a project of @PostGraphics.
// Returns a "d" attribute for a path
circleSwoop = (a, b, height, offset) => {
const o = offset || .1,
h = height || 0,
midpoint = geometric.lineMidpoint([[a[0], a[1]], [b[0], b[1]]]),
top = [midpoint[0], midpoint[1] - h],
bottom = [midpoint[0], midpoint[1] + h];
return `M${swoopy.cubic([a[0], a[1] - a[2]], top, -o).join("L")}
L${swoopy.cubic(top, [b[0], b[1] - b[2]], o).join("L")}
L${swoopy.cubic([b[0], b[1] + b[2]], bottom, -o).join("L")}
L${swoopy.cubic(bottom, [a[0], a[1] + a[2]], o).join("L")}Z`;
}
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.
