屏幕到javascript webgl中的世界坐标

如何解决屏幕到javascript webgl中的世界坐标

| 我正在尝试使用以下代码（基于单击以放大WebGL）在我的数据中找到一个点（屏幕到世界坐标）：

    var world1 = [0,0] ;
    var world2 = [0,0] ;
    var dir    = [0,0] ;
    var w      = event.srcElement.clientWidth ;
    var h      = event.srcElement.clientHeight ;
    // calculate x,y clip space coordinates
    var x      = (event.offsetX-w/2)/(w/2) ;
    var y      = -(event.offsetY-h/2)/(h/2) ;
    mat4.inverse(pvMatrix,pvMatrixInverse) ;
    // convert clip space coordinates into world space
    mat4.multiplyVec4(pvMatrixInverse,[x,y,1],world1) ;

为简单起见，我设置了一系列顶点，其中z坐标始终为0： 我正在绘制的坐标：

0.0 0.0 0.0
1.0 1.0 0.0
1.0 0.0 0.0
0.0 1.0 0.0
0.5 0.5 0.0

然后，我将world1中的值与我的顶点进行比较。 world1中的值与我所单击的位置不匹配。有人能帮忙吗？     

解决方法

        请参阅如何从鼠标单击坐标获取WebGL 3d空间中的对象的类似答案。 TL; DR：我认为您的unproject功能不完整。看看jax / camera.js＃L568中的另一个实现源。另请参见glhUnProjectf C实现，前者（宽松地）基于该实现。 最后一件事。注意HTML canvas元素。通常，它不在您认为的位置，并且使像素位置准确的唯一方法是向上遍历DOM。有关示例，请参见jax / events.js＃L6和jax / events.js＃L100。或者使用jQuery

$(\'#canvas\').offset()

函数并完成它。 :)     ,        通常，当您“取消投影”一个像[x，y，z，1]这样的剪辑空间点时，您会在从视点发出的光线上得到一个点（在您的情况下，它穿过您单击的顶点）。 z的值将确定您在该射线上的位置。几乎可以保证您不会得到您点击的点。 因此，您要做的就是计算该光线（例如，通过取消投影[x，y，0,1]和[x，y，1,1]之类的两个点并计算未投影点所在的线），然后测试您的哪个顶点位于该射线上。 编辑：另外，您还要确保已将

world1

的前三个坐标除以第四个坐标。