Just playing around with using SVG for web animation versus Canvas.
I see some interesting things built using Green Sock that I think I can reproduce myself.
Maybe I will add SVG support as an out-of-the-box feature in Wes Mantooth.
<script> const CENTER = 100, RADIUS = 50; window.onload = function(){ var $t = document.getElementById('target'), d = 0; var id = setInterval(function(){ let points = '', now = {}; d++; if (d>360) d -= 360; now = vertex(d,45); points = now.x+','+now.y+' '; now = vertex(d,135); points += now.x+','+now.y+' '; now = vertex(d,225); points += now.x+','+now.y+' '; now = vertex(d,315); points += now.x+','+now.y; $t.setAttribute('points',points); },10); }; function vertex(d,s) { d+=s; if (d > 360) d-=360; d = d * Math.PI / 180 let x = CENTER + Math.sin(d) * RADIUS; let y = CENTER + Math.cos(d) * RADIUS; return { x:x, y:y } } </script> <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"> <polygon id="target" points="" style="fill:red;stroke:black;stroke-width:1" /> </svg>
Category