<canvas id="drawing" width="600" height="600">Canvas not supported.</canvas>
  <input type="button" onclick="start()" value="Пуск">
    <input type="button" onclick="stop()" value="Стоп">
#drawing { 
  border: 1px solid #000;
  background: RosyBrown;  
  display: block;
  margin: 0 auto;
}

var obj = document.getElementById('drawing'); // Получить объект холста

if (obj.getContext){ // Проверить поддерживает ли браузер возможность рисования на холсте
  var ctx = obj.getContext('2d');
  // тут рисуем .....
   let x=-1.6;
   let timer;
     ctx.translate(300,300);
  let c=0;
let Idint;
  function drawsin()
  {
    y=-((Math.sqrt(Math.cos(x))*Math.cos(300*x)+Math.sqrt(Math.abs(x))-0.7)*Math.pow((4-x*x),0.01));
    x+=0.002;
   
    ctx.fillRect(40*x,40*y,1,1);
 //   console.log(y,x);
    if (x>1.6)
      {
        ctx.rotate(getRandomAngle());
        ctx.translate(getRandomTranslate(),getRandomTranslate())
        x=-1.61;
      }
  }
  
  function getRandomAngle()
  {
    let r=Math.random()*10;
    return r;
  }
    function getRandomTranslate()
  {
    let r=Math.floor(Math.random()*200);
    return r;
  }
  
function start() {
  Idint = setInterval(drawsin, 1);
}
 
function stop() {
  clearInterval(Idint);
}
  
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.