├── LICENSE
├── base.css
├── index.html
├── main.js
└── resources
├── dancer
├── Silly Dancing.fbx
├── dance.fbx
├── dancer.fbx
└── girl.fbx
├── negx.jpg
├── negy.jpg
├── negz.jpg
├── posx.jpg
├── posy.jpg
├── posz.jpg
├── readme.txt
├── rocket
├── Rocket_Ship_01.bin
└── Rocket_Ship_01.gltf
├── thing.glb
└── zombie
├── dance.fbx
├── idle.fbx
├── mremireh_o_desbiens.fbx
└── walk.fbx
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2020 simondevyoutube
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/base.css:
--------------------------------------------------------------------------------
1 | body {
2 | width: 100%;
3 | height: 100%;
4 | position: absolute;
5 | background: #000000;
6 | margin: 0;
7 | padding: 0;
8 | overscroll-behavior: none;
9 | }
10 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Three.JS Tutorial: Loading Models
5 |
6 |
7 |
8 |
9 |
11 |
12 |
13 |
--------------------------------------------------------------------------------
/main.js:
--------------------------------------------------------------------------------
1 | import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.118/build/three.module.js';
2 |
3 | import {FBXLoader} from 'https://cdn.jsdelivr.net/npm/three@0.118.1/examples/jsm/loaders/FBXLoader.js';
4 | import {GLTFLoader} from 'https://cdn.jsdelivr.net/npm/three@0.118.1/examples/jsm/loaders/GLTFLoader.js';
5 | import {OrbitControls} from 'https://cdn.jsdelivr.net/npm/three@0.118/examples/jsm/controls/OrbitControls.js';
6 |
7 |
8 | class BasicCharacterControls {
9 | constructor(params) {
10 | this._Init(params);
11 | }
12 |
13 | _Init(params) {
14 | this._params = params;
15 | this._move = {
16 | forward: false,
17 | backward: false,
18 | left: false,
19 | right: false,
20 | };
21 | this._decceleration = new THREE.Vector3(-0.0005, -0.0001, -5.0);
22 | this._acceleration = new THREE.Vector3(1, 0.25, 50.0);
23 | this._velocity = new THREE.Vector3(0, 0, 0);
24 |
25 | document.addEventListener('keydown', (e) => this._onKeyDown(e), false);
26 | document.addEventListener('keyup', (e) => this._onKeyUp(e), false);
27 | }
28 |
29 | _onKeyDown(event) {
30 | switch (event.keyCode) {
31 | case 87: // w
32 | this._move.forward = true;
33 | break;
34 | case 65: // a
35 | this._move.left = true;
36 | break;
37 | case 83: // s
38 | this._move.backward = true;
39 | break;
40 | case 68: // d
41 | this._move.right = true;
42 | break;
43 | case 38: // up
44 | case 37: // left
45 | case 40: // down
46 | case 39: // right
47 | break;
48 | }
49 | }
50 |
51 | _onKeyUp(event) {
52 | switch(event.keyCode) {
53 | case 87: // w
54 | this._move.forward = false;
55 | break;
56 | case 65: // a
57 | this._move.left = false;
58 | break;
59 | case 83: // s
60 | this._move.backward = false;
61 | break;
62 | case 68: // d
63 | this._move.right = false;
64 | break;
65 | case 38: // up
66 | case 37: // left
67 | case 40: // down
68 | case 39: // right
69 | break;
70 | }
71 | }
72 |
73 | Update(timeInSeconds) {
74 | const velocity = this._velocity;
75 | const frameDecceleration = new THREE.Vector3(
76 | velocity.x * this._decceleration.x,
77 | velocity.y * this._decceleration.y,
78 | velocity.z * this._decceleration.z
79 | );
80 | frameDecceleration.multiplyScalar(timeInSeconds);
81 | frameDecceleration.z = Math.sign(frameDecceleration.z) * Math.min(
82 | Math.abs(frameDecceleration.z), Math.abs(velocity.z));
83 |
84 | velocity.add(frameDecceleration);
85 |
86 | const controlObject = this._params.target;
87 | const _Q = new THREE.Quaternion();
88 | const _A = new THREE.Vector3();
89 | const _R = controlObject.quaternion.clone();
90 |
91 | if (this._move.forward) {
92 | velocity.z += this._acceleration.z * timeInSeconds;
93 | }
94 | if (this._move.backward) {
95 | velocity.z -= this._acceleration.z * timeInSeconds;
96 | }
97 | if (this._move.left) {
98 | _A.set(0, 1, 0);
99 | _Q.setFromAxisAngle(_A, Math.PI * timeInSeconds * this._acceleration.y);
100 | _R.multiply(_Q);
101 | }
102 | if (this._move.right) {
103 | _A.set(0, 1, 0);
104 | _Q.setFromAxisAngle(_A, -Math.PI * timeInSeconds * this._acceleration.y);
105 | _R.multiply(_Q);
106 | }
107 |
108 | controlObject.quaternion.copy(_R);
109 |
110 | const oldPosition = new THREE.Vector3();
111 | oldPosition.copy(controlObject.position);
112 |
113 | const forward = new THREE.Vector3(0, 0, 1);
114 | forward.applyQuaternion(controlObject.quaternion);
115 | forward.normalize();
116 |
117 | const sideways = new THREE.Vector3(1, 0, 0);
118 | sideways.applyQuaternion(controlObject.quaternion);
119 | sideways.normalize();
120 |
121 | sideways.multiplyScalar(velocity.x * timeInSeconds);
122 | forward.multiplyScalar(velocity.z * timeInSeconds);
123 |
124 | controlObject.position.add(forward);
125 | controlObject.position.add(sideways);
126 |
127 | oldPosition.copy(controlObject.position);
128 | }
129 | }
130 |
131 |
132 | class LoadModelDemo {
133 | constructor() {
134 | this._Initialize();
135 | }
136 |
137 | _Initialize() {
138 | this._threejs = new THREE.WebGLRenderer({
139 | antialias: true,
140 | });
141 | this._threejs.shadowMap.enabled = true;
142 | this._threejs.shadowMap.type = THREE.PCFSoftShadowMap;
143 | this._threejs.setPixelRatio(window.devicePixelRatio);
144 | this._threejs.setSize(window.innerWidth, window.innerHeight);
145 |
146 | document.body.appendChild(this._threejs.domElement);
147 |
148 | window.addEventListener('resize', () => {
149 | this._OnWindowResize();
150 | }, false);
151 |
152 | const fov = 60;
153 | const aspect = 1920 / 1080;
154 | const near = 1.0;
155 | const far = 1000.0;
156 | this._camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
157 | this._camera.position.set(75, 20, 0);
158 |
159 | this._scene = new THREE.Scene();
160 |
161 | let light = new THREE.DirectionalLight(0xFFFFFF, 1.0);
162 | light.position.set(20, 100, 10);
163 | light.target.position.set(0, 0, 0);
164 | light.castShadow = true;
165 | light.shadow.bias = -0.001;
166 | light.shadow.mapSize.width = 2048;
167 | light.shadow.mapSize.height = 2048;
168 | light.shadow.camera.near = 0.1;
169 | light.shadow.camera.far = 500.0;
170 | light.shadow.camera.near = 0.5;
171 | light.shadow.camera.far = 500.0;
172 | light.shadow.camera.left = 100;
173 | light.shadow.camera.right = -100;
174 | light.shadow.camera.top = 100;
175 | light.shadow.camera.bottom = -100;
176 | this._scene.add(light);
177 |
178 | light = new THREE.AmbientLight(0xFFFFFF, 4.0);
179 | this._scene.add(light);
180 |
181 | const controls = new OrbitControls(
182 | this._camera, this._threejs.domElement);
183 | controls.target.set(0, 20, 0);
184 | controls.update();
185 |
186 | const loader = new THREE.CubeTextureLoader();
187 | const texture = loader.load([
188 | './resources/posx.jpg',
189 | './resources/negx.jpg',
190 | './resources/posy.jpg',
191 | './resources/negy.jpg',
192 | './resources/posz.jpg',
193 | './resources/negz.jpg',
194 | ]);
195 | this._scene.background = texture;
196 |
197 | const plane = new THREE.Mesh(
198 | new THREE.PlaneGeometry(100, 100, 10, 10),
199 | new THREE.MeshStandardMaterial({
200 | color: 0x202020,
201 | }));
202 | plane.castShadow = false;
203 | plane.receiveShadow = true;
204 | plane.rotation.x = -Math.PI / 2;
205 | this._scene.add(plane);
206 |
207 | this._mixers = [];
208 | this._previousRAF = null;
209 |
210 | this._LoadAnimatedModel();
211 | // this._LoadAnimatedModelAndPlay(
212 | // './resources/dancer/', 'girl.fbx', 'dance.fbx', new THREE.Vector3(0, -1.5, 5));
213 | // this._LoadAnimatedModelAndPlay(
214 | // './resources/dancer/', 'dancer.fbx', 'Silly Dancing.fbx', new THREE.Vector3(12, 0, -10));
215 | // this._LoadAnimatedModelAndPlay(
216 | // './resources/dancer/', 'dancer.fbx', 'Silly Dancing.fbx', new THREE.Vector3(-12, 0, -10));
217 | this._RAF();
218 | }
219 |
220 | _LoadAnimatedModel() {
221 | const loader = new FBXLoader();
222 | loader.setPath('./resources/zombie/');
223 | loader.load('mremireh_o_desbiens.fbx', (fbx) => {
224 | fbx.scale.setScalar(0.1);
225 | fbx.traverse(c => {
226 | c.castShadow = true;
227 | });
228 |
229 | const params = {
230 | target: fbx,
231 | camera: this._camera,
232 | }
233 | this._controls = new BasicCharacterControls(params);
234 |
235 | const anim = new FBXLoader();
236 | anim.setPath('./resources/zombie/');
237 | anim.load('walk.fbx', (anim) => {
238 | const m = new THREE.AnimationMixer(fbx);
239 | this._mixers.push(m);
240 | const idle = m.clipAction(anim.animations[0]);
241 | idle.play();
242 | });
243 | this._scene.add(fbx);
244 | });
245 | }
246 |
247 | _LoadAnimatedModelAndPlay(path, modelFile, animFile, offset) {
248 | const loader = new FBXLoader();
249 | loader.setPath(path);
250 | loader.load(modelFile, (fbx) => {
251 | fbx.scale.setScalar(0.1);
252 | fbx.traverse(c => {
253 | c.castShadow = true;
254 | });
255 | fbx.position.copy(offset);
256 |
257 | const anim = new FBXLoader();
258 | anim.setPath(path);
259 | anim.load(animFile, (anim) => {
260 | const m = new THREE.AnimationMixer(fbx);
261 | this._mixers.push(m);
262 | const idle = m.clipAction(anim.animations[0]);
263 | idle.play();
264 | });
265 | this._scene.add(fbx);
266 | });
267 | }
268 |
269 | _LoadModel() {
270 | const loader = new GLTFLoader();
271 | loader.load('./resources/thing.glb', (gltf) => {
272 | gltf.scene.traverse(c => {
273 | c.castShadow = true;
274 | });
275 | this._scene.add(gltf.scene);
276 | });
277 | }
278 |
279 | _OnWindowResize() {
280 | this._camera.aspect = window.innerWidth / window.innerHeight;
281 | this._camera.updateProjectionMatrix();
282 | this._threejs.setSize(window.innerWidth, window.innerHeight);
283 | }
284 |
285 | _RAF() {
286 | requestAnimationFrame((t) => {
287 | if (this._previousRAF === null) {
288 | this._previousRAF = t;
289 | }
290 |
291 | this._RAF();
292 |
293 | this._threejs.render(this._scene, this._camera);
294 | this._Step(t - this._previousRAF);
295 | this._previousRAF = t;
296 | });
297 | }
298 |
299 | _Step(timeElapsed) {
300 | const timeElapsedS = timeElapsed * 0.001;
301 | if (this._mixers) {
302 | this._mixers.map(m => m.update(timeElapsedS));
303 | }
304 |
305 | if (this._controls) {
306 | this._controls.Update(timeElapsedS);
307 | }
308 | }
309 | }
310 |
311 |
312 | let _APP = null;
313 |
314 | window.addEventListener('DOMContentLoaded', () => {
315 | _APP = new LoadModelDemo();
316 | });
317 |
--------------------------------------------------------------------------------
/resources/dancer/Silly Dancing.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/dancer/Silly Dancing.fbx
--------------------------------------------------------------------------------
/resources/dancer/dance.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/dancer/dance.fbx
--------------------------------------------------------------------------------
/resources/dancer/dancer.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/dancer/dancer.fbx
--------------------------------------------------------------------------------
/resources/dancer/girl.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/dancer/girl.fbx
--------------------------------------------------------------------------------
/resources/negx.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/negx.jpg
--------------------------------------------------------------------------------
/resources/negy.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/negy.jpg
--------------------------------------------------------------------------------
/resources/negz.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/negz.jpg
--------------------------------------------------------------------------------
/resources/posx.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/posx.jpg
--------------------------------------------------------------------------------
/resources/posy.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/posy.jpg
--------------------------------------------------------------------------------
/resources/posz.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/posz.jpg
--------------------------------------------------------------------------------
/resources/readme.txt:
--------------------------------------------------------------------------------
1 | Author
2 | ======
3 |
4 | This is the work of Emil Persson, aka Humus.
5 | http://www.humus.name
6 |
7 |
8 |
9 | License
10 | =======
11 |
12 | This work is licensed under a Creative Commons Attribution 3.0 Unported License.
13 | http://creativecommons.org/licenses/by/3.0/
14 |
--------------------------------------------------------------------------------
/resources/rocket/Rocket_Ship_01.bin:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/rocket/Rocket_Ship_01.bin
--------------------------------------------------------------------------------
/resources/rocket/Rocket_Ship_01.gltf:
--------------------------------------------------------------------------------
1 | {
2 | "accessors" : [
3 | {
4 | "bufferView" : 0,
5 | "componentType" : 5123,
6 | "count" : 624,
7 | "max" : [ 623 ],
8 | "min" : [ 0 ],
9 | "name" : "buffer-0-accessor-indices-buffer-0-mesh-0",
10 | "type" : "SCALAR"
11 | },
12 | {
13 | "bufferView" : 2,
14 | "componentType" : 5126,
15 | "count" : 624,
16 | "max" : [ 3.294547080993652, 9.564169883728027, 3.294547080993652 ],
17 | "min" : [ -3.294547080993652, 0, -3.294547080993652 ],
18 | "name" : "buffer-0-accessor-position-buffer-0-mesh-0",
19 | "type" : "VEC3"
20 | },
21 | {
22 | "bufferView" : 2,
23 | "byteOffset" : 7488,
24 | "componentType" : 5126,
25 | "count" : 624,
26 | "max" : [ 1, 0.7847999930381775, 1 ],
27 | "min" : [ -1, -0.9914000034332275, -1 ],
28 | "name" : "buffer-0-accessor-normal-buffer-0-mesh-0",
29 | "type" : "VEC3"
30 | },
31 | {
32 | "bufferView" : 1,
33 | "componentType" : 5126,
34 | "count" : 0,
35 | "max" : [ 0, 0 ],
36 | "min" : [ 0, 0 ],
37 | "name" : "buffer-0-accessor-texcoord-buffer-0-mesh-0",
38 | "type" : "VEC2"
39 | },
40 | {
41 | "bufferView" : 3,
42 | "componentType" : 5126,
43 | "count" : 0,
44 | "max" : [ 0, 0, 0, 0 ],
45 | "min" : [ 0, 0, 0, 0 ],
46 | "name" : "buffer-0-accessor-color-buffer-0-mesh-0",
47 | "type" : "VEC4"
48 | },
49 | {
50 | "bufferView" : 0,
51 | "byteOffset" : 1248,
52 | "componentType" : 5123,
53 | "count" : 240,
54 | "max" : [ 239 ],
55 | "min" : [ 0 ],
56 | "name" : "buffer-0-accessor-indices-buffer-0-mesh-0",
57 | "type" : "SCALAR"
58 | },
59 | {
60 | "bufferView" : 2,
61 | "byteOffset" : 14976,
62 | "componentType" : 5126,
63 | "count" : 240,
64 | "max" : [ 1.958153963088989, 6.53810977935791, 1.958153963088989 ],
65 | "min" : [ -1.958153963088989, 0, -1.958153963088989 ],
66 | "name" : "buffer-0-accessor-position-buffer-0-mesh-0",
67 | "type" : "VEC3"
68 | },
69 | {
70 | "bufferView" : 2,
71 | "byteOffset" : 17856,
72 | "componentType" : 5126,
73 | "count" : 240,
74 | "max" : [ 0.9232000112533569, 0.1186000034213066, 0.9232000112533569 ],
75 | "min" : [ -0.9232000112533569, -1, -0.9232000112533569 ],
76 | "name" : "buffer-0-accessor-normal-buffer-0-mesh-0",
77 | "type" : "VEC3"
78 | },
79 | {
80 | "bufferView" : 1,
81 | "componentType" : 5126,
82 | "count" : 0,
83 | "max" : [ 0, 0 ],
84 | "min" : [ 0, 0 ],
85 | "name" : "buffer-0-accessor-texcoord-buffer-0-mesh-0",
86 | "type" : "VEC2"
87 | },
88 | {
89 | "bufferView" : 3,
90 | "componentType" : 5126,
91 | "count" : 0,
92 | "max" : [ 0, 0, 0, 0 ],
93 | "min" : [ 0, 0, 0, 0 ],
94 | "name" : "buffer-0-accessor-color-buffer-0-mesh-0",
95 | "type" : "VEC4"
96 | },
97 | {
98 | "bufferView" : 0,
99 | "byteOffset" : 1728,
100 | "componentType" : 5123,
101 | "count" : 1056,
102 | "max" : [ 1055 ],
103 | "min" : [ 0 ],
104 | "name" : "buffer-0-accessor-indices-buffer-0-mesh-0",
105 | "type" : "SCALAR"
106 | },
107 | {
108 | "bufferView" : 2,
109 | "byteOffset" : 20736,
110 | "componentType" : 5126,
111 | "count" : 1056,
112 | "max" : [ 2.062674045562744, 6.647388935089111, 2.062674045562744 ],
113 | "min" : [ -2.062674045562744, 0, -2.062674045562744 ],
114 | "name" : "buffer-0-accessor-position-buffer-0-mesh-0",
115 | "type" : "VEC3"
116 | },
117 | {
118 | "bufferView" : 2,
119 | "byteOffset" : 33408,
120 | "componentType" : 5126,
121 | "count" : 1056,
122 | "max" : [ 1, 1, 1 ],
123 | "min" : [ -1, -1, -1 ],
124 | "name" : "buffer-0-accessor-normal-buffer-0-mesh-0",
125 | "type" : "VEC3"
126 | },
127 | {
128 | "bufferView" : 1,
129 | "componentType" : 5126,
130 | "count" : 0,
131 | "max" : [ 0, 0 ],
132 | "min" : [ 0, 0 ],
133 | "name" : "buffer-0-accessor-texcoord-buffer-0-mesh-0",
134 | "type" : "VEC2"
135 | },
136 | {
137 | "bufferView" : 3,
138 | "componentType" : 5126,
139 | "count" : 0,
140 | "max" : [ 0, 0, 0, 0 ],
141 | "min" : [ 0, 0, 0, 0 ],
142 | "name" : "buffer-0-accessor-color-buffer-0-mesh-0",
143 | "type" : "VEC4"
144 | },
145 | {
146 | "bufferView" : 0,
147 | "byteOffset" : 3840,
148 | "componentType" : 5123,
149 | "count" : 480,
150 | "max" : [ 479 ],
151 | "min" : [ 0 ],
152 | "name" : "buffer-0-accessor-indices-buffer-0-mesh-0",
153 | "type" : "SCALAR"
154 | },
155 | {
156 | "bufferView" : 2,
157 | "byteOffset" : 46080,
158 | "componentType" : 5126,
159 | "count" : 480,
160 | "max" : [ 0.8525949716567993, 9.915228843688965, 0.8525949716567993 ],
161 | "min" : [ -0.8525949716567993, 0, -0.8525949716567993 ],
162 | "name" : "buffer-0-accessor-position-buffer-0-mesh-0",
163 | "type" : "VEC3"
164 | },
165 | {
166 | "bufferView" : 2,
167 | "byteOffset" : 51840,
168 | "componentType" : 5126,
169 | "count" : 480,
170 | "max" : [ 0.9239000082015991, 0.9775999784469604, 0.9239000082015991 ],
171 | "min" : [ -0.9239000082015991, -1, -0.9239000082015991 ],
172 | "name" : "buffer-0-accessor-normal-buffer-0-mesh-0",
173 | "type" : "VEC3"
174 | },
175 | {
176 | "bufferView" : 1,
177 | "componentType" : 5126,
178 | "count" : 0,
179 | "max" : [ 0, 0 ],
180 | "min" : [ 0, 0 ],
181 | "name" : "buffer-0-accessor-texcoord-buffer-0-mesh-0",
182 | "type" : "VEC2"
183 | },
184 | {
185 | "bufferView" : 3,
186 | "componentType" : 5126,
187 | "count" : 0,
188 | "max" : [ 0, 0, 0, 0 ],
189 | "min" : [ 0, 0, 0, 0 ],
190 | "name" : "buffer-0-accessor-color-buffer-0-mesh-0",
191 | "type" : "VEC4"
192 | },
193 | {
194 | "bufferView" : 0,
195 | "byteOffset" : 4800,
196 | "componentType" : 5123,
197 | "count" : 96,
198 | "max" : [ 95 ],
199 | "min" : [ 0 ],
200 | "name" : "buffer-0-accessor-indices-buffer-0-mesh-0",
201 | "type" : "SCALAR"
202 | },
203 | {
204 | "bufferView" : 2,
205 | "byteOffset" : 57600,
206 | "componentType" : 5126,
207 | "count" : 96,
208 | "max" : [ 1.929389953613281, 5.365962982177734, 1.92612898349762 ],
209 | "min" : [ -1.929389953613281, 0, -1.92612898349762 ],
210 | "name" : "buffer-0-accessor-position-buffer-0-mesh-0",
211 | "type" : "VEC3"
212 | },
213 | {
214 | "bufferView" : 2,
215 | "byteOffset" : 58752,
216 | "componentType" : 5126,
217 | "count" : 96,
218 | "max" : [ 1, 0, 1 ],
219 | "min" : [ -1, 0, -1 ],
220 | "name" : "buffer-0-accessor-normal-buffer-0-mesh-0",
221 | "type" : "VEC3"
222 | },
223 | {
224 | "bufferView" : 1,
225 | "componentType" : 5126,
226 | "count" : 0,
227 | "max" : [ 0, 0 ],
228 | "min" : [ 0, 0 ],
229 | "name" : "buffer-0-accessor-texcoord-buffer-0-mesh-0",
230 | "type" : "VEC2"
231 | },
232 | {
233 | "bufferView" : 3,
234 | "componentType" : 5126,
235 | "count" : 0,
236 | "max" : [ 0, 0, 0, 0 ],
237 | "min" : [ 0, 0, 0, 0 ],
238 | "name" : "buffer-0-accessor-color-buffer-0-mesh-0",
239 | "type" : "VEC4"
240 | }
241 | ],
242 | "asset" : {
243 | "generator" : "Obj2GltfConverter",
244 | "version" : "2.0"
245 | },
246 | "bufferViews" : [
247 | {
248 | "buffer" : 0,
249 | "byteLength" : 4992,
250 | "byteStride" : 0,
251 | "name" : "buffer-0-bufferview-ushort",
252 | "target" : 34963
253 | },
254 | {
255 | "buffer" : 0,
256 | "byteLength" : 1,
257 | "name" : "buffer-0-bufferview-vec2"
258 | },
259 | {
260 | "buffer" : 0,
261 | "byteLength" : 59904,
262 | "byteOffset" : 4992,
263 | "byteStride" : 12,
264 | "name" : "buffer-0-bufferview-vec3",
265 | "target" : 34962
266 | },
267 | {
268 | "buffer" : 0,
269 | "byteLength" : 1,
270 | "name" : "buffer-0-bufferview-vec4"
271 | }
272 | ],
273 | "buffers" : [
274 | {
275 | "byteLength" : 64896,
276 | "name" : "buffer-0",
277 | "uri" : "Rocket_Ship_01.bin"
278 | }
279 | ],
280 | "materials" : [
281 | {
282 | "doubleSided" : true,
283 | "name" : "F44336",
284 | "pbrMetallicRoughness" : {
285 | "baseColorFactor" : [ 0.956863, 0.262745, 0.211765, 1 ],
286 | "metallicFactor" : 0,
287 | "roughnessFactor" : 0.7448017359246658
288 | }
289 | },
290 | {
291 | "doubleSided" : true,
292 | "name" : "FFFFFF",
293 | "pbrMetallicRoughness" : {
294 | "metallicFactor" : 0,
295 | "roughnessFactor" : 0.7448017359246658
296 | }
297 | },
298 | {
299 | "doubleSided" : true,
300 | "name" : "455A64",
301 | "pbrMetallicRoughness" : {
302 | "baseColorFactor" : [ 0.270588, 0.352941, 0.392157, 1 ],
303 | "metallicFactor" : 0,
304 | "roughnessFactor" : 0.7448017359246658
305 | }
306 | },
307 | {
308 | "doubleSided" : true,
309 | "name" : "78909C",
310 | "pbrMetallicRoughness" : {
311 | "baseColorFactor" : [ 0.470588, 0.564706, 0.611765, 1 ],
312 | "metallicFactor" : 0,
313 | "roughnessFactor" : 0.7448017359246658
314 | }
315 | },
316 | {
317 | "doubleSided" : true,
318 | "name" : "80DEEA",
319 | "pbrMetallicRoughness" : {
320 | "baseColorFactor" : [ 0.501961, 0.870588, 0.917647, 1 ],
321 | "metallicFactor" : 0,
322 | "roughnessFactor" : 0.7448017359246658
323 | }
324 | }
325 | ],
326 | "meshes" : [
327 | {
328 | "name" : "buffer-0-mesh-0",
329 | "primitives" : [
330 | {
331 | "attributes" : {
332 | "NORMAL" : 2,
333 | "POSITION" : 1,
334 | "TEXCOORD_0" : 3
335 | },
336 | "indices" : 0,
337 | "material" : 0
338 | },
339 | {
340 | "attributes" : {
341 | "NORMAL" : 7,
342 | "POSITION" : 6,
343 | "TEXCOORD_0" : 8
344 | },
345 | "indices" : 5,
346 | "material" : 1
347 | },
348 | {
349 | "attributes" : {
350 | "NORMAL" : 12,
351 | "POSITION" : 11,
352 | "TEXCOORD_0" : 13
353 | },
354 | "indices" : 10,
355 | "material" : 2
356 | },
357 | {
358 | "attributes" : {
359 | "NORMAL" : 17,
360 | "POSITION" : 16,
361 | "TEXCOORD_0" : 18
362 | },
363 | "indices" : 15,
364 | "material" : 3
365 | },
366 | {
367 | "attributes" : {
368 | "NORMAL" : 22,
369 | "POSITION" : 21,
370 | "TEXCOORD_0" : 23
371 | },
372 | "indices" : 20,
373 | "material" : 4
374 | }
375 | ]
376 | }
377 | ],
378 | "nodes" : [
379 | {
380 | "mesh" : 0,
381 | "name" : "node-0"
382 | }
383 | ],
384 | "scenes" : [
385 | {
386 | "name" : "scene-0",
387 | "nodes" : [ 0 ]
388 | }
389 | ]
390 | }
391 |
--------------------------------------------------------------------------------
/resources/thing.glb:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/thing.glb
--------------------------------------------------------------------------------
/resources/zombie/dance.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/zombie/dance.fbx
--------------------------------------------------------------------------------
/resources/zombie/idle.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/zombie/idle.fbx
--------------------------------------------------------------------------------
/resources/zombie/mremireh_o_desbiens.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/zombie/mremireh_o_desbiens.fbx
--------------------------------------------------------------------------------
/resources/zombie/walk.fbx:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/simondevyoutube/ThreeJS_Tutorial_LoadingModels/04d5161a45c422ee14a94b6d05de0dcbfb7af1ea/resources/zombie/walk.fbx
--------------------------------------------------------------------------------