【问题标题】:Show Extents Algorithm?显示范围算法?
【发布时间】:2013-02-14 21:24:00
【问题描述】:
哦,伟大而知识渊博的堆栈溢出,我谦虚地请求您的伟大思想的帮助......
我正在使用三个js库,我需要实现一个“显示范围”按钮。它会将相机移动到一个位置,以使世界上的所有物体都在相机视图中可见(当然它们没有被阻挡)。
我可以找到世界上所有物体的边界框,比如说它们是 w0x,w0y,w0z 和 w1x,w1y,w1z
在给定这些限制的情况下,我如何放置相机以使其可以清楚地看到盒子的边缘?
显然,必须选择一个“侧面”来查看......我已经用谷歌搜索了一种算法,但无济于事!
谢谢!
【问题讨论】:
标签:
javascript
algorithm
graphics
rendering
three.js
【解决方案1】:
假设您选择了一张脸。并且您正在选择一个相机位置,以便相机的视线平行于其中一个轴。
假设脸部有一定的宽度“w”,假设您的相机有一个水平视野“a”。您要弄清楚的是距离相机应该看到整个宽度的脸部中心的距离“d”。
如果你把它画出来,你会发现你基本上有一个等腰三角形,它的底边长为 w,角为 a 在顶点。
不仅如此,顶角的角平分线形成两个相同的直角三角形,它的长度(到底边)是我们需要计算的距离。
三角函数告诉我们,角的切线是三角形的对边和相邻边的比率。所以
tan(a/2) = (w/2) / d
简化为:
d = w / 2*tan(a/2)
因此,如果您将相机放置在与您的边界框面之一的轴对齐距离处,那么您只需沿所选轴移动 d 距离。
一些注意事项,请确保您使用弧度作为 javascript trig 函数输入。此外,您可能需要再次计算您的面部高度和相机的垂直视野,如果您的面部不是方形的,则选择更远的距离。
如果您想从任意角度拟合边界框,您可以使用相同的方法 - 但首先您必须找到投影到垂直于相机视线平面上的场景的(对齐的)边界框