CODEWITHSUNDEEP
three.js
Arjun M Nair
Arjun M Nair

Reputation: 71

click event in mesh for threejs

I used below code to add click event in mesh for three js.

var raycaster = new THREE.Raycaster();
var mouse = new THREE.Vector2();
var targetMesh
function onMouseClick( event ) {
    raycaster.setFromCamera( mouse, camera );
    var isIntersected = raycaster.intersectObject( targetMesh );
    if (isIntersected) {
        console.log('Mesh clicked!')
    }
}
function onMouseMove( event ) {
    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
}
window.addEventListener( 'mouseclick', onMouseClick, false );
window.addEventListener( 'mousemove', onMouseMove, false );

but getting an error as

ERROR Error: Cannot set properties of undefined (setting 'x') in threejs

i got a solution from below link Three JS Drag Controls Uncaught TypeError: Cannot set property 'x' of undefined

But i dont want DragControls i need only click event for mesh.please help me to find the solution

Upvotes: 1

Views: 2114

Answers (1)

Terry G Lorber
Terry G Lorber

Reputation: 2962

Try using mouse.set(x, y) instead. mouse.x and mouse.y are getters not setters.

https://threejs.org/docs/#api/en/math/Vector2

Upvotes: 1

Related Questions