https://jsfiddle.net/607t26dn/16/
var s = Snap("500px", "500px"); s.appendTo(document.body); s.attr({ viewBox: "0 0 100 100", style: "display: block;" }); var header = s.rect(0, 0, 100, 100); header.attr({ fill: "white", stroke: "green" }); var verticalLine = s.line(50, 10, 50, 90).attr({id: "vertical", stroke: "black", strokeWidth: "1px"}); var horizontalLine = s.line(10, 50, 90, 50).attr({id: "horizontal", stroke: "black", strokeWidth: "1px"}); var circle = s.circle(50, 50, 10).attr({stroke: "red", fill: "none"}); var group = s.group(verticalLine); group.circle(50,50,1).attr({stroke: "none", fill: "green"}); function animLoop(render, element) { var then = Date.now(); function loop(now) { var interval = now - then; if (160 <= interval || render(interval) !== false) requestAnimationFrame(loop, element); then = now; } loop(then); } var deg = 0; function step(interval) { deg += (0.03) * interval; group.transform('r'+deg+',50,50'); }; animLoop(step, s);
109100cookie-checkSnap SVG requestAnimationFrame