- 引入MTLLoader 和 OBJLoader
import * as THREE from 'three';
import { MTLLoader } from 'three/examples/jsm/loaders/MTLLoader.js';
import { OBJLoader } from 'three/examples/jsm/loaders/OBJLoader';
- 渲染材质和模型
// 前面的创建场景 相机 灯光 之类的 ,这里不写了
// model_mtl:mtl文件地址 model_obj:obj文件地址
// 加载材质
const mtlLoader = new MTLLoader();
mtlLoader.load(model_mtl, (materials) => {
materials.preload(); // 预加载材质
// 加载 OBJ 模型
const objLoader = new OBJLoader();
objLoader.setMaterials(materials); // 设置加载的材质
objLoader.load(model_obj, (object) => {
scene.add(object); // 将模型添加到场景中
// 计算包围盒
const boundingBox = new THREE.Box3().setFromObject(object);
// 获取模型的长、宽、高
const size = new THREE.Vector3();
boundingBox.getSize(size); // size 包含模型的长宽高
const length = size.x*1000;
const height = size.y*1000;
const width = size.z*1000;
console.log(`x: ${size.x}, y: ${size.y}, z: ${size.z}`);
console.log(`模型的长: ${length}, 宽: ${width}, 高: ${height}`);
})
})
这里获取到size 里面包含 对应的x,y,z, 可根据 x:长,y:高,z:宽 的比例 根据实际情况 自行计算