Mouseup problem with orbit controls

Resources
,
1

I had the issue of the mouseup event not fireing for an unkown reason.
Using the chrome dev tool I was able to see that orbit controls use the mouse events as well. Then I removed these events in the dev tools, just for testing. And all of a sudden my mouseup event worked properly.
Next I looked up this forum and found one thread with a similar question: https://discourse.threejs.org/t/mouseup-event-does-not-work-along-with-orbitcontrols/20432/9

But I could’nt find any fitting answer. But I also saw, that the orbit controls events are not bound to the canvas (renderers’ domElement) but its parent. So I tried the same. And violá events work!

 this.m_renderer.domElement.addEventListener('mousedown' , (e) => { 
            e.preventDefault();
            this.m_tmpMousePosition = {"x": e.clientX , "y": e.clientY } 
            console.log("mouse down"); //works
        });
        this.m_renderer.domElement.addEventListener('pointerup' , (e) => {
            console.log("pointer up"); //no, because bound to canvas
        });
        this.m_renderer.domElement.addEventListener('mouseup' , (e) => {
            console.log("mouse up"); //no because bound to canvas
        });
        this.m_renderer.domElement.parentNode.addEventListener('click' , (e) => {
            console.log("click"); //yes because bound to parent
        });
        this.m_renderer.domElement.parentNode.addEventListener('dblclick' , (e) => {
            console.log("double click"); //yes because bound to parent
        });
        this.m_renderer.domElement.oncontextmenu = (e) => {
            console.log("context menu"); //works
            e.preventDefault();
            this.displayContextMenu(e);
        }
        window.addEventListener('keyup', (e) => { 
            console.log("key up"); //works
            this.onKeyUp(e); 
        });

Binding “mouseup” to the parentNode will make that event fire again. And the orbit controls seem not to affected in any way.

So just in case somebody struggles this issue as well, this might help you as well and therefore save time and brain-damage :slight_smile:

1 Like