three.js obj模型的mtl材质贴图不显示
·
在加载成功后模型会显示黑色或者白色模块,但是mtl文件是加载成功的,如果在mtl中使用了纹理贴图,需要在mtl文件中修改一下纹理贴图的路径(不只是需要mtl文件,还需要贴图文件),这里的路径是图片的相对路径。
loadObjWithMtl(scene) {
const that = this;
const assetsUrl = process.env.BASE_URL + process.env.VUE_APP_ASSETS;
const path = assetsUrl + "/model/";
const objName = "方体.obj";
const mtlName = "方体.mtl";
initModel();
function initModel() {
try {
var mtlLoader = new MTLLoader();
mtlLoader.resourcePath = path;
mtlLoader.path = path;
// 设置构造材质的一些选项。
// mtlLoader.setMaterialOptions({
// side: THREE.DoubleSide,
// wrap: THREE.MirroredRepeatWrapping,
// normalizeRGB: false,
// ignoreZeroRGBs: false,
// invertTrProperty: false
// });
mtlLoader.load(mtlName, function (materials) {
materials.preload();
var objLoader = new OBJLoader();
objLoader.setMaterials(materials);
// 设置由 MTLLoader 载入的材质,或是其它由 MTLLoader.MaterialCreator 提供的材质。
// materials.setMaterialOptions({
// side: THREE.DoubleSide
// });
objLoader.setPath(path);
objLoader.load(objName, function (obj) {
console.log(obj.children);
obj.children.map(item => {
item.geometry.center();
item.scale.set(100, 100, 100);
item.castShadow = true;
item.receiveShadow = true;
});
console.log(scene);
scene.add(obj)
});
});
} catch (e) {
console.error("解析失败", e);
}
}
}
效果图:
更多推荐
已为社区贡献6条内容
所有评论(0)