我正在尝试在 BufferGeometry 中设置每个面的 UV 索引。
我从几何开始。我的几何体的每个面都有一个与 UV 索引相对应的 face.materialIndex
。我正在尝试将其转换为 BufferGeometry,然后将 face.materialIndex
映射到 BufferGeometry
。
这是我到目前为止所拥有的:
// Convert geometry > buffergeometry
const bufGeo = new BufferGeometry().fromGeometry( geometry );
// Get an array of all the original geometry's indices...
const faceIndices = geometry.faces.map( face => face.materialIndex );
// Build a new array with the indices...
const indices = new Uint16Array( faceIndices );
// Apply to the BufferGeometry
bufGeo.setIndex( new BufferAttribute( indices, 1 ) );
现在这似乎破坏了我的网格并使其根本无法绘制。我做错了什么?
顺便说一句,在幕后,当 Geometry 转换为 BufferGeometry 时,Three.js 首先将其置于称为 DirectGeometry
的中间格式中。这用于复制索引,但是 it was removed for reasons unknown in this commit by Mr Doob 。现在,三似乎在 Geo > BufGeo 转换中完全放弃索引。
我还尝试使用该提交中的代码(修改为使用 setIndex):
const indices = new Uint16Array( faceIndices.length * 3 );
bufGeo.addAttribute( 'index', new BufferAttribute( indices, 1 ).copyIndicesArray( faceIndices ) );
但是我也有同样的问题。生成的网格被破坏。
最佳答案
setIndex
函数用于指定引用 BufferGeometry 上顶点属性缓冲区的三角形索引。在您的示例中,您将三角形索引数组设置为从每个面的 materialIndex
生成的数组。
materialIndex 对应于 Material 数组中用于渲染该三角形的 Material ,而不是 UV 索引。来自 Face3 documentation :
materialIndex — (optional) which index of an array of materials to associate with the face.
每个面的 materialIndex
很可能为零,除非您做了一些更改,这可以解释为什么您的模型停止绘制(面上的顶点都是相同的) )。
这一行是你的问题:
//获取所有原始几何体索引的数组...
constfaceIndices=geometry.faces.map(face=>face.materialIndex);
还需要注意的是,通过这种方式生成数组,您将获得属性所需数组元素的 1/3,因为每个面有 3 个顶点。
可能的解决方案
如果您希望使用不同的 Material 渲染每个面(如
materialIndex
所对应的那样),那么我会查看 groups for BufferGeometry如果您想实际为 BufferGeometry 生成自定义 UV 坐标,我会查看 BufferAttributes和 BufferGeometry.addAttribute函数添加新的 UV 属性。
希望有帮助!
关于Three.js:为 BufferGeometry 设置索引/索引的正确方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45123977/