Search code examples
three.jsshader

How to apply THREE.FlatShading on models loaded with JSONLoader()?


I'm loading a model with the JSONLoader() of three.js. Loading works fine, but the model looks kind of weird. I'm guessing the reason for that is that it automatically uses smooth shading instead of flat. I tried several ways to apply the flat shading, but none worked.
That's what i tried last:

loader.load("model.js", function(geometry, materials){
    var mat = new THREE.MeshFaceMaterial( materials );
    mat.shading = THREE.FlatShading;
    var object = new THREE.Mesh( geometry, mat);
    scene.add( object );
});

No matter what i'm trying, it's either smooth shading or producing errors.
Any ideas how it's done correctly?


Solution

  • In THREE.MeshFaceMaterial( materials ), materials is an array.

    You need to apply the shading style to each element of that array, like so:

    materials[ i ].shading = THREE.FlatShading;
    

    three.js r.63