javascript - 当 THREE.PlaneBufferGeometry 位于另一个对象内时,如何隐藏它的一部分?

标签 javascript three.js

我有一个由 THREE.PlaneBufferGeometry (水面)组成的网格,该表面上有另一个对象(船)。我的问题是,当船稍微入水时,您会看到水突然出现在船内(因为 y 值较高)。

我该如何解决这个问题?

我正在考虑计算船内部的尺寸并尝试将它们传递到水面的着色器。 (如果该点在内部,请将其隐藏。)这是最好的方法吗?我该如何做到这一点?

编辑:水应该与船的两侧重叠(例如显示在船的前面)。澄清一下:

  Current situation:            Desired situation:

B        A
     |         |                  |         |
-----|---------|--------     -----|         |--------
     |_________|                  |_________|

从 [A] 处,您不应该看到船对象内的水,从 [B] 处,您不应该看到船的下部。

最佳答案

尝试禁用水面的深度写入。检查以下示例。假设蓝色平原是水,红色平原是船。

//codepen.io/OlxandrPopov/pen/xwVBKg

关于javascript - 当 THREE.PlaneBufferGeometry 位于另一个对象内时,如何隐藏它的一部分?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32659057/

相关文章:

javascript - Threejs - 几何坐标系到屏幕坐标系

三.js更新几何面 Material 索引

javascript - Three.js 中的自定义形状

javascript - Bootstrap 4 : Is there a way to nest a bootstrap "btn-toolbar" in order to make it x-axis scrollable on smaller screens?

javascript - 在 Visual Studio Code typescript 调试中找不到源映射

javascript - 方法中一行的 tslint 错误

javascript - 使用javascript更改ul元素的字体大小

javascript - 在 THREE.js 面中反转顶点顺序

javascript - 保持背景固定但让照片滚动

javascript - 如何在单页网站中添加 CSS 样式文件切换器?