4 <title>SVG and Koch's Fractal</title>
5 <script type="text/javascript" src="koch.js"></script>
8 <h1> Koch's Snowflake </h1>
9 <p> An example of using the DOM to make a fractal --- an interactive document.</p>
10 <p> <b>Warning:</b> If you iterate too many times you will likely crash your browser </p>
11 <p> In most browsers you may press Control+U to examine the HTML and SVG describing this document </p>
12 <p> You can also follow <a href="koch.js">this link</a> to view the Javascript in <code>koch.js</code> </p>
15 xmlns="http://www.w3.org/2000/svg"
22 style="stroke:#000000; fill:none; stroke-width:1px;"
23 d = "M 100,100 300,100 200,273.2051 100,100"
28 <tr> <td> Inwards <input type="radio" name="dir" id="dir_in"/> Outwards <input type="radio" name="dir" value="dir_out" checked="yes"/> </td> </tr>
29 <tr> <td> Insert <input type="radio" name="mode" id="mode_insert" checked="yes"/> Append <input type="radio" name="mode" id="mode_append"/> </td> </tr>
30 <tr> <td> <input type="text" value="1" id="iterations"/> <button onclick="iterateKoch();">Koch Iterate</button> </td> </tr>
31 <tr> <td> <input type="text" value="#000000" id="stroke"/> <button onclick="stroke();">Stroke Colour</button> </td> </tr>
32 <tr> <td> <input type="text" value="none" id="fill"> <button onclick="fill();">Fill Colour</button> </td> </tr>
33 <tr> <td> <input type="text" value="1" id="stroke-width"/> <button onclick="strokeWidth();">Stroke Thickness</button> </td> </tr>
34 <tr> <td><button onclick="reset();">Reset</button> <button onclick="svgToText();">Standalone SVG</button></td></tr>