How to use a glTF material library concept?

The editor and my viewer do expect each file to contain a model, but I think you can use THREE.GLTFLoader directly to do this. For example:

var loader = new THREE.GLTFLoader();
loader.load( 'MaterialLibrary.gltf', ( gltf ) => {
  var parser = gltf.parser;
  console.log(parser.json.materials); // glTF definitions of materials
  parser.getDependency( 'material', 5 ).then(( material5 ) => {
    console.log(material5); // THREE.MeshStandardMaterial
  } );
}, undefined, (e) => console.error(e));

You may find it helpful to use userData (mesh.userData.*) to associate things. GLTFLoader will populate .userData on meshes and materials based on the .extras glTF field.

Finally, note that there are certain cases where a glTF file containing 1 material may translate to a three.js model containing 2+ materials. See https://github.com/mrdoob/three.js/blob/r99/examples/js/loaders/GLTFLoader.js#L2812.

1 Like