Question

我已经尝试了很多在画布中绘制多个圆圈，但context.closePath()方法没有出现

我有这段代码：

<script>
  var canvas = document.getElementById('mainCanvas-2');
  var context = canvas.getContext('2d');
  for(var i=0;i<canvas.width;i++){    
      var centerX = i+Math.random()*canvas.width / 2;
      var centerY = i+Math.random()*canvas.height / 2;
      var radius = 20;
      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.shadowColor = 'white';
      context.shadowBlur = 45;
      context.shadowOffsetX = 0;
      context.shadowOffsetY = 0;
      context.fillStyle = 'rgba(255, 255, 255, 0.5)';
      context.fill();
      context.strokeStyle = none;
      context.stroke();
      context.// here closePath() method does not appear
  }
</script>

任何帮助，谢谢。

Answer 1

将context.strokeStyle = none更改为context.strokeStyle = 'none'解决问题，欢呼！

演示如下：

  var canvas = document.getElementById('mainCanvas-2');
  var context = canvas.getContext('2d');
  for(var i=0;i<canvas.width;i++){    
      var centerX = i+Math.random()*canvas.width / 2;
      var centerY = i+Math.random()*canvas.height / 2;
      var radius = 20;
      context.beginPath();
      context.arc(centerX, centerY, radius, 0, 2 * Math.PI, false);
      context.shadowColor = 'white';
      context.shadowBlur = 45;
      context.shadowOffsetX = 0;
      context.shadowOffsetY = 0;
      context.fillStyle = 'rgba(255, 255, 255, 0.5)';
      context.fill();
      context.strokeStyle = 'none';
      context.stroke();
      context.closePath();
  }

<canvas id = "mainCanvas-2"></canvas>

Javascript context.closePath（）方法不会出现

1 个答案: