playing with space, shape, colour & composition
Simple canvas particle systemword distribution experimental visualsHarmonic Oscillations: An Interactive Canvas of Dynamic ShapesCanvas dynamic patternSimple canvas polygonRandom force networkits 100.0% rectangle squareusing date as seed for viewSVG hexbin image renderword cloud alternativerandom city landscapeSol LeWitt Wall DrawingMorphological TableD3 | parametric equationsI am inexpressibleTeam clusters using circle packingTeam groupingTeam waffleLaurie Anderson quotes — type playpoly-linear scale with css radial gradientInterpolate along lineV60 coffee | James Hoffmann recipewaffle timeSVG clipPath using d3columns/divisonsUK waffle mapforce animationCluster packinginterpolating two strings
Strange Attractors v1
plot = (params, interpolator, xDomain, yDomain) =>
densityPlot(
pointDensity(width, width)
.xDomain(xDomain)
.yDomain(yDomain)
.batchSize(1e5)
)
.color(buf => d3.scaleSequentialLog([1, d3.max(buf) / 2], interpolator))
.background('#fff')
.drawAxes(false)(
cliffordOrbit(numPoints, 0, 0, params.a, params.b, params.c, params.d)
)
loop = {
let i = 0.8;
let direction = "up";
while (true) {
await Promises.delay(d3.randomUniform(400, 2200)());
if (i > 1.9) {
direction = "down";
} else if (i < 0.8) {
direction = "up";
}
i = direction === "up" ? i + 0.1 : i - 0.1;
yield i;
}
}
numPoints = 10000000
comma = d3.format(',')
d3 = require('d3@6')
import { html } from '@observablehq/htl'
import {
densityPlot,
pointDensity,
cacheInterpolator
} from '@twitter/density-plots@4159'
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.
