Creative coder working at the intersection of computation and creativity.
goodgraphics(
{
height: 600,
width: 600,
attributes: {
fill: "white",
style: "background: #eee",
stroke: "#1b1b1b"
}
},
(svg) => {
const numberOfRects = 50;
const margin = svg.height * 0.025;
const rectHeight = svg.height / 4;
const rectWidth = svg.width / 4;
const drawRects = (rotate) => {
svg.times(
numberOfRects,
(index) => {
const posX = svg.map(
index,
0,
numberOfRects,
margin,
svg.width - margin - rectWidth
);
const posY = svg.map(
index,
0,
numberOfRects,
margin,
svg.height - margin - rectHeight
);
svg.square(posX, posY, rectWidth, rectHeight);
},
{
transform: rotate
? `rotate(${rotate} ${svg.width / 2} ${svg.height / 2})`
: ""
}
);
};
drawRects();
drawRects(90);
svg.draw();
}
)
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.
