multiple materials in one mesh

[ousc]

Hello, I have encountered a problem when using ngx-three. I am not sure whether it is my writing problem or ngx-three does not support this function. How to have multiple materials in a mesh, which can be used to make things like dice or Rubik's Cube.

A similar question from fiber: https://github.com/pmndrs/react-three-fiber/discussions/744

Writing in native three-js:

    let geometry = new THREE.BoxGeometry( 30,30, 30 );
    let cubeMaterials=[
        new THREE.MeshBasicMaterial({color:'red',side:THREE.DoubleSide}),
        new THREE.MeshBasicMaterial({color:'green',side:THREE.DoubleSide}),
        new THREE.MeshBasicMaterial({color:'blue',side:THREE.DoubleSide}),
        new THREE.MeshBasicMaterial({color:0Xffffff,side:THREE.DoubleSide}),
        new THREE.MeshBasicMaterial({color:0Xffffff,side:THREE.DoubleSide}),
        new THREE.MeshBasicMaterial({color:0Xffffff,side:THREE.DoubleSide})
    ]

    let cube = new THREE.Mesh( geometry, cubeMaterials );

It seems that neither the args input nor the fiber-like writing method works

[demike]

<th-mesh [args]="[geometry, [ basicMaterial1, basicMaterial2, basicMaterial3 ]]"></th-mesh>

should work.

But you are right:

<th-mesh>
    <th-meshPhongMaterial [color]="['#9C1E11']"></th-meshPhongMaterial>
    <th-meshPhongMaterial [color]="['#9C1E12]"></th-meshPhongMaterial>
    <th-meshPhongMaterial [color]="['#9C1E13']"></th-meshPhongMaterial>
</th-mesh>

Does not yet work. The material gets overwritten in that case. Will add a fix for that!

[ousc]

Thank you for your reply. It seems that it is indeed a problem with my writing method. I may have passed ThMaterial into the constructor by mistake, and I am also looking forward to a new way of writing.