javascript - Canvas context drawing frame rate too fast -
i trying display scrolling home screen asteroids game keeps redrawing background until user presses 'enter', after which, execute methods necessary start game.
the frame rate normal on home screen, when press enter, game renders, moves fast animation lags , game unplayable.
i feel must have 'speed' variable being out of control, have tried resetting it.
if remove first call of requestanimationframe
, home screen not scroll, (obviously, because 'speed' never increases, background static), game play @ it's normal frame rate. have tried calling this.game.draw(this.ctx, speed)
speed
0, no avail.
note dim_y
, dim_x
constants defined out of scope.
gameview.prototype.animate = function(time) { speed += 1; if (speed >= 605) { speed = 0; }; if (this.onhomescreen) { console.log("asf") let = this; img.onload = function () { that.ctx.drawimage(img, 0, 0) }; img.src = 'space_background.png'; let y = 0; let x = 0; y += speed; this.ctx.drawimage(img, x,y); this.ctx.drawimage(img, x, y - dim_y); if (y >= dim_y) { y = 0; }; this.ctx.fillstyle = "white"; this.ctx.font = "italic "+24+"pt arial"; this.ctx.filltext('asteroids', 100, 200); requestanimationframe(this.animate.bind(this)); key('enter', ()=> { this.onhomescreen = false; this.start(); }); } else { // 'enter' has been pressed, game begins. this.game.step(); this.game.draw(this.ctx, speed); if(!this.game.lose() && !this.game.win()){ requestanimationframe(this.animate.bind(this)); } else { this.ctx.fillstyle = "white"; this.ctx.font = "italic "+24+"pt arial "; = this; if(this.game.win()){ that.ctx.filltext(`you win! \n press enter restart`, 100, 200); } else { console.log(speed) that.ctx.filltext(`game on \n press enter restart`, 100, 200); } key('enter', ()=>{ this.game = new game(); this.start(); }); } } };
Comments
Post a Comment