规范 OBJ文件不需要任何种文件头,文件由一行行文本组成,注释行以符号“#”为开头,空格和空行可以随意加到文件中。...多行可以逻辑地连接在一起表示一行,方法是在每一行最后添加一个连接符()。 注意连接符()后面不能出现空格或Tab格,否则将导致文件出错。...obj 文件格式 其中常见的obj数据的组成形式为: 首行:mtllib *.mtl 表示使用哪个mtl文件,以mtllib开头 顶点坐标: v x y z 表示一个顶点的坐标,以v开头 纹理坐标...多行可以逻辑地连接在一起表示一行,方法是在每一行最后添加一个连接符 ()。 注意连接符 () 后面不能出现空格或 Tab 格,否则将导致文件出错。 o用于引入一个新的 object。...例如上面的 Obj 文件中,我们需要解析顶点位置,纹理坐标等数据,构成 OpenGL 可以渲染的 Mesh 对象。 obj 文件在导出时一般包括两个文件 .obj 文件和 .mtl 文件和贴图图像。
构建一些规则的 3D 物体,如立方体、球体、椎体等,我们自己可以手动轻易实现,但是在实际开发中往往会用到复杂的 3D 物体,如人体、汽车等,这就需要设计师和专业的建模工具软件(像 3DS Max、Maya...OBJ 文件的结构 本文主要介绍 obj 3D 模型文件及其附属文件 mtl ,下面是 obj 模型文件的数据结构(为了方便展示部分数据被略过)。...OBJ 文件数据结构的简单说明: # 开头的行表示注释行; mtllib 表示指定该 OBJ 文件所使用的 mtl 文件(材质文件); v 开头的行表示存放的是顶点坐标,后面三个数分别表示一个顶点的(x...分量值,其中 p 分量一般用于 3D 纹理; usemtl 01___Default 表示使用指定 mtl 文件中名为 01___Default的材质; s 1 表示开启平滑渲染; f 开头的行表示存放的是一个三角面的信息...表示指定材质的凹凸纹理文件,凹凸纹理修改表面法线,用于凹凸纹理的图像表示相对于平均表面的表面拓扑或高度(没用过)。
以创建一个简单的立方体为例,创建简单的立方体需要添加8个顶点和12个三角形的面,创建顶点时需要指定顶点在坐标系中的位置,添加面的时候需要指定构成面的三个顶点的序号,第一个添加的顶点序号为0,第二个添加的顶点序号为...七、纹理 在生活中纯色的物体还是比较少的,更多的是有凹凸不平的纹路或图案的物体,要用Three.JS实现这些物体的效果,就需要使用到纹理贴图。...球体、立方体、圆柱体等等,但是在实际使用中往往需要用到一些特殊形状的几何体,这时可以使用3D建模软件制作出3D模型,导出obj、json、gltf等格式的文件,然后再加载到Three.JS渲染出效果。...上图的椅子是在3D制图软件绘制出来的,chair.mtl是导出的材质文件,chair.obj是导出的几何体文件,使用材质加载器加载材质文件,加载完成后得到材质对象,给几何体加载器设置材质,加载后得到几何体对象...主要的代码如下: // .mtl材质文件加载器 var mtlLoader = new THREE.MTLLoader(); // .obj几何体文件加载器 var objLoader = new THREE.OBJLoader
有,使用建模软件生成obj文件。 Obj文件简单来说就是包含一个3D模型信息的文件,这里信息包含:顶点、纹理、法线以及该3D模型中纹理所使用的贴图。...[img594ca77c3ca47.png] Mtllib(material library)指的是该obj文件所使用的材质库文件(.mtl) 单纯的obj生成的模型是白模的,它只含有纹理坐标的信息...使用材质库文件中具体哪一个材质 [img594ca7811c1a3.png] F是面,后面分别对应 顶点索引 / 纹理坐标索引 / 法线索引 这里大部分也都是我们非常常用的属性了,还有一些其他的...,如果有对obj文件所有可能含有的信息完成匹配的同学可以去看下Threejs中objLoad部分源码 3、将obj中数据真正的运用3D对象中去 Text3d.prototype.addFace =...文件中f(ace)行中4个值的情况,导出obj文件中可以强行选择只有三角面,不过我们在代码中兼容一下比较稳妥 4、旋转平移等变换 物体全部导入进去,剩下来的任务就是进行变换了,首先我们分析一下有哪些动画效果
文件,查看是否有“vn” 标记 mtl文件中设置模型颜色为黑色 一些建模人员在导出mtl文件时候, 参数Kd 是0 0 0, Kd参数会被解析成模型材质的color属性,既颜色。...mtl 也是文本文件,直接用文本编辑器可以打开查看: PS mtl中 Kd 代表漫反射的颜色, Ks代表高光反射的颜色。...mtl文件中贴图引用了本地路径 有时候建模人员在导出mtl文件的时候,里面的贴图路径是本地的绝对路径,如下图所示: 此时导入的模型因为找不到贴图,而变成了黑色。...解决方法就是把绝对路径改成相对路径,如下图: 可以手动编辑mtl文件修改,也可以建模人员导出的时候设置。...导入的场景没有设置灯光 还有一种情况,模型都没有问题,但是由于场景没有设置任何灯光,导致模型看不见,此种情况需要程序上添加灯光即可。 结语 上一张修改后的效果图
('obj/city.obj', 'obj/city.mtl', { // 加载模型 center: true, // 模型是否居中,默认为 false,设置为 true 则会移动模型位置使其内容居中...,如果是相对路径则以加载 obj 的 html 页面的路径为参考 shape3d: 'city', // 如果指定了 shape3d 名称,则HT将自动将加载解析后的所有材质模型构建成数组的方式...shape3d 属性,然后设置到节点的 shape3d 属性上,即可修改;或者直接设置节点的 shape3d 属性为 json 格式的 obj 文件,这里还是采取第一种方式: var showFloor.../obj/city.obj", // 必须设置 obj 属性 "mtl": "..../obj/city.mtl" // 此项可写可不写,如果需要设置 obj 模型的样式(如颜色等),则必须设置此项 } 但是这种模式不适用于这个场景,因为我的模型有些大,需要调用到 obj 模型的原始大小
('obj/city.obj', 'obj/city.mtl', {// 加载模型 center: true,// 模型是否居中,默认为false,设置为true则会移动模型位置使其内容居中...cube: true,// 是否将模型缩放到单位1的尺寸范围内,默认为false prefix: 'obj/',// 图片路径前缀,即在map_kd值之前增加的前缀,如果是相对路径则以加载...显示 city.obj 与 city.mtl 的内容 } }); } 工控楼层模型的加载也是类似,这里就不再赘述。.../obj/city.obj",// 必须设置 obj 属性 "mtl": "..../obj/city.mtl"// 此项可写可不写,如果需要设置 obj 模型的样式(如颜色等),则必须设置此项 } 但是这种模式不适用于这个场景,因为我的模型有些大,需要调用到 obj 模型的原始大小
之前学习blender的时候,在国外的一个系列教程有提到解析obj文件,这篇教程便来介绍如何解析obj和mtl文件,并用OpenGL ES显示出来。...概念介绍 1、obj文件 obj文件是一种3D模型文件。 文件格式 ?...文件 mtl文件则是obj文件的附属文件,描述几何体的表面属性。...和mtl文件,解析文件内容,写入到.h/.c文件中,把.h/.c文件加入新的工程引用。...把Model中存储的解析信息,分别写入到.h/.c文件中。
)来加载 OBJ 文件: ht.Default.loadObj('obj/plane.obj', 'obj/plane.mtl', { center: true..."obj/plane.obj", "mtl": "obj/plane.mtl"// 要是没有 mtl 文件,则设置为 "" } 之后通过设置节点的 style 的 shape3d 属性设置为这个...不管使用哪种方法来加载模型,mtl 文件中如果有使用贴图,贴图的路径需要是相对于 obj 文件的路径。...前面代码中的 modelMap.propeller 是 OBJ 文件中定义好的 modelMap 对象中的 propeller 对象,可以试着打印 modelMap 看看输出结果。 ?.../guide/guide/plugin/obj/ht-obj-guide.html#ref_loadobj),我们还添加了一个在 OBJ 模型中没有的飞机尾部的“红色闪烁指示灯”,这里用到的是组合模型
,也要设置绝对定位中的位置,我在页面中添加了一个 div,将 HT 的部分都添加进这个 div 中: <div id="myDiv" style="border: 1px solid red; width...HT 封装了解析 <em>obj</em> 格式的函数 ht.Default.loadObj 函数用来导入模型,该函数有三个参数,第一第二分别为 <em>obj</em> <em>文件</em>的<em>路径</em>和 <em>mtl</em> <em>文件</em>的<em>路径</em>,第三个参数为 json 格式控制参数...<em>obj</em>', '<em>obj</em>/机柜组件1.<em>mtl</em>', { cube: true,//是否将模型缩放到单位1的尺寸范围内,默认为false center: true,//模型是否居中...prefix: '<em>obj</em>/',//<em>路径</em>前缀,如果前面参数写了<em>路径</em>前缀,这个不写也可以 shape3d: 'cabinet',//指定 shape3d 名称 finishFunc: function...,<em>如</em>setAttr('age', 98)触发事件的e.property为a:age 这里我们将对模型<em>中</em> Data 的属性变化事件的监听结果传给 HTML <em>中</em>的 id 为 property 的 span
前两天有伙伴在 QQ 上询问,如何在 Creator 3D 中切换模型贴图。...上图中,先使用引擎内置的无光照的 Effect,它的选项看起来没那么多,可以减少畏惧感,我们将一 ground 的图片拖动到 test.mtl 材质资源上。...3 使用脚本修改材质纹理 我这里创建了一个 test.ts 的脚本文件,用于修改材质上的纹理资源,先看下组件属性: ?...纹理资源已经设置好了,如何通过代码访问或修改材质呢?...只需要将材质属性中的属性名,首字母小写就可以了! 3 小结 本篇介绍了使用 material.setProperty API 修改材质纹理。
这个例子用了 HT 中的树组件 ht.widget.TreeView 和 HT 中加载 OBJ 格式文件的 ht.Default.loadObj 函数来加载图中的两辆摩托车,我们利用代码来从头开始解析这个例子的部分...接着要将最外层的组件添加进底层 div 中,没有阅读过我的文章的同学这边我解释一下,所有的 HT 组件最根层都是一个 div 组件,可通过组件的 getView 函数获得,默认和自定义交互时间监听一般添加在该...接着通过利用 ht.widget.loadObj 函数将 OBJ 格式文件导入模型: ht.Default.loadObj('obj/scooter.obj', 'obj/scooter.mtl', {...文件路径,mtlUrl MTL 文件路径,params JSON 结构参数,parmas 参数可以设置 ht.Default.parseObj(text, mtlMap, params) 第三个参数的控制信息...本例中有两个 motor 摩托车模型,一个是整体的模型,不能拆分,一个是可以拆分成部分的模型,接下来就来看看如何将 OBJ 文件中的模型拆分开来: ht.Default.loadObj('obj/scooter.obj
这是我要压缩的文件列表,把响应的资源文件存放到对应的文件夹下,然后在 loadorder 文件中标明资源加载的顺序,loadorder 文件内容如下: 'js/ht.js', 'js/ht-obj.js...', 'js/ht-modeling.js', 'obj/equipment.mtl', 'obj/equipment.obj', 'image/equipment.jpg' 在资源加载顺序中,要标明响应资源的相对于....zip 文件的路径,这样方便在读取 .zip 文件时快速找到相应的资源文件。...有涉及到 3D 模型数据与 HT 3D 拓扑应用的结合,在 .zip 文件中的 obj 目录就是存放 3D 模型数据,在文件读取中,将 3D 模型数据以文本对形势读取出来存放到变量中,再将数据传递到 init...其中那段 setImage 的代码需要特别注意,为什么我要大费周张的去判断 image 的文件名呢,那是因为在 mtl 3D 模型描述文件中有一个设置贴图的属性,该属性可以指定文件的绝对路径,也可以指定文件的相对路径
这个例子用了 HT 中的树组件 ht.widget.TreeView 和 HT 中加载 OBJ 格式文件的 ht.Default.loadObj 函数来加载图中的两辆摩托车,我们利用代码来从头开始解析这个例子的部分...接着要将最外层的组件添加进底层 div 中,没有阅读过我的文章的同学这边我解释一下,所有的 HT 组件最根层都是一个 div 组件,可通过组件的 getView 函数获得,默认和自定义交互时间监听一般添加在该...接着通过利用 ht.widget.loadObj 函数将 OBJ 格式文件导入模型: 1 ht.Default.loadObj('obj/scooter.obj', 'obj/scooter.mtl'...文件路径,mtlUrl MTL 文件路径,params JSON 结构参数,parmas 参数可以设置 ht.Default.parseObj(text, mtlMap, params) 第三个参数的控制信息...本例中有两个 motor 摩托车模型,一个是整体的模型,不能拆分,一个是可以拆分成部分的模型,接下来就来看看如何将 OBJ 文件中的模型拆分开来: 1 ht.Default.loadObj('obj/
所以我怕我代码写多了, 你们反而看起来不好理解hhhhhh 在c++下用OpenGL解析的话可以看我其他博客 运行环境:vs2017,需要配置的库为:sharpGL 一.读取3D模型 在3d图形处理中,...下面是一个obj的模型文件,我们可以使用记事本打开看看里面是什么: # Blender3D v249 OBJ File: untitled.blend # www.blender3d.org mtllib...cube.mtl v 1.000000 -1.000000 -1.000000 v 1.000000 -1.000000 1.000000 v -1.000000 -1.000000 1.000000...调用方法也很简单,在winform下的话,在openglControl控件的draw事件中加下面的代码: 第一步:New一个对象 第二步:读取自己路径下的obj模型文件 第三步:调用显示列表绘制图案...gl.CallList(obj.showFaceList); } 对了如果用opengl读取模型解析3d模型后看起来像个2d的样子,无非就是你的光照问题,或者模型文件里面没有顶点法线
用VMD载入一些常见的格式,如xyz、pdb等,然后点击File → Render,选择Wavefront (OBJ and MTL)渲染方式,然后点击Start Rendering即可。...在VMD的安装目录会生成vmdscene.mtl和vmdscene.obj两个文件。 2....将3D模型插入PPT 将上述vmdscene.obj文件复制进所需的PPT页面或直接拖进去即可,如下图所示: 拖动中间的旋转按钮,可以拖动到想要的角度。 3....点中3D模型后,点击PPT中的“动画”,会看到比一般的图片或文本框多几个选项,如下图所示: 选择“转盘”效果,即可实现3D模型的旋转。...说句题外话,其实PPT的3D模型功能还可以配合一些动作效果或插件,实现更酷炫的效果,大家可以在网上搜索相关教程,说不定在自己将来的PPT中能用上。
领取专属 10元无门槛券
手把手带您无忧上云