Newer
Older
fractals / src / index.ts
import { createSquare, inwardSpiralFractal, fractalToSvg } from "./FractalSVG";
import { Polygon, Point } from "./Polygon";

function createTriangle(sideLength:number): Polygon
{
    return new Polygon(
        new Point(sideLength/2, 0),
        new Point(0,sideLength),
        new Point(sideLength, sideLength),
    );
}

function pageInit(): void
{
    const sideLength = 400;
    const iterations = 50;
    const shrinkRate = 0.1;
    const randomizeShrinkRate = 0.3;

    const startShape = createSquare(sideLength);

    const fractal = inwardSpiralFractal(startShape, iterations, shrinkRate, 0);
    const divSpiral = document.getElementById("spiral") as HTMLDivElement;
    divSpiral.appendChild(fractalToSvg(fractal, sideLength));

    const randomizedFractal = inwardSpiralFractal(startShape, iterations, shrinkRate, randomizeShrinkRate);
    const divRandomizedSpiral = document.getElementById("randomizedSpiral") as HTMLDivElement;
    divRandomizedSpiral.appendChild(fractalToSvg(randomizedFractal, sideLength));

    const triangle = createTriangle(sideLength);
    const triangleFractal = inwardSpiralFractal(triangle, iterations, 1-0.06, 0);
    const divTriangle = document.getElementById("triangle") as HTMLDivElement;
    divTriangle.appendChild(fractalToSvg(triangleFractal, sideLength));
}

document.addEventListener("DOMContentLoaded", pageInit);