//stone陨石,从左至右,从右至左
var Stone=function(){
this.x=0;
this.y=0;
this.vx=0;
this.vy=0;
//this.rotation=0;
//this.bounce=0;
}
Stone.prototype.drawStone=function(ctx){
ctx.save();
ctx.fillStyle="darkgray";
ctx.beginPath();
ctx.arc(this.x,this.y,10,0,Math.PI*2,false);
ctx.fill();
ctx.restore();
}
//陨石测试
//var stone=new Stone();
//stone.x=60;
//stone.y=70;
//stone.drawStone(ctxGame);
var stones=[];
var stoneNum=10;//Math.floor(Math.random()*20+20);
for(var stone,i = 0 ; i < stoneNum ; i++){
stone=new Stone();
stone.x=Math.random()*(canvasGame.width-10)+5;
stone.y=Math.random()*(canvasGame.height-10)+5;
stone.vx=Math.random()*2-1;
stone.vy=Math.random()*2-1;
//stone.rotation=Math.atan2(vx,vy);
stones.push(stone);
}
//检查边界
var stoneCheck=function(stone){
var leftBorder=0,
rightBorder=canvasGame.width,
topBorder=0,
bottomBorder=canvasGame.height;
//左右边界检测
if(stone.x-5 < leftBorder){
stone.x = canvasGame.width-5;
}else if(stone.x+5 > rightBorder){
stone.x = -5;
}
//上下边界检测
if(stone.y-5 > bottomBorder){
stone.y = -5;
}else if(stone.y+5 < topBorder){
stone.y = canvasGame.height+5;
}
}
//调用drawStone绘制stone
var stoneMove=function(stone){
stoneCheck(stone);//检查边界,重置位置,左出右进,上出下进
stone.x += stone.vx;
stone.y += stone.vy;
stone.drawStone(ctxGame);
}
(function showStone(){
window.requestAnimationFrame(showStone);
ctxGame.clearRect(0,0,canvasGame.width,canvasGame.height);
for(var i=0;i<stones.length;i++){
stoneMove(stones[i]);
}
}());
为什么出现这种错误??