大鱼在屏幕上乱转
是什么原因?代码如下
var babyObj = function()
{
this.x;
this.y;
this.angle;
this.babyBody = new Image();
this.babyTailTimer = 0;//记录小鱼尾巴的时针
this.babyTailCount = 0;//记录执行到哪一桢
this.babyEyeTimer = 0;
this.babyEyeCount = 0;
this.babyEyeInterval = 1000;//时间间隔 这张图片要持续多长时间
}
babyObj.prototype.init = function()
{
this.x = canWidth * 0.5 - 50;//初始化在屏幕中央
this.y = canHeight * 0.5 +50;
this.angle = 0;
this.babyBody.src = "src/babyFade0.png";
}
babyObj.prototype.draw = function()
{
//lerp x,y
this.x = lerpDistance(mom.x,this.x,0.98);
this.y = lerpDistance(mom.y,this.y,0.98);
//lerp angle
var deltaY = mom.y - this.y;
var deltaX = mom.x - this.x;
var beta = Math.atan2(deltaY,deltaX) + Math.PI;
//让小鱼的坐标趋向于鼠标角度
this.angle = lerpAngle(beta,this.angle,0.5);
//baby的帧数计数
this.babyTailTimer += deltaTime;
if(this.babyTailTimer > 50)
{
this.babyTailCount = (this.babyTailCount + 1) % 8;
this.babyTailTimer %= 50;
}
//baby eye
this.babyEyeTimer += deltaTime;
if(this.babyEyeTimer > this.babyEyeInterval)//如果计时器超过了时间间隔
{
this.babyEyeCount = (this.babyEyeCount + 1) % 2;//自身加1 但不能超过2 所以对2取模 这样会在0到1之间循环
this.babyEyeTimer %= this.babyEyeInterval;//计时器对当前的时间间隔取模 这样可以清空计时器
if(this.babyEyeCount == 0)//判断小鱼眼睛在哪一桢是睁眼还是闭眼那一帧
{//小鱼在闭眼的一帧情况下保留的时间
this.babyEyeInterval = Math.random() * 1500 +2000;//重新获取一个随机事件(2000到3500之间的随机值)
}
else
{//小鱼睁眼的时间为200毫秒
this.babyEyeInterval = 200;
}
}
//ctx1
ctx1.save();
//translateaby
ctx1.translate(this.x,this.y);
ctx1.rotate(this.angle);
var babyTailCount = this.babyTailCount;//定义一个临时变量 存储这一桢要用的尾巴图
ctx1.drawImage(babyTail[babyTailCount],-babyTail[babyTailCount].width * 0.5 + 23,-babyTail[babyTailCount].height * 0.5);//使用这一桢的数组中的尾巴图取代babyTailEye变的图
ctx1.drawImage(this.babyBody,-this.babyBody.width * 0.5,-this.babyBody.height * 0.5);
var babyEyeCount = this.babyEyeCount;//定义一个临时变量 存储这一桢要用的
ctx1.drawImage(babyEye[babyEyeCount],-babyEye[babyEyeCount].width * 0.5,-babyEye[babyEyeCount].height * 0.5);
ctx1.restore();
}