在 Three.js 中使用具有多个重叠场景的轨道控制答案

【问题标题】：Use of Orbit Controls with Multiple Overlapping Scenes in Three.js在 Three.js 中使用具有多个重叠场景的轨道控制
【发布时间】：2017-07-16 01:20:13
【问题描述】：

在解决与使用具有多个重叠场景的轨道控制相关的问题时，我将不胜感激。

为了演示问题，我修改了multiple scenes 中的示例，并创建了一个适合我开发的测试。代码在：test with orbit controls and multiple scenes

就我而言，我需要实现两个场景

一个场景，三个场景，每个场景占据网页的一部分（div 元素…scene0、scene1 和scene…使用CSS 样式）和第二个场景，一个场景在网页的整个空间中（div 元素……scene0、scene1 和scene……使用 CSS 样式）

在此示例中，可以通过同时单击并按下键盘上的 shift 按钮在两个场景之间切换。

它似乎可以正常工作，但在两种情况之一中，Orbit Controls 无法正常工作。

我已尝试更改一些参数：

            element.style.zIndex = "6";
            element.style.order = "6";
            scene.renderOrder = 1.;

但没有任何改变。

在这一点上我非常感谢一些帮助，因为我在这个问题上找不到类似的案例。干杯，伊利亚斯

【问题讨论】：

【解决方案1】：

尝试在切换时将pointer-events: none; 添加到您的 CSS。

【讨论】：

太棒了……效果很好。 element.style.pointerEvents = "无"
和 element.style.pointerEvents = "all" 每个场景和轨道控制现在工作正常。谢谢 K. Miao，这对我很有帮助，为我节省了很多时间。干杯，伊利亚斯