webGL第六课——二维平面真实坐标到webGL坐标转换

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/lzwdlut/article/details/52302239

在学习过程中，推导一下真是坐标系到webGL坐标系转换的通用计算方法，前提是webGL完全占据canvas画布位置，即：

gl.viewport(0, 0, canvas.clientWidth, canvas.clientHeight);

经过几个测试，不知是否适用于所有二维情况。
推导过程见下图，

最终计算公式为：

$$x' = 2(w(x+a)/2a-x_0-w/2))/w$$

$$y'=2(h/2 -recH +h(y+b)/2b+y_0)/h$$
$\ 其中，$
$\ a,b为模型在真实坐标系中的x,y方向最大值，并假设真实坐标系为对称坐标系，范围为 {(-a,-b),(a,b)}; 或者理解为真是坐标系的x,y轴的最大值；$
$\ w代表 canvas宽度大小像素值；h代表canvas高度像大小素值;$
$\ x_0,y_0代表canvas左上角坐标的像素值;$
$\ recH 代表客户区的高度，recH=h;

在2D场景中，还是有用的，像.net中的GDI+二维绘图，也是用的这个转换。但是，进入3D场景之后，貌似没什么用了。因为，可以通过可视空间设置，将任意大小的三维图形显示出来。