代码之家  ›  专栏  ›  技术社区  ›  Carpetfizz

three.js从3d矢量转换为2d像素位置,解释z坐标

  •  0
  • Carpetfizz  · 技术社区  · 6 年前

    我引用 this 因此,post解释了如何将三维空间中的点转换为显示器上的实际像素位置。这是为了方便而复制的函数。

    function toScreenPosition(obj, camera)
    {
        var vector = new THREE.Vector3();
    
        var widthHalf = 0.5*renderer.context.canvas.width;
        var heightHalf = 0.5*renderer.context.canvas.height;
    
        obj.updateMatrixWorld();
        vector.setFromMatrixPosition(obj.matrixWorld);
        vector.project(camera);
    
        vector.x = ( vector.x * widthHalf ) + widthHalf;
        vector.y = - ( vector.y * heightHalf ) + heightHalf;
    
        return { 
            x: vector.x,
            y: vector.y
        };
    
    };
    

    我注意到了 vector.z 在使用 vector.project(camera) . 对于我的特殊设置, 向量z 是~0.8(对一般问题来说不是很重要)。

    那么,我该如何解释 向量z ?它实际上代表什么?

    1 回复  |  直到 6 年前
        1
  •  1
  •   WAFFO    6 年前

    vector.z 表示点在屏幕上的深度。对于像素或屏幕上的位置,深度并不重要,因为它不会影响 x y 在屏幕上的位置。所以向量的分量不是解的一部分,因此被忽略了。

    为什么不呢? 0 这是因为投影将顶点与相机矩阵相乘。假设相机的位置可以查看您所需的一切,而不是指向其他地方,则投影功能将在您和场景之间放置距离(即深度)。