What's a workaround for Chrome for Android's incorrect clientX and clientY behavior?

Simply use e.pageY - window.scrollY in place of e.clientY (or X, accordingly).

e.pageY will give you where the event happened, and offsetting by window.scrollY will "remove the blank space" that is off-screen due to scroll. You COULD conditional check that e.pageY - window.scrollY === e.clientY, but since the workaround gives you the correct value, and you have to calculate it to check it anyways, that would be counter-intuitive.

I would start by checking that

<meta name="viewport" content="width=device-width, initial-scale=1">

is used. This has fixed a LOT of positional problems in mobile browser applications, particularly with Android. Not sure if it would help your particular problem, but worth a shot.

You can subscribe for touchstart event on the canvas and use the .offset() and e.pageX to get the position within the canvas.

$('#my-canvas').on('touchstart', function (startEvent) {    var offset = $(this).offset();    $(this).on('touchmove', function (moveEvent) {        var pos = {            x: moveEvent.pageX - offset.left,            y: moveEvent.pageY - offset.top        }    });});