Graphics Developer, Creative Coder, DataViz Cognoscenti
{
const width = 100;
const height = 100;
const radius = 50;
const innerRadius = 0;
const progress = 0.67;
const pie = d3.pie().sort(null);
const data = [progress, 1 - progress];
const arcs = pie(data);
const pathGenerator = d3
.arc()
.innerRadius(radius * innerRadius)
.outerRadius(radius);
const pathDef = pathGenerator(arcs[0]);
return htl.svg`<svg style="width: 3rem; height: 3rem; overflow: visible;" viewBox="-50 -50 100 100">
<path d=${pathDef} />
</svg>`;
}
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.
