如何将 material 分配给 GLTF react-three-fiber
How to assign material to GLTF react-three-fiber
我已经成功地将一个 gltf 对象加载到我的 react-three-fiber 场景中。现在我想将 material 附加到我的模型。是否可以在此模型上使用标准 material?这是我尝试过的:
const Shape = (props) => {
const gltf = useLoader(GLTFLoader, GLTFfe)
const material = new THREE.MeshStandardMaterial({
color: 0xff0000,
transparent: false, opacity: 0.5
});
const object = new THREE.Mesh(gltf, material)
return <primitive object={object.scene} position={[0, 0, 0]} />
}
Is it possible to use standard material on this model?
使用 GLTFLoader
加载对象时,MeshStandardMaterial
是默认值 material。您可能不必创建新的 material,只需修改现有的即可。
由于 glTF 资产总是由对象层次结构组成,您需要这样做:
gltf.scene.traverse( function( object ) {
if ( object.isMesh ) {
object.material.color.set( 0xff0000 );
object.material.transparent = true;
object.material.opacity = 0.5;
}
} );
我找到了一个方法,有必要在加载你的 gltf 后改变一些东西,用 gltfjsx 将它转换为 jsx https://github.com/pmndrs/gltfjsx
我已经成功地将一个 gltf 对象加载到我的 react-three-fiber 场景中。现在我想将 material 附加到我的模型。是否可以在此模型上使用标准 material?这是我尝试过的:
const Shape = (props) => { const gltf = useLoader(GLTFLoader, GLTFfe)
const material = new THREE.MeshStandardMaterial({
color: 0xff0000,
transparent: false, opacity: 0.5
});
const object = new THREE.Mesh(gltf, material)
return <primitive object={object.scene} position={[0, 0, 0]} />
}
使用Is it possible to use standard material on this model?
GLTFLoader
加载对象时,MeshStandardMaterial
是默认值 material。您可能不必创建新的 material,只需修改现有的即可。
由于 glTF 资产总是由对象层次结构组成,您需要这样做:
gltf.scene.traverse( function( object ) {
if ( object.isMesh ) {
object.material.color.set( 0xff0000 );
object.material.transparent = true;
object.material.opacity = 0.5;
}
} );
我找到了一个方法,有必要在加载你的 gltf 后改变一些东西,用 gltfjsx 将它转换为 jsx https://github.com/pmndrs/gltfjsx