OpenGL、OpenGL ES、Canvas、WebGL概念梳理

如何学习OpenGL、OpenGL ES、Canvas、WebGL

当你开始思考你应该如何学习OpenGL、OpenGL ES、Canvas、WebGL的时候，相信你至少对相关的关键词了解过了，还不太清楚OpenGL、OpenGL ES、Canvas、WebGL是什么，个人建议是不要做过多思考，先看看相关的具体技术教程、资源文献、论坛帖子，随着时间的推移你自然会明白OpenGL、OpenGL ES、Canvas、WebGL等关键词指什么。

OpenGL

OpenGL是一组引擎驱动级别的、用于渲染2D、3D矢量图形的API接口。OpenGL不是一种语言，你可以把它理解成一个C运行时的函数库，里面提供了各种用于绘图的API函数接口。

OpenGL ES

OpenGL ES (OpenGL for Embedded Systems) 是 OpenGL 三维图形 API 的子集，针对手机、PDA和游戏主机等嵌入式设备而设计。

WebGL

WebGL（Web Graphics Library）是一种3D绘图协议，这种绘图技术标准允许把JavaScript和OpenGL ES 结合在一起，通过增加OpenGL ES 的一个JavaScript绑定，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。

一句话来描述，WebGL API指的就是gl=canvas.getContext(‘webgl’)返回对象gl的一系列绘制渲染方法，通过WebGL API可以把一个三维场景绘制渲染出来。比如上面代码中gl.createShader()、gl.shaderSource()、gl.drawArrays()等方法就是WebGl API。

如果你有 数字电路的知识，可编程芯片不仅仅只有GPU，针对不同的应用情形，都有特定的可编程芯片，图形处理用到的是可编程GPU，也就是说可以运行程序。处理声音是声卡，处理图像是显卡，自然而然它们 都会以CPU为核心，接受CPU的调度。以上描述在有些地方可能不太严谨，大家也不必记忆，主要目的是让大家有基本的认识，可以更好的编写程序。GPU相比CPU最大的特点是并行计算，不过WebGL API都 进行了封装，如果你想学习并行计算可以关注CUDA或OpenCL。GPU硬件(渲染管线)、显卡驱动、操作系统、浏览器、WebGL API是逐层抽象的。每一层都会为上一层提供一个接口，这里可以看出WebGL API是 首先通过浏览器的的解析，才能够经过一系列层驱动GPU工作，生成像素缓存，显示器会按照一定的频率扫描像素缓存，最终显示出来。

Canvas

首先，HTML的Canvas元素提供了2D和3D绘图两种功能，平时程序员之间交流所说的Canvas一词就是指Canvas的2D绘图功能，通过Canvas元素实现的3D绘图功能，也就是所谓的WebGL，或者说WebGL依赖于Canvas元素实现。执行canvas.getContext(‘2d’);返回对象具有一系列绘制二维图形的方法，比如绘制直线、圆弧等API。执行canvas.getContext(‘webgl’);返回对象具有一系列绘制渲染三维场景的方法，也就是WebGL API。

总结

综上所述，Canvas(画布)只是HTML里面的一个元素，是呈现2D、3D绘图的基础，通过Canvas标签对象的getContext()方法，可以针对性的获取2D、3D绘图的一系列API方法。此外，OpenGL标准应用的是客户端，OpenGL ES应用的是移动端，WebGL标准应用的是浏览器平台。

至此，完毕。该篇文章仅做个人学习笔记使用。