Loadglb colorWrite

When executing the following code, there are times when colorWrite is set to false and times when it is not. I want to ensure that colorWrite is always set to false . If anyone knows how to achieve this, could you please share your advice?

const loadGLB = new Promise((resolve, reject) => {
gltfLoader.load(staticPath + ‘/booth2/OutlineModel.glb’, (gltf) => {
outlineModel = gltf.scene;
scene.add(outlineModel);

  outlineModel.traverse(child => {
    if (child.isMesh && child.material) {
      // マテリアルが配列の場合と単一の場合の両方に対応
      const materials = Array.isArray(child.material) ? child.material : [child.material];
      materials.forEach(material => {
        material.colorWrite = false;
      });
    }
  });
//   カメラの個数を調べる
const cameraObjects = gltf.scene.children.filter(child => child.name.startsWith('Camera'));

 // カメラの位置を配列に入れる
for(let i = 0; i < cameraObjects.length; i++){
    cameraPositions.push(cameraObjects[i].position)
}
 
 camera_position =  cameraPositions[0]

 camera.position.copy(camera_position)

 // レイキャストの対象を作成する
 raycast_object = []

//  cameraObjectsのy軸が0のところにカーソルポイントを置く
for (let i = 0; i < cameraObjects.length; i++) {
    let geometry = new THREE.CircleGeometry(0.4, 32);
    let material = new THREE.MeshBasicMaterial({color: 0xffff00, transparent: true, opacity: 1});
    let circle = new THREE.Mesh(geometry, material);
    circle.position.set(cameraObjects[i].position.x, 0, cameraObjects[i].position.z)
    // サークル裏向いてたんだろうな
    circle.rotation.x = -1 * (Math.PI / 2);
    circle.name = "Camera" + i
    circles.push(circle)
    raycast_object.push(circle)
    scene.add(circle);
}


outlineModel.traverse(child =>{
   if(!child.name.includes("Camera") && !child.name.includes("_") && !child.name.includes("Scene")){
       raycast_object.push(child)
   }
})

  resolve(camera_position);
}, undefined,  function(error) {
    reject(error); // エラーが発生した場合はrejectを呼び出す
  });

});

Your code looks reasonable to me. I would just note:

  1. GLTFLoader will never set child.material to an array in any recent three.js version
  2. It’s possible your glTF file might have things other than meshes, like lines or points, which have their own materials but child.isMesh would be false.

If the code is still not working, it may help to create a simple demo showing the problem, and allowing others to run the code.

I’m working on a demo where I’ve encountered an issue with the colorWrite property not being consistently applied. Sometimes it works as expected, and other times it doesn’t seem to have any effect. I’m also using the Outline Effect in my project, and I’m wondering if this could be contributing to the problem.

demosite
https://vexpo.jp/booth/booth2.html

I’m not sure what to look for in this demo, sorry.