Progress
1. Load .dae models
2. Correct the mistakes in the models
3. Add collision and shadow on the model
4. Revise the height of the particle system
5. Add loading screen
Challenges
1. Fail to load a .dae model, cannot map them with a texture.
The export setting of the .dae model in blender was wrong. I found the answer here. the right setting should be:
The export setting of the .dae model in blender was wrong. I found the answer here. the right setting should be:
2. Some faces are missing after exporting. Miss all the inside faces of the walls. See the image below:
Because the normals of those faces are inverse. Open the edit mode in blender, "Control + Tab" Select Mode pick "faces", press "N" to show the right menus, find normals,
Then select the faces, and flip the normals. Left hand side menu: Shading / UV -> Normals -> Flip Direction
The model will be like this after exporting:
3. Texture issues
UV map mistakes:
To fix it, move the faces back into the texture image.
These mistakes on the model are hard to notice in the blender until you load it into three.js, because it looks just fine inside the blender.
Text books
These mistakes on the model are hard to notice in the blender until you load it into three.js, because it looks just fine inside the blender.
Text books
Game Development with Three.js
Author: Sukin, Isaac
link: http://site.ebrary.com/lib/univflorida/detail.action?docID=10789470
Author: Sukin, Isaac
link: http://site.ebrary.com/lib/univflorida/detail.action?docID=10789470
beginning Blender: Open Source 3D Modeling, Animation, and Game Design
Author: Lance Flavell
link:http://link.springer.com/book/10.1007%2F978-1-4302-3127-1
Author: Lance Flavell
link:http://link.springer.com/book/10.1007%2F978-1-4302-3127-1
Learning Three.js – the JavaScript 3D Library for WebGL
Author: Dirksen, Jos
And a lot of online resources see here
P.s The project is built based on Sukin, Isaac 's demo.
Software
