canvas 绘画随机点

Posted 2020-10-26 米雪也是雪❤

直接看图吧；

这样的随机点，是小圆点组成的，然后一直在动，记录一下，万一以后要用到呢；

canvas的具体设置我就不写了，另一篇文档里有；

drawRandomDot () {
  let leftCanvas = this.leftCanvas.nativeElement;
  let leftContext = leftCanvas.getContext("2d");
  let rightCanvas = this.rightCanvas.nativeElement;
  let rightContext = rightCanvas.getContext("2d");
  if(this.dotTimeTicket == null){
    this.dotTimeTicket = setInterval(function(){
      leftContext.clearRect(0,0,280,80);
      for(var i = 0; i < 14; i++){
        for(let j = 0; j < 55; j++){
          let random = Math.ceil(Math.random() * 10);
          if(random > 5){
            leftContext.beginPath();
            leftContext.arc(( 5*(j+1)),( 5*(i+1) ),2,0,2*Math.PI);
            leftContext.fillStyle="rgba(0,192,255,0.65)";
            leftContext.fill();
            leftContext.closePath();
          }
        }
      }
      rightContext.clearRect(0,0,280,30);
      for(var i = 0; i < 6; i++){
        for(let j = 0; j < 55; j++){
          let random = Math.ceil(Math.random() * 10);
          if(random > 5){
            rightContext.beginPath();
            rightContext.arc(( 5*(j+1)),( 5*(i+1) ),2,0,2*Math.PI);
            rightContext.fillStyle="rgba(0,192,255,0.65)";
            rightContext.fill();
            rightContext.closePath();
          }
        }
      }
    },300);
  }
}