启用轨迹球控件时 three.js mousedown 不起作用

Question

轨迹球与 onMouseClick 和 onMouseUp 事件监听器一起在我的 three.js 程序中运行良好。我使用以下行启用轨迹球:-

controls = new THREE.TrackballControls( scene01camera02 , DOM_container);

但是onMouseDown 事件监听器不起作用。

如果我禁用轨迹球(通过注释掉上面显示的代码行)并禁用任何其他相关代码然后 onMouseDown 工作正常。

有什么方法可以同时使用 onMouseDown 和 Trackball 控件吗？

原因是当 mousedown 事件发生时我可以检测到它在屏幕上发生的位置然后切换控件变量，以便 Trackball 控制适当的 scene_camera_container。

    In HTML
    <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <div id="ThreeJScontainer" style="position: absolute; left:0px; top:0px"></div>

    In F_Init()
    renderer = new THREE.WebGLRenderer( {antialias:true} );
    DOM_container = document.getElementById( 'ThreeJScontainer' );
    DOM_container.appendChild( renderer.domElement );

    renderer.setSize( window.innerWidth, window.innerHeight );

    controls = new THREE.TrackballControls( scene01camera02 , DOM_container);

    document.addEventListener( 'mousemove', onDocumentMouseMove, false );  //works OK
    document.addEventListener( 'mousedown', onDocumentMouseDown, false );
    document.addEventListener('click', SOW_onDocumentMouseClick, false);  //works OK

    //in SOW_onDocumentMouseClick event handler 
    // I reset the controls to point to a new scene_camera according to the viewport clicked on. 
    //Example:-
    controls = new THREE.TrackballControls( scene01camera01 , DOM_container);

    //if onDocumentMouseDown was working as I expected I would do the resetting in there 

    In F_Update()
    controls.update();

    In F_Render()
    renderer.setViewport( 0, 0, SCREEN_WIDTH, SCREEN_HEIGHT );
    renderer.clear();   

    //...BOTTOM STRIP (DASHBOARD)
    renderer.setViewport( bottomPanelXmin, bottomPanelYmin, bottomPanelWidth, bottomPanelHeight );  
    renderer.render( scene02, scene02camera04 );
    // etc 
    // etc for other "Panels" (my name for viewports)

示例原型(prototype)运行于:- http://www.zen226082.zen.co.uk/TRI_VP.html (在 Chrome 或 Opera 中最好，在 Firefox 中对齐问题)。

Answer 1

我知道这是旧的，但还没有对此答案的回复，但我最近遇到了同样的问题。

确保您的container.append(renderer.domElement);在初始化THREE.TrackballControls(camera, renderer.domElement);之前执行;