Блог

Главная - Вопросы по программированию - Изменение материала в React Three Fiber с помощью загрузчика FBX

Изменение материала в React Three Fiber с помощью загрузчика FBX

#reactjs #three.js #fbx #react-three-fiber

#reactjs #three.js #fbx #react-three-fiber

Вопрос:

Я пытаюсь изменить материал моего импортированного FBX-файла. Я могу легко изменить атрибуты материала, который уже прикреплен к моему файлу FBX, но я не могу изменить материал на мой предопределенный «matAluMedium». Я делал это раньше в другом проекте, но не могу понять, что я сделал не так на этот раз.

Надеюсь, вы сможете помочь

 init();

function init() {
  const cubeTexureloader = new CubeTextureLoader();

  envMap = cubeTexureloader.load([
    "assets/models/textures/envMap/px.jpg",
    "assets/models/textures/envMap/nx.jpg",
    "assets/models/textures/envMap/py.jpg",
    "assets/models/textures/envMap/ny.jpg",
    "assets/models/textures/envMap/pz.jpg",
    "assets/models/textures/envMap/nz.jpg",
  ]);

  matAluMedium = new MeshStandardMaterial({
    color: 0x98720b,
    roughness: 0.2,
    metalness: 1,
    envMap: envMap,
  });
}

function newFBX(props) {

  const fbx = useLoader(FBXLoader, "assets/models/"   props.path   ".fbx");
  fbx.traverse( function ( child ) {
    if ( child instanceof Mesh  ) {

      child.material = matAluMedium;
    }
    
  } );

  return 
        (<mesh>
          <primitive object={fbx} dispose={null} />
        </mesh>)
};

Комментарии:

1. правильный ли путь, вы уверены, что получаете «fbx»? вы пытались утешить. записать это? вы просматриваете его дочерние элементы и меняете материал, я никогда не использовал fbx, но я не понимаю, как это может не сработать. помимо этого я бы рекомендовал использовать gltf и инструмент gltfjsx. обход и мутация плохи, и возможность декларативного описания сцены имеет большое значение.

2. путь правильный, я вижу свой объект с материалами по умолчанию, предоставляемыми fbx. Я зарегистрировал его, и назначен правильный материал, но он не виден на моем холсте… Есть ли хороший учебник по использованию gltf? Я не могу заставить его работать, и большинство простых примеров из песочницы тоже не работают.

Ответ №1:

Итак, я нашел обходной путь для решения своей проблемы. Я не знаю почему, но когда я заменяю «traverse» на «foreach», это работает. Однако …? Может быть, кто-нибудь может объяснить мне, почему.

Это мой рабочий код:

 const fbx = useLoader(FBXLoader, "assets/models/"   props.path   ".fbx");
fbx.children.forEach((mesh, i) => {
  mesh.material = matAluBright;
});
Метки: