WebGL教程_Three.js教程_郭隆邦技术博客 郭隆邦_技术博客 Three.js免费视频教程

Three.js获取模型顶点数据

通过Three.js访问或获取模型的顶点数据,也就是获得模型绑定几何体的顶点数据,比如一个网格模型Mesh,首先需要通过网格模型的几何体属性Mesh.geometry访问模型对应的几何体,然后查看几何体几何体的类型,对于Three.js而言有两种几何体类型GeometryBufferGeometry,一般来说Three.js加载外部stl、obj、fbx、GLTF等模型,解析后返回的模型对象所包含的几何体对象一般是缓冲类型几何体BufferGeometry

访问几何体BufferGeometry的顶点数据,可以通过.attributes.index两个属性访问顶点数据,.index属性是几何体的顶点索引数据,如果没有顶点索引数据就返回null。除了顶点索引数据意外的数据都通过几何体BufferGeometry.attributes属性实现,比如顶点位置坐标BufferGeometry.attributes.position,顶点UV坐标BufferGeometry.attributes.uv,顶点法向量BufferGeometry.attributes.normal。 访问.index.position.uv等属性,如果存在相应的顶点数据,返回的都是一个BufferAttribute对象,BufferAttribute对象.array属性就是顶点数据构成的类型化数组,比如Float32ArrayInt16Array

// 访问网格模型第一个顶点位置的x坐标分量
mesh.geometry.attributes.position.getX(0)
// 访问网格模型第一个顶点位置的y坐标分量
mesh.geometry.attributes.position.getY(0)
// 访问网格模型第一个顶点位置的z坐标分量
mesh.geometry.attributes.position.getZ(0)

访问几何体Geometry的顶点数据,如果是顶点位置数据可以通过.vertices属性实现,如果是访问纹理UV坐标通过.faceVertexUvs属性实现,如果是顶点颜色数据,要具体具体分析,如果是点或线模型对象,可以通过.colors属性访问,如果是网格模型Mesh需要访问三角形属性.faces.faces属性也包含了网格模型中三角形顶点坐标数据,顶点坐标数据是通过顶点索引指向.vertices属性。

本站版权所有,本站任何内容未经允许不得转载   备案号:豫ICP备16004767号 QQ群:187740169 (WebGL-Three.js教程)   邮箱:guolongbang@163.com