为什么我的果实上浮时是一条直线

如图，果实果实上浮时是一条直线，而且上浮时离开页面直线就消失了，回到页面又出现，

代码：fruit.js

// JavaScript Document

var fruitObj = function() {

this.alive = [];      //bool

this.x = [];

this.y = [];

this.l = [];            //果实的半径(大小)

this.spd = [];          //每个果实自己的速度 

this.orange = new Image();

this.blue = new Image();

};

fruitObj.prototype.num = 30;

fruitObj.prototype.init = function(){

for(var i = 0;i<this.num;i++){

this.alive[i] = true;

this.x[i] = 0;

this.y[i] = 0;

this.l[i] = 0;

this.born(i);

}

this.orange.src = "./src/fruit.png";

this.blue.src = "./src/blue.png"

}

fruitObj.prototype.draw = function(){

for(var i = 0;i<this.num;i++){

if(this.l[i]<=14){

this.l[i] += 0.01 *deltaTime;

}

else{

this.y[i] -= 0.07 *deltaTime;

}

ctx2.drawImage(this.orange, this.x[i]-this.l[i] / 2, this.y[i]-this.l[i] / 2, this.l[i], this.l[i]);

}

}

fruitObj.prototype.born = function(i){

var aneID = Math.floor(Math.random()*ane.num);

this.x[i] = ane.x[aneID];

this.y[i] = canHeight - ane.len[aneID];

this.l[i] = 0;

}

main.js

// JavaScript Document

var can1,can2,ctx1,ctx2;

var lastTime;

var deltaTime;

var bgPic = new Image();

var canWidth,canHeight;

var ane;

var fruit;

document.body.onload = game;

function game(){

init();

lastTime=Date.now();

deltaTime = 0;

gameloop();

}

function init(){

//获取canvas context 

    can1=document.getElementById("canvas1");//fishes,dust,ui  circle

    ctx1=can1.getContext('2d');  

    can2=document.getElementById("canvas2");  //background,ane,fruits

    ctx2=can2.getContext('2d');

bgPic.src = "./src/background.jpg";

canWidth = can1.width;

canHeight = can1.height;

ane = new aneObj();

ane.init();

fruit = new fruitObj();

fruit.init();

}

function gameloop(){

window.requestAnimFrame(gameloop);

var now = Date.now();

deltaTime = now - lastTime;

lastTime = now;

drawBackground();

ane.draw();

fruit.draw();

}

求解，万分感谢