在threejs中使导入的模型适合屏幕

Question

我不想更改相机以适合模型。我更愿意知道给定位置的正确尺寸，以确保 model/geometry 缩放后会出现在屏幕上。

我不想移动相机，因为我可能有很多不同的对象。

想法？

Answer 1

您可能只想使用 scale="0.1 0.1 0.1" 或其他方式缩放模型。要自动执行此操作，请考虑编写一个新组件：

AFRAME.registerComponent('autoscale', {
  init: function () {
    var el = this.el;
    el.addEventListener('model-loaded', function (e) {
      var bbox = new THREE.Box3().setFromObject(e.detail.model);
      var scale = 1 / (bbox.max.x - bbox.min.x);
      el.setAttribute('scale', {
        x: scale,
        y: scale,
        z: scale,
      });
    });
  }
});

为了更稳健，您可能应该使用最大维度（x vs y vs z）进行缩放，但这是它的要点。

在threejs中使导入的模型适合屏幕

Make imported model fit screen in threejs

three.js

aframe