A minimal, engine-agnostic JavaScript glTF Loader, with a raw WebGL 2 simple renderer example using the loader.
import {vec3, vec4, quat, mat4} from 'gl-matrix';
var MinimalGLTFLoader = require('build/minimal-gltf-loader.js');
var glTFLoader = new MinimalGLTFLoader.glTFLoader();
glTFLoader.loadGLTF(url, function(glTF){
//...
});- Accessors
- Progressive loading / rendering
- Buffers
- BufferViews
- Images
- Meshes
- Nodes
- Primitives
- Samplers
- Textures
-
Shader Loader(not part of the core of glTF 2.0) - Animations
- Cameras
- Materials
- Skins
- glTF (.gltf) with separate resources: .bin (geometry, animation, skins), .glsl (shaders), and image files
- glTF (.gltf) with embedded resources
- Binary glTF (.glb) using the KHR_binary_glTF extension
- WebGL 2 simple renderer
- baseColorFactor
- baseColorTexture
- normalTexture
- Skybox
- PBR
- Animation
- Interpolations
- LINEAR
- STEP
- CATMULLROMSPLINE
- CUBICSPLINE
- Skin
- Camera (from glTF)
- Progressive rendering (No plan for this)
- Occlusion Culling experiment
- Bounding Box
- AABB (Axis Aligned Bounding Box, *static)
- OBB (Object/Oriented Bounding Box)
- Scene Bounding Box (fast iterated) And auto centered and scaled
- Build octree
- Occlusion Query with hierarchy
- Bounding Box
- glTF sample Model and Buster Drone By LaVADraGoN
- Great thanks to Trung Le (@trungtle) and Patrick Cozzi (@pjcozzi) for contributing and advising.
- gl-Matrix by Brandon Jones (@toji) and Colin MacKenzie IV (@sinisterchipmunk)
- glTF-WebGL-PBR
A minimal, engine-agnostic TypeScript glTF Loader.
This loader is a new instance of the minimal-gltf-loader.
In this branch, the author updated the loading file fuction from XMLHttpRequest to fetch API and used Promise and async/await to make loading procedure much more clearer.
In glTF 2.0 standard, the target attribute on bufferView is optional. Different 3D softwares have different interpretation of glTF exporter. For instance, the glTF files exported by Cinema4D have filled target attribute, but those exported by Blender 2.80+ will NOT have the target attribute filled. (Can see the issue in the following link: KhronosGroup/glTF-Blender-IO#142) Therefore, before binding buffer, the loader should infer the target attribute is whether ARRAY_BUFFER or ELEMENT_ARRAY_BUFFER accoring to the usage of bufferview.
import {vec3, vec4, quat, mat4} from 'gl-matrix';
import {GLTFLoader, GLTF} from './src/glTFLoader.ts'
let gl : WebGLRenderingContext | WebGL2RenderingContext;
new GLTFLoader(gl).loadGLTF('YourURL').then((glTF: GLTF) => {
// Create with glTF object, and proceed rendering process...
}).catch (() => {
// Error control...
});
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent
