Published
Edited
Apr 3, 2021
Insert cell
Insert cell
import {Range} from "@observablehq/inputs"
Insert cell
html`
<canvas id="c" width="720" height="720">`
Insert cell
viewof step = Range([1, 50], { step: 0.5 })
Insert cell
{
let c = document.getElementById('c')
let context = c.getContext('2d')
context.clearRect(0, 0, c.width, c.height);
for (let x = 0; x < 256; x++) {
for (let y = 0; y < 256; y++) {
if ((x ^ y) % step) {
context.fillRect(x*4, y*4, 4, 4);
}
}
}
}
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