59 lines
1.4 KiB
HTML
59 lines
1.4 KiB
HTML
<html>
|
|
<head> </head>
|
|
<body>
|
|
<canvas id="mainCanvas" width="800" height="800"></canvas>
|
|
<script type="module">
|
|
import {
|
|
artworld,
|
|
Color,
|
|
Group,
|
|
Line,
|
|
Random,
|
|
Vector2,
|
|
degToRad,
|
|
} from "../artworld/index.js";
|
|
artworld.bindCanvas("mainCanvas");
|
|
window.artworld = artworld;
|
|
|
|
function* spirals() {
|
|
while (true) {
|
|
let g = new Group();
|
|
for (let d = 0; d < 180; d += 10) {
|
|
if (Random.chance(0.9)) {
|
|
new Line(g).to(Vector2.polar(190 - d, degToRad(d)));
|
|
}
|
|
}
|
|
yield g;
|
|
}
|
|
}
|
|
|
|
function makeGrid(iterable, rows, cols, opts) {
|
|
opts = opts || {};
|
|
let width = opts.width || 50;
|
|
let height = opts.height || 50;
|
|
let xOff = opts.xOff || 0;
|
|
let yOff = opts.yOff || 0;
|
|
for (let c = 0; c < cols; c++) {
|
|
for (let r = 0; r < rows; r++) {
|
|
let result = iterable.next().value;
|
|
if (result === undefined) {
|
|
return;
|
|
} else {
|
|
result.pos(new Vector2(width * c + xOff, height * r + yOff));
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
makeGrid(spirals(), 4, 3, {
|
|
width: 220,
|
|
height: 120,
|
|
xOff: 80,
|
|
yOff: 10,
|
|
});
|
|
|
|
artworld.draw();
|
|
</script>
|
|
</body>
|
|
</html>
|