HTML5キャンバスclearRectがbeginPathとclosePathで動作しない

Question

キャンバスに描画するのにHTML5を使用しています。私はxとy座標を描画の各サイクルを変更するためにループスルーする点の配列を持っています。私が今持っているのは、ドットの移動ですが、古いものをクリアしないので、ドットの代わりにラインが移動します。私はclearRectでbeginPathを使う必要があると言った他の答えを調べましたが、うまくいきません。 clearRectの配置に何か問題がありますか？誰かがこのキャンバスのもので私を助けることができますか？

draw: function() { 
     var ctx = this.context; 
     if(this.isReady){ 
      var PI2 = Math.PI * 2; 
      for (var i = 0; i < this.points.length; i++) { 
       var point = this.points[i]; 
        var ic = this.calculateGravity(point.x, point.y); 
       ctx.clearRect(0, 0, this.cw, this.ch); 
       ctx.beginPath(); 
       ctx.arc(point.x - ic.nX, point.y - ic.nY, point.radius, 0, PI2); 
       ctx.fillStyle= point.color; 
       ctx.strokeStyle= point.color; 
       ctx.closePath(); 
       ctx.fill(); 
       ctx.stroke(); 
       this.points[i].x = point.x - ic.nX; 
       this.points[i].y = point.y - ic.nY; 
      } 
     } 
    }, 

Answer 1

あなたは自分のポイントをレンダリングする前に、あなたのキャンバスをクリアする必要があります。

if(this.isReady){ 
    ctx.clearRect(0, 0, this.cw, this.ch); 
    var PI2 = Math.PI * 2; 
    for (var i = 0; i < this.points.length; i++) { 
    /* ... */ 
} 

を