如何将png纹理应用于具有React 3/光纤的glTF模型

Question

我正在尝试将一个纹理映射( png )应用到我的glTF模型中。我只是不知道怎么做。目前，我可以通过以下操作正确导入glTF模型：

import { useGLTF } from "@react-three/drei";
const Scene = () => {
const gltf = useGLTF('*path*');
    return (
        <>
            <primitive object={gltf.scene} />
        </>
    );
};

我也可以通过这样做得到巴布亚新几内亚的一个领域：

import { useTexture } from "@react-three/drei";
const Scene = () => {
    const texture = useTexture('*path*');
    return (
        <>
            <mesh>
                <sphereBufferGeometry attach="geometry" args={[1, 32, 32]} />
                <meshStandardMaterial attach="material" map={texture} />
            </mesh>
        </>
    );
};

如何将纹理应用到模型中？我试图用<sphereBufferGeometry attach="geometry" args={[1, 32, 32]} />替换<primitive object={gltf.scene} />，但这是行不通的。我正在使用TSX而不是JSX。

谢谢大家提前！

Answer 1

我找到了一个简单的解决办法。我没有分别导入GLTF和动画文件，而是将它们合并到一个GLB文件中。我用这个网站来组合文件。https://sbtron.github.io/makeglb/