html - 在画布上绘制螺旋圈

Question

我想在canvas我使用下面的代码中绘制这种螺旋图案需要你的帮助以进一步绘制圆圈。

 // get the canvas element using the DOM
 var canvas = document.getElementById('circlecanvas');
 // Make sure we don't execute when canvas isn't supported
 if (canvas.getContext){
    // use getContext to use the canvas for drawing
    var ctx = canvas.getContext('2d');
    // Draw shapes
    ctx.beginPath();
    //context.arc(x, y, radius, startAngle, endAngle, counterClockwise);
    for (i=0;i<9;i++){
        ctx.arc(50, 50, 50, i, Math.PI * 2, false);
        ctx.fill();
    }
}  

Answer 1

我认为你需要的是一个螺旋......我正在发布伪代码以在下面绘制一个阿基米德螺旋：-NB-角度是一个变量..您可以相应地调整......

for (i=0; i< 720; i++) {
  angle = 0.1 * i;
  x=(1+angle)*Math.cos(angle);
  y=(1+angle)*Math.sin(angle);
  drawlineTo(x, y);
}