Published
Edited
Jun 5, 2021
Insert cell
Insert cell
goodgraphics(
{
height: 600,
width: 600,
attributes: {
fill: "none" || "#fff",
style: "background: #eee",
stroke: "#1b1b1b"
}
},
(svg) => {
const numberOfCircles = 90;
const maxSize = svg.height * 0.19;

svg.times(numberOfCircles, (circleIndex) => {
const rotateAmt = svg.map(circleIndex, 0, numberOfCircles, 0, 360);

svg.ellipse(
svg.width / 2,
svg.height * 0.2,
svg.width * 0.1,
svg.height * 0.19,
{
transform: `rotate(${rotateAmt} ${svg.width / 2} ${svg.height / 2})`
}
);
});

svg.circle(svg.width / 2, svg.height / 2, svg.width * 0.49);

svg.draw();
}
)
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more