-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
191 lines (190 loc) · 8.95 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Martin's Math Page</title>
<link rel="stylesheet" href="css/index.css">
<link rel="stylesheet" href="index.css">
</head>
<body>
<main>
<article>
<header>
<h1>Welcome to Martin's Math Page</h1>
</header>
<p>
Let's be honest: no normal person really loves maths. However, when becoming a Software Engineer in the
nineties I was forced to learn a lot of Math. This even made me loose interest in the subject so I
switched
from the University to a University of Applied Sciences (HBO in Dutch).
</p>
<p>
However, now and then I see things 'out there' that I find fascinating that have their basis in
Mathematics.
In this repository I will add projects that I have created.
</p>
<p>I get some inspiration from the great guys at <a href="https://www.youtube.com/c/numberphile"
target="_blank">Numberphile!</a>.
The way they explain <a href="https://www.youtube.com/watch?v=snHKEpCv0Hk" target="_blank">geometry</a>
and how the <a href="https://www.youtube.com/watch?v=FFftmWSzgmk" target="_blank">Mandelbrot Fractal</a>
works inspired me to create a few projects
that are accessible through the web.
</p>
<p>The projects I created are listed below. Often they have some methods of interaction so you can play with
them yourself. This often helps to study its behaviour or just create nice images.</p>
</article>
<article class="visualisations">
<section>
<header>
<h1>Available visualisations</h1>
</header>
<p>The first section contains the famous Mandelbrot fractal and a variant thereof, the Burning Ship fractal.
The rotating circles enable you to learn how rotating movement can be transferred to lineair movement,
and makes
for some pretty animations using all the controls available. Then there's a few visualisations about
prime numbers and Fibonacci sequences.
</p>
</section>
<section class="items">
<div class="item">
<a href="mandelbrot"><img alt="mandelbrot" src="images/mandelbrot.png"></a>
<p>Mandelbrot Fractal</p>
</div>
<div class="item">
<a href="burningship/v01"><img alt="Burning Ship Fracta" src="images/burning-ship.png"></a>
<p>Burning Ship Fractal</p>
</div>
<div class="item">
<a href="circles"><img alt="circles" src="images/rotating-circles.png"></a>
<p>Rotating circles</p>
</div>
<div class="item">
<a href="lightswitchproblem"><img alt="lightswitchproblem" src="images/lightswitchproblem.png"></a>
<p>lightswitch problem</p>
</div>
<div class="item">
<a href="randomsierpinski"><img alt="sierpinski" src="images/sierpinski.png"></a>
<p>Sierpinksi (random game)</p>
</div>
<div class="item">
<a href="magicalknightstour"><img alt="magicalknightstour" src="images/knightsproblem.png"></a>
<p>Magical Knights tour</p>
</div>
<div class="item">
<a href="theodoresspiral"><img alt="theodoresspiral" src="images/theodore-spiral.png"></a>
<p>Theodore's Spiral</p>
</div>
<div class="item">
<a href="ulamspiral"><img alt="ulamspiral" src="images/ulam-spiral.png"></a>
<p>Ulam's Spiral</p>
</div>
<div class="item">
<a href="primespirals"><img alt="Archimedean Spiral" src="images/archimedian-spiral.png"></a>
<p>Archimedean Spiral</p>
</div>
<div class="item">
<a href="fibonacci"><img alt="fibonacci" src="images/fibonacci-spiral.png"></a>
<p>Fibonacci Sequence spiral</p>
</div>
<div class="item">
<a href="plasma"><img alt="plasma cloud" src="images/plasmacloud.png"></a>
<p>Plasma Cloud</p>
</div>
</section>
</article>
<article class="visualisations">
<section>
<header>
<h1>Linefractals & Curves</h1>
</header>
<p>In this sections you will mainly find fractals and curves based on problems that are visualised using
lines. The Barnsley fractal ('the leaf') however is built up using points, but gives the impression it
is
built using lines. The Gosper, Peano and Hilbert curves are so called "space filling curves": given
enough
iterations
they fill create a perfect filled plane, without any lines ever crossing each other.
<br>
Again, a lot of these visualisations can be changed using different controls in order to study them or
create stunning images.
<br>
Some scripts make use of the L-rewrite system (see <a href="https://en.wikipedia.org/wiki/L-system">Wikipedia</a>).
To experiment with an L-system yourself see my other <a href="https://www.molema.org/math-lsystem">site</a>.
</p>
</section>
<section class="items">
<div class="item">
<a href="linefractals/gosper"><img alt="line fractals" src="images/line-gosper.png"></a>
<p>Gosper space filling curve</p>
</div>
<div class="item">
<a href="linefractals/peano"><img alt="line fractals" src="images/line-peano.png"></a>
<p>Peano's space filling curve</p>
</div>
<div class="item">
<a href="linefractals/hilbert">
<img alt="line fractals - Hilbert" src="images/line-hilbert.png"></a>
<p>Hilbert's curve</p>
</div>
<div class="item">
<a href="linefractals/arrowhead">
<img alt="line fractals - arrowhead" src="images/line-arrowhead.png"></a>
<p>Sierpiński arrow head</p>
</div>
<div class="item">
<a href="linefractals/sierpinski-curve">
<img alt="line fractals - sierpinski curve" src="images/line-sierpinski-curve.png"></a>
<p>Sierpiński curve</p>
</div>
<div class="item">
<a href="linefractals/sierpinski-triangle">
<img alt="line fractals - sierpinski triangle" src="images/line-sierpinski-triangle.png"></a>
<p>Sierpiński triangles</p>
</div>
<div class="item">
<a href="linefractals/fractal-plant">
<img alt="line fractals - fractal plant" src="images/line-fractal-plant.png"></a>
<p>Fractal plant</p>
</div>
<div class="item">
<a href="linefractals/fractal-bush">
<img alt="line fractals - fractal bush" src="images/line-fractal-bush.png"></a>
<p>Fractal bush</p>
</div>
<div class="item">
<a href="linefractals/fibonacci-snowflake2">
<img alt="line fractals - fibonacci word" src="images/line-fib-word-binary.png"></a>
<p>Fibonacci Word curve</p>
</div>
<div class="item">
<a href="linefractals/canopy"><img alt="line fractals - tree" src="images/line-canopy.png"></a>
<p>Tree / Canopy curve</p>
</div>
<div class="item">
<a href="linefractals/barnsley-fern"><img alt="line fractals - barnsley" src="images/line-barnsley.png"></a>
<p>Barnsley Fractal</p>
</div>
<div class="item">
<a href="linefractals/snowflake"><img alt="line fractals" src="images/line-koch.png"></a>
<p>Koch's snowflake</p>
</div>
<div class="item">
<a href="linefractals/dragon"><img alt="line fractals - dragon" src="images/line-dragon.png"></a>
<p>Dragon curve</p>
</div>
<!--
<div class="item">
<a href="linefractals/"><img alt="line fractals" src="images/"></a>
<p></p>
</div>
-->
</section>
</article>
<article>
<p>The source code of all projects is available at <a
href="https://github.com/martinmolema/Mathematics">GitHub</a>.</p>
</article>
</main>
</article>
</body>
</html>