大家好，今天小编来为大家解答3D模型Obj网站源码分享这个问题，3d模型 网站很多人还不知道，现在让我们一起来看看吧！
到目前为止，我们已经介绍了如何利用Cesium显示影像数据、地形高程数据、矢量数据，以及空间可视化方面的几何数据（Entity），感兴趣的同学可以阅读我前面写的文章。在三维数据方面，Cesium支持模型文件glTF，以及三维瓦片数据3DTiles。本次我们先从glTF说起，3DTiles的讲解留给下一章节。
glTF介绍
glTF全称是GraphicsLanguageTransmissionFormat（图形语言传输格式），是一种针对GL(WebGL，OpenGLES以及OpenGL)接口的运行时资产传递格式，由澳大利亚的Khronons集团进行维护，并于2017年6月5日在GitHub上（https://github.com/KhronosGroup/glTF）公布了glTF2.0的规范，此文也是针对于2.0版本进行介绍的。glTF通过提供高效、可扩展、可互操作的格式来传输和加载三维内容，填补了3D建模工具与现代图形应用程序之间的空白，它已成为了Web上的3D对象标准（Web导出的通用标准），可以说glTF是3D模型的JPEG格式，几乎每个3DWeb框架都支持glTF。随着glTF的不断发展，glTF形成了自己庞大的生态系统，同时受到了各行业的大力支持。所以，如果有人要为你提供3D模型，你就可以要求他们提供glTF格式的模型。
glTF生态系统
glTF行业支持
同时，Cesium官方GitHub中也提供了obj转glTF的源码库，感兴趣的可以前往这里https://github.com/CesiumGS/obj2gltf查看。
目前，glTF3D模型格式有两种：*.gltf：基于JSON的文本文件，可使用文本编辑器轻松编辑，通常会引用外部文件，例如纹理贴图、二进制网格数据等；*.glb：是二进制格式，通常文件较小且自包含所有资源，但不容易编辑。
要获取glb文件，可以直接从3D建模程序中导出它们，也可以使用工具将gltf转换为glb。在线转换工具推荐MakeGLB（https://sbtron.github.io/makeglb/），当然，如果您使用的是VSCode编辑器，建议安装glTFTools扩展工具，能够非常方便地查看glTF的数据结构、glTF和glb互转等。
glTF场景描述结构
glTF的核心是一个JSON文件，另外还支持外部数据。具体而言，一个glTF模型可包括以下三部分内容：JSON格式的文件（.gltf），其中包含完整的场景描述，并通过场景结点引用网格进行定义。包括：节点层次结构、材质（定义了3D对象的外观）、相机（定义义了渲染程序的视锥体设置）、mesh（网格）、动画（定义了3D对象的变换操作，比如选择、平移操作）、蒙皮（定义了3D对象如何进行骨骼变换）等；.bin包含几何和动画数据以及其他基于缓冲区的数据的二进制文件；图像文件（.jpg，.png）的纹理。
如下图所示：
以其他格式定义的文件（例如图像文件）可以存储在通过URI引用的外部文件中，并排存储在GLB容器中，或使用数据URI直接嵌入到JSON中，一个有效的glTF模型必须指定其版本。
glTF的JSON结构
场景对象以数组的形式存储在JSON文件中，可以使用数组中各个对象的索引来访问它们：
&34;:\n[\n{…}\n{…}\n…\n],
这些索引还用于定义对象之间的关系。上面的示例定义了多个网格对象，并且一个节点可以使用网格索引引用上面定义的其中一个网格对象：
&34;:\n[\n{&34;:0,…},\n{&34;:5,…},\n…\n}
下图概述了glTF的JSON部分的顶级元素：
glTF的JSON结构
下面我对这些元素进行简要说明：scene：glTF格式的场景结构描述条目。它通过引用node来定义场景图；node：场景图层次中的一个节点。它可以包含一个变换(比如旋转或平移)，并且可以引用其他（子）节点。此外，它可以引用网格和相机，以及描述网格变换的蒙皮；camera：定义了用于渲染场景的视锥体配置；mesh：描述了出现在场景中几何对象实际的几何数据。它是指accessor用于访问实际几何数据material的对象，并且是指在渲染对象时定义其外观的；skin：定义了用于蒙皮的参数，参数的值通过一个accessor对象获得。animation：描述了一些节点如何随时间进行变换(比如旋转或平移)；accessor：一个访问任意数据的抽象数据源。被mesh、skin和animation元素使用来提供几何数据、蒙皮参数和基于时间的动画值。它通过引用一个bufferView对象，来引用实际的二进制数据；material：包含了定义3D对象外观的参数。它通常引用了用于3D对象渲染的texture对象；texture：定义了一个sampler对象和一个image对象。sampler对象定义了image对象在3D对象上的张贴方式。
更多详情，可查阅glTF2.0规范（https://github.com/KhronosGroup/glTF/tree/master/specification/2.0/）以及glTF官方教程（https://github.com/KhronosGroup/glTF-Tutorials/tree/master/gltfTutorial）
下面是一个最小巧的glTF格式文件的内容，它描述了一个简单的三角形。
{\n&34;:[\n{\n&34;:[0]\n}\n],\n\n&34;:[\n{\n&34;:0\n}\n],\n\n&34;:[\n{\n&34;:[{\n&34;:{\n&34;:1\n},\n&34;:0\n}]\n}\n],\n\n&34;:[\n{\n&34;:&34;,\n&34;:44\n}\n],\n&34;:[\n{\n&34;:0,\n&34;:0,\n&34;:6,\n&34;:34963\n},\n{\n&34;:0,\n&34;:8,\n&34;:36,\n&34;:34962\n}\n],\n&34;:[\n{\n&34;:0,\n&34;:0,\n&34;:5123,\n&34;:3,\n&34;:&34;,\n&34;:[2],\n&34;:[0]\n},\n{\n&34;:1,\n&34;:0,\n&34;:5126,\n&34;:3,\n&34;:&34;,\n&34;:[1.0,1.0,0.0],\n&34;:[0.0,0.0,0.0]\n}\n],\n\n&34;:{\n&34;:&34;\n}}
glTF相关工具推荐
glTF在线验证：http://github.khronos.org/glTF-Validator/浏览-Sketchfab：https://sketchfab.com/（需要注册账号，并且要上传模型才能浏览）浏览-PlayCanvas查看器：https://playcanvas.com/viewer浏览-ThreeJS查看器：https://gltf-viewer.donmccurdy.com/浏览-BabylonJS查看器：https://sandbox.babylonjs.com/gltf转glb：https://sbtron.github.io/makeglb/obj2gltf：https://github.com/CesiumGS/obj2gltfFBX2glTF：https://github.com/facebookincubator/FBX2glTFCOLLADA2GLTF：https://github.com/KhronosGroup/COLLADA2GLTF
Cesium加载glTF模型
Cesium提供了两种方式加载glTF模型，分别是通过EntityAPI和PrimitiveAPI两个API实现的。核心代码如下：
varposition=Cesium.Cartesian3.fromDegrees(-120.05,44,0);\nvarheading=Cesium.Math.toRadians(45);\nvarpitch=0;\nvarroll=0;\nvarhpr=newCesium.HeadingPitchRoll(heading,pitch,roll);\nvarorientation=Cesium.Transforms.headingPitchRollQuaternion(\nposition,\nhpr\n);\nvarmodel_entity=viewer.entities.add({\nname:&34;,\nposition:position,\n//默认情况下，模型是直立的并面向东。\n//通过Quaternion为Entity.orientation属性指定值来控制模型的方向，控制模型的航向，俯仰和横滚。\norientation:orientation,\nmodel:{\nshow:true,\nuri:&34;,\nscale:1.0,//缩放比例\nminimumPixelSize:128,//最小像素大小\nmaximumScale:20000,//模型的最大比例尺大小。minimumPixelSize的上限\nincrementallyLoadTextures:true,//加载模型后纹理是否可以继续流入\nrunAnimations:true,//是否应启动模型中指定的glTF动画\nclampAnimations:true,//指定glTF动画是否应在没有关键帧的持续时间内保持最后一个姿势\n\n//指定模型是否投射或接收来自光源的阴影type:ShadowMode\n//DISABLED对象不投射或接收阴影;ENABLED对象投射并接收阴影;CAST_ONLY对象仅投射阴影;RECEIVE_ONLY对象仅接收阴影\nshadows:Cesium.ShadowMode.ENABLED,\nheightReference:Cesium.HeightReference.NONE,\n},\n});\n//viewer.trackedEntity=entity;//相机保持在实体上
varorigin=Cesium.Cartesian3.fromDegrees(-120,44.0,0);\n//创建一个本地的东北向上坐标系，其原点为经度-120度，纬度44.0度。\n//可以随时更改模型的modelMatrix属性以移动或旋转模型。\nvarmodelMatrix=Cesium.Transforms.eastNorthUpToFixedFrame(origin);\nvarmodel=viewer.scene.primitives.add(\nCesium.Model.fromGltf({\nurl:&34;,\nmodelMatrix:modelMatrix,\nminimumPixelSize:128,\nmaximumScale:20000,\n})\n);\nmodel.readyPromise.then(function(model){\n//Playallanimationswhenthemodelisreadytorender\nmodel.activeAnimations.addAll();\n});
这里简单说一下modelMatrix属性，该属性类型是Matrix4，即4×4转换矩阵，用于将模型坐标转换为世界坐标，也就是为模型创建一个局部坐标系。正如示例中的代码那样，为模型创建了一个本地的东北向上坐标系，其原点为经度-120度，纬度44.0度。在Cesium调试器面板中勾选显示参考框架，能够很清晰地看到该模型对应的X、Y、Z轴以及原点。
好了，本文到此结束，如果可以帮助到大家，还望关注本站哦！