raycaster.intersectObjects vs mouse client into scene

Having the following two pieces of code, I’d expect the raycaster point to be the same as mouse client point in scene, but for some reason it isn’t.

let vec = new THREE.Vector3();
let pos = new THREE.Vector3();
vec.set(( event.clientX / window.innerWidth ) * 2 - 1,- ( event.clientY / window.innerHeight ) * 2 + 1,0.5 );
vec.unproject( context.camera );
vec.sub( context.camera.position ).normalize();
let distance = - context.camera.position.z / vec.z;
pos.copy( context.camera.position ).add( vec.multiplyScalar( distance ) );
console.log(`point in scene: ${pos.x},${pos.y}`)

result: 12.312808298078027,138.93123571655028

context.mouse.x = (event.clientX / context.domElement.clientWidth) * 2 - 1;
context.mouse.y = -(event.clientY / context.domElement.clientHeight) * 2 + 1;
context.raycaster.setFromCamera(context.mouse, context.camera);
const clothRoot = context.scene.getObjectByName(context.sceneName);
let intersects = context.raycaster.intersectObjects(clothRoot.children, true);
if (intersects.length) {
    console.log(`raycaster: ${intersects[0].point.x},${intersects[0].point.y}`)

result: 11.935445926766405,137.79472716697592

this code is located in my mousemove event
I am trying to rotate an image inside a mesh with the mouse
and calculate the angle ( anchor in the top left corner)

Thank you

Sorry to say this but expecting that the first and second code section produce the same result makes no sense to me. The results of a ray/triangle intersection test can’t be reproduced by your computation in the first code block

1 Like

Thank you for you answer,
than I understood it wrong

can you give some hints please
I am trying to rotate an image on a texture created with canvas
around a different corner that one I have clicked
and I find hard to find a common point from UVs and the mouse client

on click I have the Mouse Client XY and the UV
but I need the Client XY on the different UV ( calculated based on element width/height )

Thank you again