利用js写的见缝插针小游戏（推荐给新手)

   标题之所以写推荐给新手，是因为我也是个刚学js一周的新人，想练练手，于是就花了一下午写了这个游戏，所以我写的可能更适合新手，大神勿喷。

   这个游戏是利用原生的js以及html5的canvas技术做的一个小游戏，游戏规则跟手机上的见缝插针一样的，这是我的游戏界面：

这个是无限插针的，就是针有无限多，直到你失败了或是点击reset按钮停止.

以下把我的源码贴出来供大家参考：

js代码：

var ctx;//工具
var canvas;//画布
var canalpha=0;
var cirradius=100;
var smciradius=15;
var ani=false;//动画是否在进行中
var speed=30;//针的速度
var ins=false;//是否可以触发insert动画
var n=0;//针的步长
var num=1;//针的编号
var angel=[];//各针停留时的角度数组
angel[0]=0;//初始化为1根针时设定，可改变
var speed2=200;//旋转速度
var over=false;//游戏结束标志
var INTERID;//周期函数ID

function drawmap() {
    ctx.fillStyle = "rgba(50%,25%,25%,0.5)";
    ctx.translate(250, 250);
    ctx.rotate(canalpha);
    ctx.translate(-250, -250);
    ctx.beginPath();
    ctx.arc(250, 250, cirradius, 0, Math.PI * 2, true);
    ctx.moveTo(250, 350);
    ctx.lineTo(250, 450);
    ctx.closePath();
    ctx.fill();
    ctx.stroke();
    ctx.fillStyle = "rgba(0,0,0,0.5)";
    ctx.beginPath();
    ctx.arc(250, 465, smciradius, 0, Math.PI * 2, true);
    ctx.closePath();