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

标签 angular three.js

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

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

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

最佳答案

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

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

关于angular - 如何将 three.js OrbitControls 限制到特定的 Angular2 组件或 Div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42397029/

相关文章:

类似于 ngResource/$resource 的 Angular2 模块

angular - Flex-layout 半固定位置

angular - 使用angular将隐藏参数传递给外部链接

javascript - 如何从 Javascript/THREE.js 编码和发送 float 据到 GLSL 并解码结果

javascript - 如何提高 three.js 中的阴影质量

Three.js FirstPersonControls 相机旋转在 GSAP 补间/重新启动控件后跳回

three.js - ThreeJs 通过 Canvas 看鼠标的协调性不好

javascript - three.js pov 相机环视错误

javascript - 具有 508 可访问性的 Angular 2

css - Angular 4 ngStyle 背景图像使页面变慢。滚动时无限期调用的函数