基于对象边界框的相机控件?

来自three.js的正常轨道控制对于圆形物体来说是完美的,但对于长物体不太好(特别是当缩放关闭时),我正在寻找解决方案来解决这个问题。

很难用文字来形容,请查看Google提供的这个webgl示例(最大可以查看):https://www.google.com/o3d/shopping/viewer/360?q =ymMBhK8fu3C&o3ds = use_3d 在这里输入图像描述

这是我正在寻找的顶视图插图: 在这里输入图像描述

我正在考虑基于默认OrbitControls的使用,从相机到边界框连续投射光线并保持恒定距离,但问题是相机总是在看物体的中心,与上例不同(凸轮仅在达到对象的角落)。

任何想法将不胜感激。


正如您所指出的那样,使用现有的THREE.OrbitControls并修改target不起作用,因为相机不会垂直于边界框。

我尝试了不同的事情,结果相当糟糕,但这是我的工作。
在我尝试的每个解决方案中,我总是必须计算(以任何顺序):

  • 相机的位置 ;
  • 相机的方向
  • 无论如何,相机必须围绕某物旋转 。 所以,我所有的解决方案或多或少都基于THREE.OrbitControls ,它充当了“当前的旋转状态”,并为我处理所有的DOM事件。


    查看AABB上的最近点

    这个想法如下:

  • 相机旋转;
  • AABB距离相机最近的点是相机应该看的方向(方向);
  • 使用一定的距离d将相机推离该点(位置)。
  • 有两种情况:

  • 边界

  • 角落

  • 测试这个(非常棘手)的小提琴。 仍然需要修复顶部和底部面(旋转奇点)。


    在边界卷上进行光线投射

    这是你在问题中描述的想法:

  • 创建相机应遵循的边界音量;
  • 在该BV上照相机位置;
  • 相机的新位置是交点 ;
  • 相机的新方向是相交脸部的法线
  • 我用带有圆角边框的细分盒子几何体进行试验,以便相机以角度旋转。

    考虑到表面的平滑性,结果可能非常方便。 不幸的是,当交叉点的法线发生变化时,摄像机会急剧改变方向,导致运动中出现令人不快的颠簸。

    看到这个(再棘手)小提琴。

    为了解决这个问题,我们可以沿着三角形线性插入法线,但是这需要以这样的方式计算法线,即顶点的每个法线是该顶点所属的面的法线的平均值。

    请注意,此解决方案非常繁重(对许多人脸进行光线投射),并且可能需要一些预处理来创建BV。


    改变经典轨道控制的基础

    这不是你正在寻找的东西,但它也适用于长对象,并且说实话,这是我做出的不那么棘手的解决方案。

    这个想法是修改经典的THREE.OrbitControls操作的基础,以便修改位置,但方向保持不变,如下所示:

    我有点用自定义版本: THREE.BasisOrbitControls 。 看看这个小提琴。

    var basis = new THREE.Matrix4();
    basis.makeScale(2.0, 3.0, 4.0); // my object is very long and a bit tall
    
    var controls = new THREE.BasisOrbitControl(camera, basis, renderer.domElement);
    

    请注意,摄像机的运动结果由椭球体来描述。


    希望这有助于我,我真的对一个干净的解决方案感兴趣。

    链接地址: http://www.djcxy.com/p/95345.html

    上一篇: Camera controls based on object bounding box?

    下一篇: annotationprocessor and apt configure equivalent