Three.js - 视图的宽度

IT技术 javascript three.js
2021-01-26 23:41:51

有没有办法找出场景渲染部分的宽度?

例如,如果我们有一个宽度为 100 的网格,但渲染时具有一定的缩放级别……我如何计算正在屏幕中渲染的网格部分的宽度?

2个回答

你必须在这里精确。

您可以计算出给定相机视野camera.fov和距离dist相机给定距离的可见矩形区域

由于对象可能具有深度,因此您必须通过网格选择一个平面,并在该距离处进行计算。

以下是如何计算可见距离height以及widthdist相机给定距离的方法。

var vFOV = THREE.MathUtils.degToRad( camera.fov ); // convert vertical fov to radians

var height = 2 * Math.tan( vFOV / 2 ) * dist; // visible height

var width = height * camera.aspect;           // visible width

三.js r.117

dist必须小于FAR,否则该位置将不可见。
2021-03-12 23:41:51
真的......我误解了,从dist发生的事情来看......在代码中看不到它值的先前定义,请描述,是什么distDtis = 远 - 近与否?谢谢!
2021-03-12 23:41:51
dist是与相机的距离。如果您需要帮助,请发新帖。谢谢你。
2021-03-30 23:41:51
@XåpplI'-I0llwlg'I- 谢谢。更新了答案。
2021-04-07 23:41:51
dist来自相机属性的 FAR 值的值吗?
2021-04-09 23:41:51

对于(完美的)球形物体,它将覆盖更多的近距离视图,因为您需要考虑切线,即您看不到“极点”。

对球形对象使用以下内容:

// we're using the following triangle: camera - tangent point on sphere - centre of sphere
var targetAngle = 2 * Math.asin(objectRadius / distanceToCamera);

var vFOV = THREE.Math.degToRad(this.fov);

var normalizedHeight = targetAngle / vFOV;

将此与您的视口宽度相乘以获得屏幕高度。对于宽度,您需要应用 hFOV - 请参阅:THREE.PerspectiveCamera 中无失真的 90 度视野