js canvas实现QQ拨打电话特效

var paint, r;    //设置画笔和半径var width, height; //获得canvas的长度和宽度var count = 0;   //设置正铉曲线的便宜量var colors = ["#66ccff", "#ff0000"];/*程序入口*/function main() {  var canvas1 = document.getElementById("canvas1");  paint = canvas1.getContext("2d");  width = paint.canvas.width;  height = paint.canvas.height;  r = width / 2;  start();  setInterval(start, 200);}/*开始进行清除和绘制*/function start() {  paint.clearRect(0, 0, width, height);  drawXY();  drawSin();  paint.restore();}/*绘制一个坐标系*/function drawXY() {  paint.save();  paint.translate(r, r);  paint.beginPath();  paint.lineWidth = 1;  paint.moveTo(0, -r);  paint.lineTo(0, r);  paint.stroke();  paint.lineWidth = 1;  paint.moveTo(-r, 0);  paint.lineTo(r, 0);  paint.stroke();}/*正弦曲线可表示为y=Asin(ωx+φ)+k，定义为函数y=Asin(ωx+φ)+k在直角坐标系上的图象，*//*绘制sin正弦图像*/function drawSin() {  paint.save();  count++;//设置每一刻的偏移量  var i, j, rad, y;  for (j = 0; j < 2; j++) {    for (i = -1000; i < 1000; i++) {      paint.beginPath();      paint.strokeStyle = colors[j];      rad = i * Math.PI / 180;      y = -20 * Math.sin(rad - (count + j));      paint.arc(i, y, 0.3, 0, 2 * Math.PI, false);      paint.stroke();    }  }  paint.restore();}