我正在尝试加载一个有ktx2纹理的glb。它似乎表明它不能加载纹理,但我不确定它试图从哪里加载它们,因为它们是glb的一部分,并且引用了正确的路径。
沙盒here
glb文件是来自threejs本身的示例文件here
相关代码:
import { Suspense } from 'react'
import { useLoader, Canvas } from '@react-three/fiber'
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader'
import { KTX2Loader } from 'three/examples/jsm/loaders/KTX2Loader'
import { MeshoptDecoder } from 'three/examples/jsm/libs/meshopt_decoder.module.js'
import faceUrl from './facecap.glb'
function FaceModel() {
const result = useLoader(GLTFLoader, faceUrl, (loader) => {
const ktxLoader = new KTX2Loader()
ktxLoader.setTranscoderPath('three/examples/js/libs/basis/')
loader.setKTX2Loader(ktxLoader)
loader.setMeshoptDecoder(MeshoptDecoder)
})
return <primitive object={result} />
}
export default function App() {
return (
<Suspense fallback={null}>
<Canvas>
<FaceModel />
</Canvas>
</Suspense>
)
}
1条答案
按热度按时间qxsslcnc1#
在React three Fiber中使用KTX2文件的最佳方法是使用
@react-three/drei
中的useKTX2挂钩,如下所示至于你的情况,我建议你只导出你的glb,不带任何纹理。从gltf.pmnd.rs生成React三纤维样板代码,并通过上述方法应用纹理。