The avatar for @martien
Martien van Steenbergen
Wise Fool. Visioneer.
Published
Edited
Aug 13, 2022
6 stars
Showroom
Lambdoma table of ratiosGeometric construction of square rootsDieter RamsAudio FiltersHarmony Map45 degree gridTexture—Generative SnacksE series of preferred numbers
Waves
RingsSol Lewitt – Wall Drawing 273Test CardRadar Screen GlowStrategy CanvasSun LogoCOVID-19 Netherlands Reproduction Number TutorialRun PlotCOVID-19-NL daily reported per MHSBlock QuoteTesla « Hoshin KanriSimultaanlimietSVG PatternsTartanBillboardFlowerElectronic color codeDonutCOVID-19 ReproductiegetalSTER & CultuurE series of preferred numbers and their colorsMoon PhasesX-MatrixMagic Balls Factory
Also listed in…
Arty
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
xsAbsolute = d3.range(0, width + 1, width / (frequency - 1)).map(Math.round)
Insert cell
// takes waves count
// returns list of wave count normalized y postions
ysNormalized = (waves) => Array.from({length: waves}, (_, i) => (2 * i + 1) / (2 * waves));
Insert cell
ysNormalized(waves)
Insert cell
// takes a xsAbsolute, amplitude, time
// returns a function that takes yNormalized and returns an SVG path string
// that can be used inside a path d attribute
path = (xsAbsolute, amplitude, time) => (yNormalized) =>
line(
wave(
xsAbsolute,
yNormalized * height, // === yAbsolute
yNormalized,
amplitude,
time,
)
)
Insert cell
path(xsAbsolute, amplitude, 1)(ysNormalized(waves)[1])
Insert cell
// takes xsAbsolute, yAbsolute, yNormalized, amplitude, time
// returns list of absolute points for a single wave, ready for d3.line()
wave = (xsAbsolute, yAbsolute, yNormalized, amplitude, time) =>
xsAbsolute.map
(
(xAbsolute, step) =>
[
xAbsolute,
yAbsolute + amplitude * simplex(step, yNormalized, time),
]
)
Insert cell
Insert cell
// todo: more elegant way to pause/resume the animation; tips welcome!
time = animate
? now * speed / 1e4
// ? 17
: 0
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
R = require("ramda")
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