Published
Edited
Mar 23, 2022
2 stars
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
flakeIFS = new IteratedFunctionSystem([
scale(1 / 3, [0, 1]),
scale(1 / 3, [-Math.sqrt(3) / 2, 1 / 2]),
scale(1 / 3, [-Math.sqrt(3) / 2, -1 / 2]),
scale(1 / 3, [0, -1]),
scale(1 / 3, [Math.sqrt(3) / 2, -1 / 2]),
scale(1 / 3, [Math.sqrt(3) / 2, 1 / 2]),
scale(1 / Math.sqrt(3)).compose(rotate(Math.PI / 6))
])
Insert cell
// The odd points like [-Math.sqrt(3) / 2, 1 / 2] arise since we'd like the
// resulting curve to correspond to one "side" of the snowflake.
curveIFS = {
let f0 = scale(1 / 3, [-Math.sqrt(3) / 2, 1 / 2]);
let f1 = shift([1 / Math.sqrt(3), 0])
.compose(scale(1 / 3, [-Math.sqrt(3) / 2, 1 / 2]))
.compose(rotate(Math.PI / 3, [-Math.sqrt(3) / 2, 1 / 2]));
let f2 = shift([Math.sqrt(3) / 2, 1 / 2])
.compose(scale(1 / 3, [-Math.sqrt(3) / 2, 1 / 2]))
.compose(rotate(-Math.PI / 3, [-Math.sqrt(3) / 2, 1 / 2]));
let f3 = scale(1 / 3, [Math.sqrt(3) / 2, 1 / 2]);
return new IteratedFunctionSystem([f0, f1, f2, f3]);
}
Insert cell
Insert cell
koch_flake = function(n) {
let [f0, f1, f2, f3] = curveIFS.affine_function_list.map((af) => af.f);
let step = (pts) =>
pts
.map(f0)
.slice(0, -1)
.concat(pts.map(f1).slice(0, -1))
.concat(pts.map(f2).slice(0, -1))
.concat(pts.map(f3));

let pts = [
[-Math.sqrt(3) / 2, 1 / 2],
[Math.sqrt(3) / 2, 1 / 2]
];
d3.range(n).map(() => (pts = step(pts)));

let pts2 = pts.map(
rotate((-2 * Math.PI) / 3, [Math.sqrt(3) / 2, 1 / 2]).compose(
shift([Math.sqrt(3), 0])
).f
);
let pts3 = pts.map(
rotate((2 * Math.PI) / 3, [0, -1]).compose(
shift([Math.sqrt(3) / 2, -3 / 2])
).f
);

return pts.slice(0, -1).concat(pts2).concat(pts3);
}
Insert cell
Insert cell
import {
shift,
scale,
rotate,
reflect,
degree
} from "@mcmcclur/affinefunction-class"
Insert cell
import { IteratedFunctionSystem } from "@mcmcclur/iteratedfunctionsystem-class"
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