Implement everything in terms of an incremental render

This commit is contained in:
2023-07-20 23:55:26 +00:00
parent 7f44243cd0
commit 04d5099338
15 changed files with 521 additions and 596 deletions

View File

@ -11,6 +11,8 @@ type Transform = (x: number, y: number) => [number, number];
export class RendererGasket extends Renderer {
private values = new Uint8Array(this.size * this.size);
private x = randomBiUnit();
private y = randomBiUnit();
/**
* Translate values in the flame coordinate system to pixel coordinates
@ -53,16 +55,17 @@ export class RendererGasket extends Renderer {
(x, y) => [x / 2, (y + 1) / 2],
];
let x = randomBiUnit();
let y = randomBiUnit();
// NOTE: `x` and `y` are set as fields on this class
// (rather than here in the main chaos game method) because
// we render in chunks (to avoid bogging down the browser)
const iterations = quality * this.size * this.size;
for (var i = 0; i < iterations; i++) {
const transformIndex = randomInteger(0, transforms.length);
[x, y] = transforms[transformIndex](x, y);
[this.x, this.y] = transforms[transformIndex](this.x, this.y);
if (i >= 20) {
this.plot(x, y);
this.plot(this.x, this.y);
}
}
}
@ -85,3 +88,7 @@ export class RendererGasket extends Renderer {
}
}
}
export function buildGasket(size: number) {
return new RendererGasket(size);
}