Problems with sprite position while using a tiled map and camera.follow

[weedling]

I'm having an issue where my sprite position is not staying on top of my sprite. Please see this example i created to show the problem:

http://phaser.io/sandbox/edit/FqrdczCN - (The yellow dot is sprite position. red dot is worldTransform)

When the sprite is moved to the right and lower side of the map, the sprite position (yellow dot) moves away from the sprite. It seems to have something to do with the camera bounds. I've noticed if I full screen the game to be bigger than the size of the map, this problem does not happen. only when the camera is following the player AND the map goes off screen. Also I noticed that if i remove layer.resizeWorld() the problem disappears. 

This is interfering with my development because I need the sprites position to be accurate. Can someone tell me why this is happening?

[drhayes]

Your sprite position is accurate.

You're mixing up world coordinates and view coordinates. Debug methods use positions offset from the upper left of the canvas, while most positions (sprite, image, text, etc) use positions offset from the upper left of the world, which might not be in view.

Say you've walked to the right for a while, long enough to scroll. The camera is now at e.g. (50, 0) and your player sprite is now at (300, 50). When drawing to the canvas, the drawing code subtracts the current position of the camera from the current position of the sprite to transform world coordinates into view coordinates: thus, your player sprite is drawn at (250, 50) even though its world coordinates are (300, 50). Does that make sense?

[weedling]

4 minutes ago, drhayes said:

Your sprite position is accurate.

You're mixing up world coordinates and view coordinates. Debug methods use positions offset from the upper left of the canvas, while most positions (sprite, image, text, etc) use positions offset from the upper left of the world, which might not be in view.

Say you've walked to the right for a while, long enough to scroll. The camera is now at e.g. (50, 0) and your player sprite is now at (300, 50). When drawing to the canvas, the drawing code subtracts the current position of the camera from the current position of the sprite to transform world coordinates into view coordinates: thus, your player sprite is drawn at (250, 50) even though its world coordinates are (300, 50). Does that make sense?

Yes that clears it up for me. So in my player update code, when i need sprite coordinates on screen for my logic, I just need to do the conversion from world to screen. Feels obvious now... Thank you so much for your help.