Trying to figure out why the geometry loaded with OBJLoader cannot be smoothly shaded.
var loader = new THREE.OBJLoader(manager);
loader.load('/manmodel/js/man.obj', function (object, materials) {
console.log(object);
console.log(materials);
man = object;
man.traverse(function (child) {
if (child instanceof THREE.Mesh) {
child.geometry.computeFaceNormals();
child.geometry.computeVertexNormals( true );
child.material = new THREE.MeshPhongMaterial({
color: 'white',
shading: THREE.SmoothShading // <----------- THIS IS THE PROBLEM
});
}
});
man.position.y = -10;
scene.add(man);
});
This is what I found:
If I remove the line computeFaceNormals(), the model renders the same. If I remove computeVertexNormals( true ), the object renders with no lighting (black) - indicating it is having an effect.
Changing the color attribute of the MeshPhongMaterial in this code does change the color, so that functionality works.
Attempts to use vertex and normal helpers failed because faces and vertices are not stored as arrays in BufferGeometry.
Modifying the man.obj file by changing 's' values from 'off' to 1 had no impact.
Since I will be loading multiple .obj files for different human figures generated in Blender, each around 2MB, I prefer to handle shading on the browser rather than increasing file size by "baking" it into the file.
THE QUESTION(s): Am I overlooking something here? OR, Is there a way to load the .obj file as standard Geometry, compute normals, apply shading, and then save as BufferGeometry?
ps. Normals may also be needed for ray tracing in the future.