Compare commits
3 Commits
a85560c6a1
...
43c7eb4cd3
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
43c7eb4cd3 | ||
|
|
2fe2bacb60 | ||
|
|
80ec4be185 |
@ -21,7 +21,7 @@ def svgpoly(points):
|
|||||||
return f'<polygon points="{ps}" stroke="black" opacity="50%" fill="none" />'
|
return f'<polygon points="{ps}" stroke="black" opacity="50%" fill="none" />'
|
||||||
|
|
||||||
def svgline(p1, p2):
|
def svgline(p1, p2):
|
||||||
return f'<line x1="{p1[0]}" y1="{p1[1]}" x2="{p2[0]}" y2="{p2[1]}" stroke="black" opacity="20%"/>\n'
|
return f'<line x1="{p1[0]}" y1="{p1[1]}" x2="{p2[0]}" y2="{p2[1]}" stroke="black" stroke-width="4" opacity="20%"/>\n'
|
||||||
|
|
||||||
def svglines(points):
|
def svglines(points):
|
||||||
lines = ""
|
lines = ""
|
||||||
@ -32,16 +32,20 @@ def svglines(points):
|
|||||||
lines += svgline(points[-1], points[0])
|
lines += svgline(points[-1], points[0])
|
||||||
return lines
|
return lines
|
||||||
|
|
||||||
print('<svg width="800" height="1200" xmlns="http://www.w3.org/2000/svg">')
|
print('<svg width="400" height="400" xmlns="http://www.w3.org/2000/svg">')
|
||||||
|
|
||||||
n = 2
|
# n = 2
|
||||||
for j in range(11):
|
# for j in range(11):
|
||||||
for i in range(7):
|
# for i in range(7):
|
||||||
cx = 50 + i * 100
|
# cx = 50 + i * 100
|
||||||
cy = 50 + j * 100
|
# cy = 50 + j * 100
|
||||||
r = 40
|
# r = 40
|
||||||
print(svglines(fibopoly(cx, cy, r, n)))
|
# print(svglines(fibopoly(cx, cy, r, n)))
|
||||||
n += 1
|
# n += 1
|
||||||
|
|
||||||
|
print(svglines(fibopoly(200, 200, 160, 50)))
|
||||||
|
|
||||||
print('</svg>')
|
print('</svg>')
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
2
dist/03/index.html
vendored
2
dist/03/index.html
vendored
@ -17,7 +17,7 @@ ever made, in the early 90s on a PC. If you calculate the Fibonacci sequence mod
|
|||||||
you draw them as a set of lines where the integers 0 to <i>n</i> - 1 are evenly spaced
|
you draw them as a set of lines where the integers 0 to <i>n</i> - 1 are evenly spaced
|
||||||
around a circle, you get these patterns which are a lovely balance of symmetry and chaos.</p>
|
around a circle, you get these patterns which are a lovely balance of symmetry and chaos.</p>
|
||||||
|
|
||||||
<p><a href="../">Back</p>
|
<p><a href="../">Back</a></p>
|
||||||
|
|
||||||
|
|
||||||
<svg width="800" height="1200" xmlns="http://www.w3.org/2000/svg">
|
<svg width="800" height="1200" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
|||||||
454
dist/04/assets/index-fade9311.js
vendored
Normal file
454
dist/04/assets/index-fade9311.js
vendored
Normal file
File diff suppressed because one or more lines are too long
3555
dist/04/assets/threejs-881f862e.js
vendored
Normal file
3555
dist/04/assets/threejs-881f862e.js
vendored
Normal file
File diff suppressed because one or more lines are too long
66
dist/04/index.html
vendored
Normal file
66
dist/04/index.html
vendored
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>FourD</title>
|
||||||
|
<style>
|
||||||
|
body { margin: 0; }
|
||||||
|
div#description {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 20%;
|
||||||
|
z-index: 2;
|
||||||
|
font-family: sans-serif;
|
||||||
|
padding: 1em;
|
||||||
|
}
|
||||||
|
div#container {
|
||||||
|
position: fixed;
|
||||||
|
top: 20px;
|
||||||
|
left: 20px;
|
||||||
|
}
|
||||||
|
canvas {
|
||||||
|
width: 512px;
|
||||||
|
height: 512px;
|
||||||
|
image-rendering: crisp-edges; /* for firefox */
|
||||||
|
image-rendering: pixelated;
|
||||||
|
}
|
||||||
|
div#giflink {
|
||||||
|
position.fixed;
|
||||||
|
top: 600px;
|
||||||
|
left: 300px;
|
||||||
|
}
|
||||||
|
div#release_notes {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 20%;
|
||||||
|
z-index: 2;
|
||||||
|
padding: 1em;
|
||||||
|
font-family: sans-serif;
|
||||||
|
}
|
||||||
|
div#info {
|
||||||
|
position: fixed;
|
||||||
|
bottom:0;
|
||||||
|
right: 0;
|
||||||
|
z-index: 2;
|
||||||
|
border:0.5em;
|
||||||
|
font-family: sans-serif }
|
||||||
|
</style>
|
||||||
|
<script type="module" crossorigin src="/genuary26/04/assets/index-fade9311.js"></script>
|
||||||
|
<link rel="modulepreload" crossorigin href="/genuary26/04/assets/threejs-881f862e.js">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div id="container">
|
||||||
|
<canvas id="canvas" style="width: 512px; height: 512px"></canvas>
|
||||||
|
</div>
|
||||||
|
<div id="giflink"></div>
|
||||||
|
<div id="description"></div>
|
||||||
|
<div id="release_notes"></div>
|
||||||
|
<div id="info">this is a bitcrushed version of <a href="">FourJS</a> which I hacked up for <a href="https://genuary.art">Genuary 2026</a>
|
||||||
|
|
||||||
|
| <a target="_blank" href="https://etc.mikelynch.org/genuary26/">Back</a> |
|
||||||
|
<a target="_blank" href="https://git.tilde.town/bombinans/fourdjs/src/branch/feature-pixels/">source</a></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
2
dist/index.html
vendored
2
dist/index.html
vendored
@ -15,6 +15,8 @@ on the Fedivers at <a href="https://old.mermaid.town/@fsvo">@fsvo@old.mermaid.to
|
|||||||
<ul>
|
<ul>
|
||||||
<li><a href="01/">1: one colour, one shape</a></li>
|
<li><a href="01/">1: one colour, one shape</a></li>
|
||||||
<li><a href="02/">2: twelve principles of animation</a></li>
|
<li><a href="02/">2: twelve principles of animation</a></li>
|
||||||
|
<li><a href="03/">3: Fibonacci forever</a></li>
|
||||||
|
<li><a href="04/">4: Low res</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user