标签:style blog io ar color sp div on art
<canvas id="myCanvas" width="1000" height="500" style="border:1px solid #666"></canvas>
var canvas = document.getElementById("myCanvas"), ctx = canvas.getContext("2d"), width = canvas.width, height = canvas.height function drawArc(s, e) { var x = width / 2, // center x y = height / 2, // center y radius = 100, counterClockwise = false; ctx.fillStyle = ‘#0e6000‘; ctx.beginPath(); ctx.moveTo(x, y); ctx.arc(x, y, radius, s, e, counterClockwise); ctx.fill(); } var step = 1, //相当于是1弧度 = 180°/π; startAngle = 0, endAngle = 0; var animation_interval = 1000, n = 10; // count of arc 把圆拆分为多少块来做动画~ var animation = function() { if (step <= n) { endAngle = step * 2 * Math.PI / n; console.log("endAngle",endAngle) drawArc(startAngle, endAngle); console.log("n",n) console.log("step",step) step++; } else { clearInterval(animation); } }; setInterval(animation, animation_interval);
标签:style blog io ar color sp div on art
原文地址:http://www.cnblogs.com/tingting4133/p/4106458.html