How to capture mouse *dblclick* event in renderer?

Questions
,
1

I have a simple scene (including Orbitcontrols) where I capture mouse clicks or touches via
renderer.domElement.addEventListener('click', onMouseClick);
or
renderer.domElement.addEventListener('pointerdown', onMouseClick);
respectively.
However, there does not seem to be an equivalent for dblclick (onDblClick), no matter if used in combination with OrbitControls or not.
Is there a standard way how to detect dblclick in threejs ?

Thank you! (as you may have guessed, I am new to threejs …)

2

Hmm, dblclick seems to work for me. I just tried this snippet on one of my template repos and it seemed to work:

    window.addEventListener('dblclick', () => {
        console.log("clicked floor")
    })
3

Yep, you are right. It even works with
renderer.domElement.addEventListener('dblclick', onMouseDblClick);
Thanks to your comment (using global window as target element) I was able to find my coding error … :roll_eyes:

1 Like
4

please could somebody show me how to copy a mesh using mouse event then stop copying it I used event.preventDefault(); but not working here is The code :

renderer.domElement.onclick=function(event){
   const x = (event.clientX / window.innerWidth) * 2 - 1;
        const y = -(event.clientY / window.innerHeight) * 2 + 1;
const geometry = new THREE.BoxGeometry( 2,2,2 );
const material = new THREE.MeshNormalMaterial( {color: 0x00ff00} );
const cube = new THREE.Mesh( geometry, material );
scene.add( cube);
const vector = new THREE.Vector3(x, y, y);
        vector.unproject(camera);
        const dir = vector.sub(camera.position).normalize();
        const distance = -camera.position.y / dir.y;
        const pos = camera.position.clone().add(dir.multiplyScalar(distance));
cube.position.set(pos.x,0,pos.z);
}
renderer.domElement.oncontextmenu=function(event){
event.prevantDefault();
}