在WebGL中设置正交俯视投影

我在这里研究了这个例子：

正在使用的矩阵库是：

所以这个例子是在剪辑空间中，我理解这一点。我想以这个例子为基础建立一个正交投影。正交投影的中心应该在0,0,0，眼睛位置在+Z的某个位置，向下看0,0,0。在缓冲区中输入三维面的坐标时，我希望能够以模型空间单位输入这些坐标。例如，对于我的地图展示，我有一个10000立方x-5000到+5000 y-5000到+5000和z-5000到+5000的面积，将投影到500 x 500的画布上。因此，我的3d面将在10000个立方体内的某个位置有坐标，500 x 500画布将显示所有10000个立方体

---

这与CAD程序用于启动草图的投影相同。有人知道如何使用glMatrix库在WebGL中执行此操作吗？我是WebGL新手，我真的可以在这个主题上使用一些指导。

为了简单起见，首先应该将摄影机变换矩阵与其投影矩阵分开。然后可以将它们相乘，得到“视图投影矩阵”，该矩阵将世界空间坐标转换为屏幕空间

var cam = mat4.create();
var proj = mat4.create();

开始放置相机（cam矩阵）

设置超视距投影（投影矩阵）。可以看到正交投影，就像一个与摄影机对齐的长方体，可以使用六个参数展开每个边。盒子里的所有东西都会显示在屏幕上

var ratio = screenWidth/screenHeight;
var halfWorldWidth = 5000.0;

// the near/far will depend on your camera position
mat4.ortho( proj,
  -halfWorldWidth,
  halfWorldWidth,
  -halfWorldWidth / ratio,
  halfWorldWidth  /ratio,
  -50,
  50
)

最后得到视图投影

var view     = mat4.create()
var viewProj = mat4.create()

mat4.invert( view, cam );
mat4.multiply( viewProj, lens, view );

---

为了简单起见，首先应该将摄影机变换矩阵与其投影矩阵分离。然后可以将它们相乘，得到“视图投影矩阵”，该矩阵将世界空间坐标转换为屏幕空间

var cam = mat4.create();
var proj = mat4.create();

开始放置相机（cam矩阵）

设置超视距投影（投影矩阵）。可以看到正交投影，就像一个与摄影机对齐的长方体，可以使用六个参数展开每个边。盒子里的所有东西都会显示在屏幕上

var ratio = screenWidth/screenHeight;
var halfWorldWidth = 5000.0;

// the near/far will depend on your camera position
mat4.ortho( proj,
  -halfWorldWidth,
  halfWorldWidth,
  -halfWorldWidth / ratio,
  halfWorldWidth  /ratio,
  -50,
  50
)

最后得到视图投影

var view     = mat4.create()
var viewProj = mat4.create()

mat4.invert( view, cam );
mat4.multiply( viewProj, lens, view );