绘制图形，必须搞清楚坐标系，不然寸步难行。

参考：

https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API

https://blog.csdn.net/flycatdeng/article/details/82588903

在webGL中，世界坐标系是以屏幕中心为原点(0, 0, 0)，且是始终不变的。你面对屏幕，你的右边是x正轴，上面是y正轴，屏幕指向你的为z正轴。在WebGL的坐标被限制为(1,1,1)和(-1，-1，- 1)。WebGL将不绘制显示任何超越这些界限，如下图：

 viewport函数定了了webgl的范围。

gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);

函数定义如下：

void Viewport( int x, int y, sizei w, sizei h );

其中x和y给出了视图左下角的x和y窗口坐标corner和w和h分别给出了视区的宽度和高度。