"buffers" : [
"uri" : "data:application/octet-stream;base64,AAABAAIAAAAAAAAAAAAAAAAAAAAAAIA/AAAAAAAAAAAAAAAAAACAPwAAAAA=",
"byteLength" : 44
"bufferViews" : [
"buffer" : 0,
"byteOffset" : 0,
"byteLength" : 6,
"target" : 34963
"buffer" : 0,
"byteOffset" : 8,
"byteLength" : 36,
"target" : 34962
"accessors" : [
"bufferView" : 0,
"byteOffset" : 0,
"componentType" : 5123,
"count" : 3,
"type" : "SCALAR",
"max" : [ 2 ],
"min" : [ 0 ]
"bufferView" : 1,
"byteOffset" : 0,
"componentType" : 5126,
"count" : 3,
"type" : "VEC3",
"max" : [ 1.0, 1.0, 0.0 ],
"min" : [ 0.0, 0.0, 0.0 ]
"asset" : {
"version" : "2.0"
然后引用类库里的gltfloader.dll,代码如下,生成的结果跟上面效果一致。
static void Main(string[] args)
Gltf gltf = new Gltf();
Scene scene = new Scene();
scene.Name = "test";
scene.Nodes = new int[1] { 0 };
gltf.Scenes = new Scene[1] { scene };
Node node = new Node();
node.Mesh = 0;
gltf.Nodes = new Node[1] { node};
Mesh mesh = new Mesh();
MeshPrimitive meshPrimitive = new MeshPrimitive();
meshPrimitive.Attributes = new Dictionary<string, int>();
meshPrimitive.Attributes.Add("POSITION", 1);
meshPrimitive.Indices = 0;
mesh.Primitives = new MeshPrimitive[1] { meshPrimitive };
gltf.Meshes = new Mesh[1] { mesh};
glTFLoader.Schema.Buffer buffer = new glTFLoader.Schema.Buffer();
buffer.Uri = "data:application/octet-stream;base64,AAABAAIAAAAAAAAAAAAAAAAAAAAAAIA/AAAAAAAAAAAAAAAAAACAPwAAAAA=";
buffer.ByteLength = 44;
gltf.Buffers = new glTFLoader.Schema.Buffer[1] { buffer };
BufferView bufferView1 = new BufferView();
bufferView1.Buffer = 0;
bufferView1.ByteOffset = 0;
bufferView1.ByteLength = 6;
bufferView1.Target = BufferView.TargetEnum.ELEMENT_ARRAY_BUFFER;
BufferView bufferView2 = new BufferView();
bufferView2.Buffer = 0;
bufferView2.ByteOffset = 8;
bufferView2.ByteLength = 36;
bufferView2.Target = BufferView.TargetEnum.ARRAY_BUFFER;
gltf.BufferViews = new BufferView[2] { bufferView1, bufferView2 };
Accessor accessor1 = new Accessor();
accessor1.BufferView = 0;
accessor1.ByteOffset = 0;
accessor1.ComponentType = Accessor.ComponentTypeEnum.UNSIGNED_SHORT;
accessor1.Count = 3;
accessor1.Type = Accessor.TypeEnum.SCALAR;
accessor1.Max = new float[1] { 2 };
accessor1.Min = new float[1] { 0 };
Accessor accessor2 = new Accessor();
accessor2.BufferView = 1;
accessor2.ByteOffset = 0;
accessor2.ComponentType = Accessor.ComponentTypeEnum.FLOAT;
accessor2.Count = 3;
accessor2.Type = Accessor.TypeEnum.VEC3;
accessor2.Max = new float[3] { 1.0f,1.0f,0.0f };
accessor2.Min = new float[3] { 0.0f,0.0f,0.0f };
gltf.Accessors = new Accessor[2] { accessor1,accessor2 };
Asset asset= new Asset();
asset.Version = "2.0";
gltf.Asset = asset;
Interface.SaveModel(gltf,"test.gltf");
Interface.Pack("test.gltf", "test.glb"); //将gltf转化为glb
3.2 第三方类库
SharpGLTF
3.3 几何数据
看着上面的url一阵懵逼,那我们能不能用我们能看懂的几何数据呢?
创建几何数据的方法(以创建一个三角形为例):
private static void CreateGeometry()
List<int> indexs = new List<int>() { 0, 1, 2,0 };
List<float> vertexs = new List<float>() { 0.0f, 0.0f, 0.0f,0.0f,0.0f,1.0f,1.0f,0.0f,1.0f };
using (FileStream f = File.Create("geometry.bin"))
using (BinaryWriter writer = new BinaryWriter(f))
foreach (var index in indexs)
writer.Write((short)index);
foreach (var vt in vertexs)
writer.Write(vt);
将上面的url改为
buffer.Uri ="geometry.bin"
并在导出gltf和glb之前引用上面的创建几何的方法。
其中索引里{0,1,2,0}中的最后一个0没什么意义,纯粹占位用的,需要保证索引的字节大小是4的倍数。
1、gltf的资料官方教程快速上手详细教程2、gltf查看工具windows系统自带的3D查看器3、C#生成gltf\glb的类库3.1 官方的类库github地址首先看快速上手里的一个最简单的gltf样例{ "scenes" : [ { "nodes" : [ 0 ] } ], "nodes" : [ ...
为了是自己绘制的图形或人物更加生动形象,可以采用纹理渲染的方式,通过外部绘图软件绘制素材,通过纹理映射的方式贴在OpenGL绘制的图形上。
关于纹理的资料,网上的大神很多,讲解的都很不错,引荐一位:OpenGL学习脚印: 二维纹理映射(2D textures),其理论讲解的很详细,重点关注一下纹理坐标。
在此我就不班门弄斧了,下面讲解一下我测试的代码:
float[] Light_Position = { 1.5f, -0.5f, -1.0f, 0f };
float[] L
1、 KhronosGroup/glTF-CSharp-Loader
https://github.com/KhronosGroup/glTF-CSharp-Loader
备注:竟然是根据gltf specification schema文件生成代码....
和我们的XX需求场景一样
2、微软的glTF-SDK
https://githu
这是glTF的C#参考加载器。 使用起来非常简单,就像Interface.LoadModel("PathToModel.gltf") 。 您可以通过导入“ glTF2Loader” NuGet程序包在项目中使用此加载器。 其他示例可以在gltfLoaderUnitTests项目中找到。
此解决方案要求访问glTF模式进行编译,并访问示例模型进行测试。 假定已将glTF和glTF-Sample-Models存储库克隆到与克隆glTF-CSharp-Loader存储库相同的根目录下。
repos
+-- glTF
| +-- README.md
+-- glTF-CSharp-Loader
| +-- README.md
+-- glTF-Sample-Models
| +-- README.md
要构建项目,请加载CSharp.sln解决方案。 点击“
总目录 >> threejs入门进阶到实战(目前已更新入门篇、基础篇和进阶篇)
5 buffer缓存、bufferView视窗、accesors访问器
buffer, bufferView,和 accessor 对象已经在**3、最小GLTF文件 **提到,本节将会详细解释它们的含义。
Buffers 缓存
缓冲区buffer表示原始二进制数据块,没有内在的结构或含义。缓冲区使用其u...
1.我们先下载这个源码包glTF-CSharp-Loader
网址在:https://github.com/KhronosGroup/glTF-CSharp-Loader
2.无法编译
下载后,你会发现,无法直接编译通过。
仔细阅读他的文档,他会告诉我们,需要先运行Generator项目,通过运行这个项目才会自动
CSharpGL(25)一个用raycast实现体渲染VolumeRender的例子
本文涉及的VolumeRendering相关的C#代码是从(https://github.com/toolchainX/Volume_Rendering_Using_GLSL)的C++代码转换来的。
CSharpGL已在GitHub开源,欢迎对OpenGL有兴趣的同学加入(https:...
当我们使用Cesium开发KML+GLTF模型表示动态的运动轨迹的时候总会用到gltf格式的模型,但是一般官方的模型库总是只有几个,不能够满足使用,这里整理了一套从数据下载到使用的全家桶套餐供各位看官享用。话不多说,上菜~
一、下载模型
二、下载安装模型转换需要的插件
三、模型开始导出
一、下载模型
注册3d66网站账号,登陆后直接【搜索】需要的模型名称,然后选择【免费】的模型
找到心仪的模型,点击进去后, 找到右侧的【立即下载】,然后选择【常规下载】
2.下载好后是一个max文
[TransactionAttribute(TransactionMode.Manual)]
[RegenerationAttribute(RegenerationOption.Manual)]
class FiltersPractise : IExternalCommand
public...
在Vue.js项目中,可以使用GLTFLoader.js加载gltf模型文件。要在Vue.js项目中使用GLTFLoader.js,需要将GLTFLoader.js添加到Vue项目中,并在vue.config.js文件中配置,以便webpack可以正确加载GLTF文件。
首先,将GLTFLoader.js添加到Vue项目中。可以通过npm安装GLTFLoader.js并将其添加到项目中:
npm install three-gltf-loader
然后,在Vue项目的入口文件(例如main.js)中导入GLTFLoader.js:
```javascript
import * as THREE from 'three';
import { GLTFLoader } from 'three-gltf-loader';
接下来,在vue.config.js文件中,将GLTFLoader.js添加到webpack配置中。在configureWebpack选项中添加以下内容:
```javascript
module.exports = {
configureWebpack: {
module: {
rules: [
test: /\.(glb|gltf)$/,
use: [
loader: 'file-loader',
options: {
outputPath: 'assets/models/'
resolve: {
alias: {
'three/GLTFLoader': 'three-gltf-loader'
这个配置告诉webpack,如果遇到.glb或.gltf文件,使用file-loader来加载文件,并将文件输出到assets/models目录中。它还将three/GLTFLoader别名设置为three-gltf-loader,以便在项目中使用GLTFLoader时引用正确的名称。
现在,可以在Vue项目中使用GLTFLoader.js来加载gltf模型文件。只需导入GLTFLoader并使用它来加载模型文件:
```javascript
import { GLTFLoader } from 'three-gltf-loader';
let loader = new GLTFLoader();
loader.load('/path/to/model.gltf', (gltf) => {
// 将模型添加到场景中
scene.add(gltf.scene);
注意,路径应该是相对于public目录的路径。如果model.gltf文件在public目录的assets/models子目录下,则路径应为/assets/models/model.gltf。