Three.js将纹理映射到不规则几何(UW坐标)

时间:2018-04-17 15:22:57

标签: three.js

我在THREE.js中映射纹理时遇到问题,这可能与广泛搜索指示的创建自定义UV坐标有关。

下图显示了通过操纵框的下顶点从THREE.BoxGeometry创建的几何图形。侧面的纹理看起来很拉伸(虽然这是正确的,我猜)。 picture1

有没有一种方法可以预测"侧面的纹理,例如通过创建自定义uv坐标看起来像在第二张(photoshopped)图片? picture2

谢谢你的帮助!

1 个答案:

答案 0 :(得分:1)

您需要手动重新映射顶点以执行所谓的“框映射”或“三平面映射”。

以下是我拼凑的一个例子:https://codesandbox.io/s/qxk8xvnrvj

它创建了一个带有一些细分的立方体..如果它们位于顶部则扰乱那些顶点...然后通过面uv和顶点进行迭代以通过框映射重新映射每个面UV,通过找到主导轴面向法线点...然后使用另一个2轴作为U轴和V轴进行展开。