I recently created two unique objects using Blender, each with their own distinct materials and textures applied through UV mapping. During the rendering process using CanvasRenderer from Three.js, I encountered an issue.
When I attempted to export the models, only one mesh was included in the resulting JSON file despite there being multiple materials present. This limitation is evident in my code snippet below:
var loader = new THREE.JSONLoader();
loader.load(myModelPath, function {
var material = geometry.materials[0];
material.morphTargets = true;
material.overdraw = true;
var mesh = new THREE.Mesh(geometry, material);
mesh.scale.set(50, 50, 50);
mesh.position.set(0, 0, 0);
scene.add(mesh);
});
By utilizing only the [0] material index, I observed that the second object inherited the material from the first object. Unfortunately, I have not discovered a method to implement multiple materials on a single mesh or export separate JSON files for each object directly from Blender.