javascriptthree.jsobjloader

Multiple material on single obj file with three.js

I'm using three.js to load an obj file, a ring with some pearls. I haven't got an mtl file, as the software we use to export the obj (rhinoceros(?)) won't generate it with an obj file (this is what I was told by the graphic designer).

I need to set a metallic material ONLY for the ring, and glass material ONLY for the stone/pearls.

This is a link to the test page where I actually load the file: jaaxlab.com/test_youring

...for the rest I don't know how to set a single material and also multiple.

Link to obj file jaaxlab.com/test_youring/obj/prova1.obj

Solution

  • Your object has several children. The child with index 0 is the ring. Also, its name is sezione_B_misura13_Riviera_mix_full anello_sezione_B_misura13.

    So, you can access it like:

    obj.children[0].material = new THREE.MeshStandardMaterial(...);

    or

    obj.getObjectByName('sezione_B_misura13_Riviera_mix_full anello_sezione_B_misura13').material = new THREE.MeshStandardMaterial(...);

    Given that obj is the object, loaded with you loader.

    Take a look at this jsfiddle. Load your file, then check the console log. You can also click any part of the object and see its id and name in the console.