How To Get Mouse Pointer Position in mobile Browsers?

Phaser 3
1

Hi, i am building a game that relies on looking at the mouse cursor position.

In the create function:

pointer = this.input.activePointer

then in the update function:

 const lockedToCamPointer = pointer.positionToCamera(this.cameras.main)

It works great on desktop, but for some reason in mobile browsers it only seems to register and update of the mouse position when I scroll the entire web page…

Possibly I need to use an entirely different way of listening for mouse movements on desktop vs mobile (something like the mouse-down listener on mobile but the regular mouse position on desktop?)

is there any recommended way to do this in phaser or should I just use regular javascript in this case?

thanks!

2

for the simplest form, you can use on create() method like:

this.input.on(‘pointermove’, (pointer: PointerEvent) => {
console.log(pointer.x, pointer.y)
});

there is more event like: ‘pointerup’, ‘pointerdown’, ‘pointerover’ etc
There is on phaser 3 doc for input

3 Likes
3

ReydVires answer is the proper way to do it in phaser. Make sure to mark it as the solution.

4

Thanks guys, but I don’t think this is the correct solution as it doesn’t register for me in mobile browsers until I scroll the page…

5

Maybe you can explain us more, what is ‘doesn’t register’ do you mean in the mobile browser?

6

I mean that the callback function for ‘pointermove’ is never called when I hold the pointer down and move it around (when simulating mobile browser in chrome, that is).

It only fires the callback when I scroll the page using my scroll wheel… :thinking: