【发布时间】:2018-04-05 23:43:45
【问题描述】:
使用 OBJLoader 和 MTLLoader,我正在尝试将从 Internet 下载的低多边形汽车模型加载到我的 Three.JS 场景中。这个模型甚至没有纹理。然而,虽然我确实看到了模型,但我没有看到上面的材料(屏幕截图中的右车)。我在 Blender 中打开了 .obj 文件,我确实在 Cycles 渲染中看到了低多边形汽车的颜色。
材质被加载,因为当我console.logObjMtlLoader.load返回的值(见下面的代码)时,我可以看到材质名称,颜色值对应于存在的内容在 MTL 文件中。
老实说,我不完全确定这是OBJLoader 或MTLLoader 的问题,因为我尝试了ColladaLoader(屏幕截图上的左车),它也没有显示材料,除了轮子。
我想知道,鉴于这种有限的背景,您是否对可能的原因有任何线索。我会更深入地研究这个问题,但我已经每天工作 10 个小时,包括周末。我想如果没有任何效果,我会尝试手动创建材料。
下面是一段代码:
// obj-mtl-loader.ts
export class ObjMtlLoader {
private objLoader: THREE.OBJLoader = new THREE.OBJLoader();
private mtlLoader: THREE.MTLLoader = new THREE.MTLLoader();
constructor(basePath?: string) {
if (basePath) {
this.objLoader.setPath(basePath);
this.mtlLoader.setPath(basePath);
}
}
public load(objFile: string, mtlFile: string): Promise<THREE.Group> {
return new Promise((resolve, reject) => {
this.mtlLoader.load(
mtlFile,
(materialCreator) => {
materialCreator.preload();
this.objLoader.setMaterials(materialCreator);
this.objLoader.load(
objFile,
(model) => {
resolve(model);
},
() => {},
(reason) => reject(reason)
);
},
() => {},
(reason) => reject(reason)
);
});
}
}
这是一个示例用法:
// renderer.ts
new ObjMtlLoader().load(
'/assets/racing/car_model/Low-Poly-Racing-Car.obj',
'/assets/racing/car_model/Low-Poly-Racing-Car.mtl'
).then((car) => {
this.SCENE.add(car);
});
这是一个截图:
【问题讨论】:
标签: typescript three.js