add svg example

vilterp · vilterp · commit a94e89ae453e · 2014-07-21T14:09:59.000-05:00
diff --git a/svg.html b/svg.html
@@ -0,0 +1,36 @@
+<html>
+	<head>
+		<title>My First SVG</title>
+		<script type="text/javascript">
+
+			var RADIANS_PER_STEP = Math.PI / 256;
+			var RADIUS = 200;
+			var MS_PER_STEP = 10;
+
+			var FILL_COLORS = ['red', 'blue', 'yellow', 'green', 'orange'];
+
+			function updateCircle(circle, step) {
+				var angle = (step * RADIANS_PER_STEP) % (2 * Math.PI);
+				var x = RADIUS * Math.cos(angle) + 400;
+				var y = RADIUS * Math.sin(angle) + 400;
+				// ...
+			}
+
+			document.addEventListener('DOMContentLoaded', function() {
+				var svg_canvas = document.getElementById('svg_canvas');
+				
+				// make circle clickable
+				var circle = document.getElementById('moving_circle');
+				// ...
+
+				// animate circle
+				// ...
+			});
+		</script>
+	</head>
+	<body>
+		<svg width="800" height="800" style="border: solid black 1px" id="svg_canvas">
+			<circle cx="400" cy="400" r="40" stroke="black" stroke-width="3" fill="red" id="moving_circle"/>
+		</svg>
+	</body>
+</html>
