TransformControls have a pointer offset

I’m using Transform Controls and my canvas is inside a grid element.

the original getPointer function returns


return {
	x: ( event.clientX - rect.left ) / rect.width * 2 - 1,
	y: - ( event.clientY - rect.top ) / rect.height * 2 + 1,
	button: event.button
};

also I’ve tried

return ( {
	x: ((event.clientX - rect.left) / (_domElement.clientWidth)) * 2 - 1,
	y: - ((event.clientY - rect.top) / (_domElement.clientHeight)) * 2 + 1,
	button: event.button
});

and

x: ((event.clientX - rect.left) / (rect.right - rect.left)) * 2 - 1,
y: - ((event.clientY - rect.top) / (rect.bottom - rect.top)) * 2 + 1;

without a chance.

When trying to move my object the transform square when hover changes color with an offset.
It gets worst when the object is far away from 0 position

any idea, please let me know if you need more infos.

Best

Do you mind demonstrating the issue? Offsetting the canvas seems to work for me: three.js dev template - module - JSFiddle - Code Playground

I’ll try make a video to show you the issue. Thank you for your reply

Hi! I’m having the same issue. Did you ever manage to resolve this?

@wenxich Nope, not for the moment.