angular - 如何将 three.js OrbitControls 限制到特定的 Angular2 组件或 Div

Question

我有一个页面，在各个 DIV 中有多个 Angular2 组件。其中一个组件是使用 OrbitControls 的 THREE.js 场景。

当我使用鼠标滚轮滚动或单击并拖动时，3D 模型会正确旋转和缩放。但是，无论我的鼠标指针在哪里，都会发生这种情况。我需要能够使用鼠标滚轮向下滚动另一个组件中的列表。

如何将 THREE.js 场景的控件限制/局限于其特定组件或 DIV？

Answer 1

要将控件限制到特定组件或 Div，请按照 @prisoner849 提到的那样进行 - 当您创建 OrbitControls 时，将渲染器的 domElement 作为第二个参数:

var controls = new THREE.OrbitControls(camera, renderer.domElement)