Wise Fool.
Visioneer.
Published
Edited
Dec 21, 2021
1 star
Lambdoma table of ratiosGeometric construction of square rootsDieter RamsAudio FiltersHarmony Map45 degree gridTexture—Generative SnacksE series of preferred numbersWavesRingsTest 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
Sol Lewitt – Wall Drawing 273
Also listed in…
Arty
wd237 = (wall) => {
const b = 10 * 5;
const axis = ({domain: [0, 1], tickSize: 0, tickFormat: _ => null});
return penciler(
Plot.plot({
width: b * 17, height: b * 15,
marginLeft: 0, marginRight: 0,
marginTop: 0, marginBottom: 0,
x: axis, y: axis,
style: {background: "#f0f0e9"},
marks: markers(wall)
}),
wall
);
}
markers = (wells) => wells.map(
({stroke, rays}) =>
Plot.link(
rays,
{
x1: "x1",
y1: "y1",
x2: "x2",
y2: "y2",
stroke,
}
)
)
instructions = combinations(1, 3, lines)
lines = [middles, corners, center]
middles = ({
name: "midpoints",
stroke: r,
rays: liner({
length: 10,
points: [
[0, 0.5],
[0.5, 0],
[0.5, 1],
[1, 0.5]
]
})
})
corners = ({
name: "corners",
stroke: b,
rays: liner({
length: 10,
points: [
[0, 0],
[0, 1],
[1, 0],
[1, 1]
]
}),
})
center = ({
name: "center",
stroke: y,
rays: liner({
length: 20,
points: [
[1/2, 1/2],
],
})
})
liner = ({points, length = 10}) => {
refresh;
const r = () => Math.random();
return points
.flatMap(
([x1, y1]) =>
Array.from(
{length}, () => ({
x1,
y1,
x2: r(),
y2: r(),
})
))
}
// this is a fragile hack! selects nodes based on (unique?) stroke color
// are there better ways to select nodes w/o id?
penciler = (pad, well) => {
const r = d3.select(pad);
pencil({defs: r.append("defs"), frequency: frequency, scale, seed, octaves});
well.forEach(
({stroke}) =>
r
.selectAll(`g[stroke='${stroke}']`)
.attr("stroke-width", strokeWidth)
.attr("filter", "url(#pencil)")
);
return pad;
}
pencil = ({defs, id = "pencil", frequency = 0.035, scale = 7, seed = 0, octaves}) => {
const filter = defs
.append("filter")
.attr("id", id)
;
filter
.append("feTurbulence")
.attr("baseFrequency", frequency)
.attr("numOctaves", octaves)
// .attr("type", "fractalNoise")
// .attr("seed", seed)
;
filter
.append("feDisplacementMap")
.attr("in", "SourceGraphic")
.attr("scale", scale)
;
}
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.
