Jump to content

Jump'n'run with phaser and tiled


Recommended Posts

Hi guys,


some days ago, I started with my first game ever and I decided to use js, phaser and tiled. The goal of this project is a jump'n'run game with different levels. There's a timer counting backwards, when the time reaches 0 it's over. But there are collectables which give you more time.

During the last few days I learned a lot about tiles, sprites, canvas etc. and now I have finally setup a working phaser project with tilemap, timer, player and different states.


The source is on github and a demo is available here.


I have three problems with my game:

1. When the player stands on the cupboard, he's shaking. I have no idea why.

2. In firefox I get the following error: TypeError: PIXI.BaseTextureCache[a].destroy is not a function.

3. In chrome on mac I get constant 60fps, on windows about 30 and on mobile devices about 5.


How can I fix these errors? Do you have any hints for me?


And if you have some general advices for me that'd be awesome as I have no experience in online game development.



Link to comment
Share on other sites

I don't know about your other problems, but as for your "shaking on the cupboard" problem try adding a little drag to your sprite like this, assuming you're using Arcade physics: "sprite.body.drag.setTo(5, 5);" Sometimes impulse-based physics engines have some indeterminacy around separations on collision which results in that jitter you're seeing. At least, that's my first guess. ( =

Link to comment
Share on other sites

For of all, you should be really cautious with the size of the canvas. On my Chrome I have a scroll bar because the world's height is too big : it is annoying and it consumes performance. So first if you tune this well you might gain FPS.


For the jittering, it might be caused by non-rounded pixel values. This sometimes causes unexpected jittering.

Link to comment
Share on other sites

Thanks for your feedback. I disabled upscaling of the game and I got some fps more. Fun thing, in chrome on windows I get 72 fps, in IE11 42 fps...


For the jittering, it really is some sort of rounding issue, when I change the game height to the height of the map, the jittering is gone. But I don't want to set the game height to the height of the map, I'd like the have that camera moving effect and not reveal the whole map. Currently the map's height is 640 and I'd like the game height to be around 480. With game height 480 it's jittering. Could I set a better game height (I tried different heights randomly but without success)? Or how can I use the sprite.body.drag thing? Set it for the player or the cupboard?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...