javascript - 缩放时的透视投影问题

Question

我一直在使用 javascript 进行透视投影渲染演示，最近我添加了透视投影，它可以正常工作，除非我放大。

这是这种奇怪行为的图片:

注意网格线如何聚集在一个点上。

所以我怀疑另外两件事是我使用的缩放公式不正确，或者在透视投影数学中有一些我不理解的东西。

对于缩放，我只有一个全局变量 window.scaleFactor，我将它与每个点相乘:

Point.prototype.projection = function(matrix){
    var point = $M([[this.x *window.scaleFactor],[this.y * window.scaleFactor],[this.z * window.scaleFactor],[1]]);
    var projection = matrix.x(point);
    return new Point(projection.e(1,1)/projection.e(4,1) + window.panX,projection.e(2,1)/projection.e(4,1) + window.panY,0);
}

那么是这样吗，还是缩放计算应该和视角有关？

您可以在此处试用演示:http://ahmedkotb.0fees.net/3d/projection_demo.html

编辑:您可以使用鼠标滚轮缩放并通过在 Canvas 内拖动来旋转...另外我还没有测试过这个，除了在 chrome 上很抱歉。

任何插图将不胜感激，谢谢。

Answer 1

我认为问题如下:当你放大时，你的一些线到达相机后面并且你没有剪裁它们(线)。我能看到的伪像是典型的非裁剪投影。解决方案:剪辑您的线条，或使用另一个将为您剪辑的 3D 渲染库。