html5使用three.js轨迹球控制拖放

Question

目前我有一个3D模型，可以使用我的html主体上的THREE.js中的TrackballControl旋转/翻译/放大。

同时，我需要在模型层顶部设置拖放界面。我已使用此示例实现：http://www.w3schools.com/html/html5_draganddrop.asp

问题是我无法拖放图像，因为检测到的鼠标拖动将用于通过TrackballControls控制模型。

我知道另一种可能性是直接在webGL中渲染我的图像而不是使用html，如下所述：https://github.com/mrdoob/three.js/issues/1959。我可以检测鼠标位置并从那开始进行处理。然而，这不是优选的，因为我可能有很多图标可以拖放。

因此，有没有办法在THREE.js TrackballControls上实现html5拖放？我正在考虑使用z-index作为div。但是当我们添加如下所示的渲染器时，无法指定。

renderer = new THREE.WebGLRenderer( { antialias: false } );
renderer.setSize( window.innerWidth, window.innerHeight );

container = document.createElement( 'div' );
document.body.appendChild( container );
container.appendChild( renderer.domElement );

非常感谢您的帮助！