通常 我們 glb/gltf里面都是非常大的場景
有些工具 它會因為過大做了壓縮 導致 我們開始是用不了的
我們可以官網(wǎng)搜索 draco
如下圖選擇
這是個解壓工具 用在我們各種的3D建模軟件中
大部分是通用的
我們先在代碼中導入工具
//導入draco解碼察
import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader.js";
我們在項目根目錄中 找到 node_modules下的 three
然后在 其中打開 examples 下面有一個 jsm
在下面找到 libs
下面的 draco 就是我們要的東西
將這個包 復制到我們自己的靜態(tài)資源目錄下
然后 我們編寫代碼如下
// 實例化加載器g1tf
const gltfLoader = new GLTFLoader();
// 實例化加較器draco
const dracoloader = new DRACOLoader();
dracoloader.setDecoderPath("/draco/");
gltfLoader.setDRACOLoader(dracoloader);
gltfLoader.load(
"gltf/glb路徑",
(gltf) =>{
gltf.scene.traverse((child) => {
if (child.isMesh) {
child.frustumCulled = false;
child.castShadow = true;
child.material.emissive = child.material.color;
child.material.emissiveMap = child.material.map;
}
});
scene.add(gltf.scene);
}
)
主要就是 DRACOLoader 創(chuàng)建一個解壓器
然后 setDecoderPath 指明draco解壓工具的路徑文章來源:http://www.zghlxwxcb.cn/news/detail-853084.html
然后 GLTFLoader 構建的對象 我們這里叫 gltfLoader 用setDRACOLoader 指定解壓方式 dracoloader
這樣 資源就可以加載出來了文章來源地址http://www.zghlxwxcb.cn/news/detail-853084.html
到了這里,關于WEB 3D技術 three.js draco解壓器 解決 壓縮后的gltf/glb報錯 Error: THREE.GLTFLoader: No DRACOLoader instance pravid的文章就介紹完了。如果您還想了解更多內容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持TOY模板網(wǎng)!