wayfinder

I used Leshy Sprite Tool to generate a working atlas. TexturePacker will also work.

I wouldn't mind a few words on the whole process, so if your time allows for both...

Some WebGL features are only available to power-of-2 sized textures.

if you need to use a graphics object, you can pass graphics.generateTexture() as the key for the sprite.

game.make instead of game.add—this creates an object without adding it to the display list.

That's not at all what I expected from the name

Are you talking about cutting off all pixels outside the world bounds while still drawing the portions of images that are inside the bounds? Or would it be enough to just not draw anything outside the world bounds, with the implication that portions of elements that are partially inside would disappear as well?

this.world.bounds.x = -Infinity; this.world.bounds.y = -Infinity; this.world.bounds.width = Infinity; this.world.bounds.height = Infinity; this.camera.bounds.x = -Infinity; this.camera.bounds.y = -Infinity; this.camera.bounds.width = Infinity; this.camera.bounds.height = Infinity;

Skeptron: that's a feature in Phaser.Debug, check the docs

the text-font! if you want to test with webgl, you can just take your canvas example and change the phaser game invocation to say Phaser.WEBGL instead of Phaser.CANVAS or Phaser.AUTO

In WebGL, I don't think renderTexture.source is even there... Also, for some reason the custom font doesn't work here (Win 7 Chrome)

The plugin seems to have trouble with renderTextures. It expects a baseTexture.source and they don't have those apparently.

I don't scale game.input. my setup is a bit more complicated than yours, i think—since i have per-object parallaxing, i keep a separate camera focus and camera pan position and assemble them each frame, calculating each object's position according to its parallax depth. it took me a big long while to puzzle out all the relationships between values so that everything worked, and i'm not gonna lie, for a while i thought i'd have to scrap the whole idea, but i guess I grew with the challenge and my perseverance paid off here are two very useful functions i am using, perhaps they will be useful to you as well: inGameCoords: function(browserCoordinates) { if (browserCoordinates) { var ret = new Phaser.Point(); ret.setTo((browserCoordinates.x + this.camera.x) * this.inverseCamScale, (browserCoordinates.y + this.camera.y) * this.inverseCamScale); return ret; } else return null; }, inBrowserCoords: function(gameCoordinates) { if (gameCoordinates) { var ret = new Phaser.Point(); ret.setTo(gameCoordinates.x * this.camera.scale.x - this.camera.x, gameCoordinates.y * this.camera.scale.y - this.camera.y); return ret; } else return null; } edit: these assume that your game uses the whole browser

in my code, i scale just the camera and not the world...

have you tried using pointer.worldX/worldY instead of x/y—this would probably be completely unscaled