Question

来自this问题我试图以编程方式为某些模型使用Three.js生成UV映射，我需要这个，因为我的模型也是以编程方式生成的，我需要对它们应用简单的纹理。我已阅读here并成功为一些简单的3D文本生成了UV贴图，但是当将相同的贴图应用于更复杂的模型时，它就无法正常工作。

我试图应用的纹理是这样的：

黑色背景在PNG图像中只是透明的。我需要将它应用到我的模型中，它只是一个闪光效果所以我不关心模型中的确切位置，是否可以通过编程方式为这种情况创建一个简单的UV Map？

我正在使用链接问题中的代码，该代码适用于平面模型，但不适用于非平面模型：

In [29]: a = {'b': {'c': 1}}
In [30]: get_nested(a, 'b', 'c')
Out[30]: 1
In [31]: get_nested(a, 'b', 'd') is None
Out[31]: True

Answer 1

你需要更加具体。在这里，我将以编程方式应用UV贴图

for (i = 0; i < geometry.faces.length ; i++) {
   geometry.faceVertexUvs[0].push([
     new THREE.Vector2( 0, 0 ),
     new THREE.Vector2( 0, 0 ),
     new THREE.Vector2( 0, 0 ),
   ]);
}

快乐？

应用UV坐标有无限的方法。这个怎么样

for (i = 0; i < geometry.faces.length ; i++) {
   geometry.faceVertexUvs[0].push([
     new THREE.Vector2( Math.random(), Math.random() ),
     new THREE.Vector2( Math.random(), Math.random() ),
     new THREE.Vector2( Math.random(), Math.random() ),
   ]);
}

没有 RIGHT 答案。只要你想做什么就取决于你。这有点像问我如何将铅笔应用到纸上。

很抱歉这么讽刺，只是指出这个问题在某种意义上是荒谬的。

无论如何，有一些常用的方法来应用纹理。

球面映射

想象一下，你的模型是半透明的，里面有一个由胶片制成的球体，球体内部是一个点光源，因此它可以从球体向各个方向投射（如电影放映机）。因此，您可以计算出适合该情况的正确UV

要在那里得到一个点，将你的点乘以球体的世界矩阵的倒数，然后将结果标准化。在此之后，仍然存在纹理本身如何映射到虚拟球体的问题，对于这个球体，还有无数种方式。

最简单的方法是我猜叫mercator projection这就是世界上大多数2d地图的工作方式。他们的问题是北极和南极都浪费了大量的空间。假设x，y，z是前一段中提到的标准化坐标，那么
```
U = Math.atan2(z, x) / Math.PI * 0.5 - 0.5;
V = 0.5 - Math.asin(y) / Math.PI;
```
投影映射

这就像电影一样。您从一个点投射了一个2D图像。想象一下，你把电影放映机（或投影电视）指向了椅子。计算这些点

计算这些点就像从几乎所有WebGL应用程序所做的3D数据计算2D图像一样。通常他们的顶点着色器中有一行像这样
```
gl_Position = matrix * position;
```
matrix = worldViewProjection。然后你可以做
```
clipSpace = gl_Position.xy / gl_Position.w
```
现在您的x，y值从-1到+1。然后你转换它们 UV坐标为0到1
```
uv = clipSpace * 0.5 + 0.5;
```
当然，通常你会在初始化时用JavaScript计算UV坐标，但概念是一样的。
平面制图

这与投影映射几乎相同，只是想象投影仪不是一个点，而是与您想要投影的尺寸相同。换句话说，当您将模型移近投影仪时，使用投影映射时，投影的图像会变小但是平面则不会。

根据投影映射示例，这里唯一的区别是使用正交投影而不是透视投影。
多维数据集映射？

这是从6个方向有效的平面映射。由你决定决定哪个UV坐标获得6个平面中的哪个。我猜大部分时间你都采用三角形的法线来看哪个将其面对大部分，然后从该平面进行平面映射。

实际上我可能会把我的条款搞混了。你也可以真正的立方体映射，你有一个立方体纹理但需要 U，V，W而不仅仅是U，V。为此，它与球体相同示例，除了您只是直接使用标准化坐标 U，V，W。
圆柱映射

这就像球形映射，只是假设有一个小圆柱投射到你的模型上。与球体不同，圆柱体具有方向，但基本上您可以将模型的点移动到圆柱体的方向，然后假设x，y，z现在相对于圆柱体（换句话说，您将它们乘以矩阵的逆矩阵）那表示圆柱的方向）。
```
U = Math.atan2(x, z) / Math.PI * 0.5 + 0.5
V = y
```

另外2个解决方案

也许您想要环境映射？

Here's 1 example和Here's another。
也许您应该考虑使用像Maya或Blender这样的建模软件包，内置UV editors和内置UV投影仪。

以编程方式为模型生成简单的UV映射

1 个答案: