Learn Three.js for 3D Computer Graphics/

...

Animations with External Models: glTF and FBX Model

Get to know different types of external models to create animations and how to use glTF and FBX models in Three.js.

We'll cover the following...

Creating animations using external models
Using gltfLoader
- Example: Animate the glTF model
Visualizing motions captured models using fbxLoader
- Example: Animate the FBX model

Creating animations using external models

We looked at several 3D formats that are supported by Three.js. A couple of those formats also support animations. In this chapter, we’ll look at the following examples:

COLLADA model: The COLLADA format has support for animations. For this example, we’ll load an animation from a COLLADA file and render it with Three.js.
MD2 model: The MD2 model is a simple format used in the older Quake engines. Even though the format is a bit dated, it is still a very good format for storing character animations.
glTF models: GL transmission format (glTF) is a format specifically designed for storing 3D scenes and models. It focuses on minimizing the size of the assets and ...

Introduction to the Course

Part 1: Getting Up and Running

Creating the First 3D Scene with Three.js

The Basic Components That Make Up a Three.js Application

Working with Light Sources in Three.js

Part 2: Working with the Three.js Core Components

Working with Three.js Materials

Learning to Work with Geometries

Exploring Advanced Geometries

Points and Sprites

Part 3: Particle Clouds, Loading, and Animating Models

Creating and Loading Advanced Meshes and Geometries

Animation and Moving the Camera

Loading and Working with Textures

Part 4: Post-Processing, Physics, and Sounds

Render Post-Processing

Adding Physics and Sounds to Our Scene

Working with Blender and Three.js

Three.js: Together with React, TypeScript, and WebXR

Conclusion

Appendix

Animations with External Models: glTF and FBX Model

Creating animations using external models