WebGL学习系列-WebGL简介

WebGL概述
相信大家都知道Web中有个叫canvas的画布，通过其提供的一些API，我们可以很方便的在浏览器的页面上画点、线、多边形、图片等。现在很多的html5小游戏也是由canvas来实现的。canvas技术相当于所见即所得，你画什么就在页面上展示什么，原理比较好懂。但是canvas主要是针对2D的，所以通常我们主要用于实现2D类的游戏。

要说WebGL，得提提OpenGL。OpenGL是一套开放的图形库，用于在pc端上绘制3D图形，它是一套开放的标准API，在不同平台上底层有不同的实现。可以把WebGL看成是Web端的OpenGL。先来看下OpenGL的版本图，如下所示：

可以看到，目前Web端使用的WebGL为WebGL1.0，它是基于OpenGL ES2.0的， 而 
OpenGL ES主要服务于一些嵌入式设备。可以说，我们将要学习的WebGL和OpenGL ES2.0是比较像的，至少很多原理都是共通的。所以有时候，当你遇到WebGL一些问题的时候，可以尝试通过OpenGL关键字去查找相关的资料。

OpenGL从2.0开始便支持可编程着色器，着色器通俗的说，就是给界面中的每一个像素上色，这个很快就会了解到了。自然的，WebGL也继承了这个重大的特性。

最后，再来看下WebGL程序的结构，先看下图：

左边为传统的web页面开发，右边为包含了WebGL的网页，GLSL ES是用于编写着色器的语言，开发WebGL程序的时候，除了直接调用WebGL相关的api，我们还要编写着色器。