Estoy trabajando en A-Frame con un modelo 3D importado de Blender. Múltiples mallas de este modelo tienen 2 o más materiales asignados.
Puedo cambiar las propiedades del material de las mallas que tienen solo 1 material
Sin embargo, cuando se trata de cambiar las propiedades del material de las mallas que tienen más de un material, me encuentro con el siguiente problema:
"Error de tipo no detectado: no se pueden establecer propiedades de indefinido (estableciendo 'opacidad')"
El código que estoy usando es el siguiente:
<script> AFRAME.registerComponent('modify-materials', { init: function () { // Wait for model to load. this.el.addEventListener('model-loaded', () => { // Grab the mesh / scene. const obj = this.el.getObject3D('mesh'); // Go over the submeshes and modify materials we want. obj.traverse(node => { if (node.name.indexOf('muros') !== -1) { node.material.opacity = 1; } }); }); } }); </script>Supuse que la solución iba a ser tan simple como tratar los materiales como una matriz, pero no funcionó:
node.material[0].opacity = 1; node.materials[0].opacity = 1;También he buscado cómo iterar entre las identificaciones de los materiales, pero no he tenido éxito.
¿Alguien podría ayudarme a entender cómo puedo acceder a los materiales 2,3,4,n?
Cada nodo de mesh debe tener un solo material . Por lo tanto, probablemente debería buscar por el nombre del material y modificar los que coincidan:
obj.traverse(node => { if (node.material.name === "material_one") { node.material.opacity = 1; } else { node.material.opacity = 0.5; } });Recuerdo haber hecho algo similar, échale un vistazo aquí . Conociendo el nombre del material, puede modificar sus propiedades ( como aquí ):
<a-entity gltf-model="./model.gltf" material-modifier__MaterialName="emissive: 0xffff00" material-modifier__AnotherMaterialName="color: 0xff00ff" ></a-entity>