- Options
Board
This "Board" is an L-System Fractal. As such it's not very remarkable or famous mathematically, but I think it still looks quite pretty. Just like the Quadratic Snowflake or the Crystal.
It is generated by the L-System Algorithm with the following settings:
const board: Ruleset = {
color: "#339ffc",
minIterations: 1,
maxIterations: 6,
axiom: "F+F+F+F",
replace: {
F: "FF+F+F+F+FF",
},
angle: 90,
initLength: (ctx) => Math.min(ctx.width, ctx.height) * 0.7,
initTranslation: (ctx, initialLength) => [
ctx.width / 2 - initialLength / 2,
ctx.height / 2 + initialLength / 2,
],
divideFactor: 3,
};
This fractal, by its nature as an L-System, is related to all the other L-System Fractals. A few you can check out: Sierpinski-Arrowhead, Hilbert Curve, and the Lévy Curve.
The alphabet to instructions set used to draw this fractal are the same as for the other L-Systems:
const drawRules: Record<string, () => void> = {
V: () => {},
W: () => {},
X: () => {},
Y: () => {},
Z: () => {},
G: drawForward,
F: drawForward,
f: () => ctx.translate(0, -len),
"+": () => ctx.rotate(angle * rotationDirection),
"-": () => ctx.rotate(angle * -rotationDirection),
"|": () => ctx.rotate(180),
"[": () => ctx.push(),
"]": () => ctx.pop(),
"#": () => (ctx.lineWidth = weight += weightIncrement) ,
"!": () => (ctx.lineWidth = weight -= weightIncrement) ,
">": () => (len *= scale),
"<": () => (len /= scale),
"&": () => (rotationDirection = -rotationDirection),
"(": () => (angle += angleIncrement),
")": () => (angle -= angleIncrement),
};