three.js 导入显示模型的时候自动计算模型缩放比例

最新推荐文章于 2024-01-25 11:22:08 发布

qq_37656005

最新推荐文章于 2024-01-25 11:22:08 发布

阅读量4.1k

点赞数

分类专栏： three.js vue 文章标签： vue three.js

本文链接：https://blog.csdn.net/qq_37656005/article/details/110133003

版权

vue 同时被 2 个专栏收录

10 篇文章 2 订阅

订阅专栏

three.js

4 篇文章 0 订阅

订阅专栏

three.js 导入显示模型的时候自动计算模型缩放比例

导入模型（以.stl文件为例），项目是用vue 做的，如果是html就把_this去掉

var _this = this;
var loader = new STLLoader();
            loader.load('模型地址', function (geometry) {
              geometry.center(); //居中显示
              var material = new THREE.MeshPhongMaterial({
                //*工件颜色
                color: 0xD0D0D0,
                //*文理颜色
                specular: 0x1b2266,
                shininess: 12
              });
              var mesh = new THREE.Mesh(geometry, material);
              mesh.castShadow = true;
              mesh.receiveShadow = true;
              _this.computeScale(mesh);
              // mesh.scale.set(0.02,0.02,0.02);
              _this.scene.add(mesh);
            });

计算缩放比例computeScale方法

  let _this = this;
  //显示模型的时候自动计算模型缩放比例
   //计算和世界轴对齐的一个对象 Object3D （含其子对象）的包围盒
   var bBox = new THREE.Box3().setFromObject(object);
   let height=bBox.max.y-bBox.min.y;
   var dist = height / (2 * Math.tan(_this.camera.fov * Math.PI / 360));
   console.log("模型缩放比例",50 / dist);
   object.scale.set(50 / dist, 50 / dist, 50 / dist);