javascript Three.js - 视图的宽度

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13350875/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 18:31:30  来源:igfitidea点击:

Three.js - Width of view

javascriptthree.js

提问by Leprosy

Is there a way to find out the width of a rendered portion of the scene?

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

For example, if we have a mesh of width 100, but rendered with a certain level of zoom...how can I calculate the width of the portion of the mesh that is being rendered in the screen?

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

回答by WestLangley

You have to be precise here.

你必须在这里精确。

You can calculate the visible rectangular region given the camera's field-of-view, camera.fov, and a given distance, dist, from the camera.

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

Since the object presumably has depth, you have to pick one plane through the mesh, and do the calculation at that distance.

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

Here is how to calculate the visible heightand widthfor a given distance distfrom the camera.

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

var vFOV = THREE.Math.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

three.js r.87

三.js r.87

回答by René

For a (perfect) spherical object, it will cover more of the view close up as you need to take the tangent into account i.e. you can't see the 'poles'.

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

Use the following for a spherical object:

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

// 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;

Multiply this with your viewport width to get screen height. For width you need to apply hFOV - see: 90 degree field of view without distortion in THREE.PerspectiveCamera

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