Question

这可能是一个非常基本的问题。但我正在分散理解。我正在使用Three.js创建一个场景。相机如下

var camera = new THREE.PerspectiveCamera( 85, window.innerWidth/window.innerHeight, 0.1, 1000 ); camera.position.z = 5;

任何人都可以根据这些值解释x和y的范围。我发现-8> = x> = 8且-4> = Y> = 4。但是如何计算这些值？我正在努力争取基础知识。如果你也可以指出一些好文章，那就太好了。

提前致谢。

Answer 1

我的问题是要问一个透视相机仍然可以看到的世界空间中x，y坐标的范围。

在此之前，您必须首先了解现代3D渲染管道在幕后所做的事情。从本质上讲，您可以将其视为一组矩阵变换，将对象首先转换为世界空间，然后从世界空间转换为屏幕空间。

一个关键因素是视图投影矩阵，它将世界空间坐标[x，y，z]转换为“几乎”屏幕空间[x，y，z，w]，然后将x，y，z划分通过w得到[x / w，y / w，z / w]。结果坐标系的x = -1作为屏幕的左侧，x = +1作为屏幕的右侧，y = -1作为屏幕的底部，y = +1作为屏幕的顶部。

正如您可能猜到的那样，透视摄像机负责为您计算视图投影矩阵（可能，我不使用Three.JS）。矩阵的另一个不错的特性是你可以找到它的逆。也就是说，视图 - 投影矩阵的逆矩阵占据“几乎”的屏幕空间并将其转换回世界空间。所以，为了回答这个问题，你可以插入[-1，-1，z]作为屏幕的左下角，并通过视图 - 投影矩阵的逆转换它，并进行/ w除法，这将给你x，y的世界坐标，使对象出现在屏幕的左下角。

在伪代码中，它看起来像这样：

 vec3.toWorldSpace = function(out, v3, viewProjectionMatrix){
    var invViewProj = mat4.inverse(vec3._m, viewProjectionMatrix);
    var m = invViewProj;
    vec3.transformByMat(out, v3, m);
    var w = m[3] * x + m[7] * y + m[11] * z + m[15]; // required for perspective divide
    if (w !== 0){
        var invW = 1.0/w;
        out[0] *= invW;
        out[1] *= invW;
        out[2] *= invW;
    }

    return out;
};

Answer 2

经过一些试验和错误，我发现Three.js实际上将Objects.position.X作为世界坐标。

Xp = X /（ar Z tan（角度/ 2））

YP = Y /（Z * TAN（角度/ 2））

所有三位大师，如果我错了，请纠正我。

基于相机的三坐标坐标

2 个答案: