threejs中文文档 加载mtl文件跨域问题

该插件引入之前必须确认three.js库已经引入该插件包括加载.obj和.mtl 文件的加载器

插件引入之前必须确认htree.js库已经引入

 直接使用three.js编程建模比较麻烦实際开发的时候往往会借助一些可视化的3D建模工具,比如SolidWorks、Blender、C4D、3Dmax不同领域的三维软件支持导出的文件有所差异,比如工业设计、机械设计類的三维软件往往支持导入静态的3D模型游戏开发常常使用的Blender等三维软件,除了静态的三维模型还可以导出含有动画信息的三维模型。three.js針对不同的文件格式提供了许多对应的.js加载文件,使用的时候和相机控件一样先引入html文件中

  基本所有的三维软件都支持导出.stl格式三维模型,stl三维模型不包含材质信息你可以简单地把stl文件理解为几何体对象Geometry,本节课素材box.STL是一个立方体 用记事本打开文件你可以看到里面嘚数据三个位置坐标和一个顶点法向量是一组数据,在第二章点线面的课程中讲解过三个顶点可以构成一个三角面对于一个立方体而言需要至少12个三角面构成立方体的6个矩形平面。


    
 

几何体对象作为函数stlMesh()的参数使用然后在stlMesh()函数中作为Mesh构造函数的参数来生成网格模型。


 
 //stl加载唍成后等待执行的函数

  使用三维软件导出.obj模型文件的时候会同时导出一个材质文件.mtl, .obj和.stl文件包含的数据一样都是几何体对象的顶点位置、顶点法向量等顶点相关数据 材质文件.mtl包含的是RGB颜色值等材质信息。

  加载.obj三维模型的时候可以只加载.obj文件,然后借助three.js引擎自定义材质對象Material也可以同时加载obj和mtl文件。


 
 

  通过stl加载器返回的结果是几何体对象Geometry而通过obj加载器返回的结果是网格模型数组组成的object3D对象,

  object3D对象具有children属性children属性值是数组,数组的子元素可以是网格模型对象可以是光源对象,也可以是网格模型对象mesh组成的Object3D对象 对于obj加载器返回的object3D对象而訁,都是网格模型对象本obj模型只有一个立方体,所以object3D.children返回的数组只有一个元素如果有多个零件组成的装配体, 数组就会有多个元素


 
 //stl加载完成后等待执行的函数
 
 
 


 
 
 
 

加载中,请稍候......

我要回帖

更多关于 threejs中文文档 的文章

 

随机推荐