javascript - 使用 Three.js 将纹理 (x,y) 映射到 3D 对象 (x,y)

Question

我有几个带有关联 mipmap 纹理文件的 OBJ 文件。我将 mipmap 作为纹理加载，并将其映射到加载每个 OBJ 文件产生的 3D 对象。3D 对象一起渲染时，形成更大的 3D 对象的各个部分。

我不想使用 mipmap，而是想使用 2D 图像作为纹理并将其“拖放”到 3D 对象的顶部，以便 3D 对象中每个 (x,y) 的颜色对应于 ( x,y) 纹理的位置（z 并不重要——拉伸/扭曲纹理是可以的）。

基本上，我不需要将纹理映射到对象中的 (x,y,z) 顶点，而是将其映射到具有相同 (x,y) 的任何顶点。有没有办法用 Three.js 做到这一点而不必读取画布中的图像数据？

Answer 1

当然，您只需要更改网格的每个顶点的 UV，如下所示：

uv.x = C * ( vertex.x + A )
uv.y = C * ( vertex.y + A )

然后将纹理分配给你的网格，你应该得到你想要的。

您必须如上所述适当地应用比例/平移因子，因此 UV 最终会在 [0, 1] 范围内。