WebGL学习之路

前言

以前学习，都是自己摸索，从来没有写过什么文档，当然也没有通过这样的方式去学习，记录一些文档，以探讨的方法进行学习，所以想尝试一下。WebGL你是从什么地方了解到这个工具的呢？坦诚的说，我是在招聘网看到前端的招聘要求，当看到第一家的时候猜测可能是一个小众的工具，直到看到好多企业对于前端都期待有构建三维运用能力，然后才开始去了解WEBGL。我是一个半路出家的前端，在目前的开发过程中，讲真，实际操作动手能力，远远强过理论理解，这也就是对一些基础的东西了解得太少了，以前不知道从什么地方开始去深入一个技术，正好，现在接触到WebGL，那么就从这篇文章开始，一点一点，慢慢的去学习这门技术，而针对于我的文章，更多的用途用于记录，讲真只是为了我自己查阅方便，因为掘金没有被公司网络拦截，偷乐，简单交代一下，回到正题。

OpenGL简介

说到WebGL，不得不提及OpenGL。OpenGL由SGI(Silicon Graphics Inc) 开发，并在1992年开源，OpenGL发展出多个版本，在3D开发，软件开发，甚至电影制作产生了深远的影响。

WebGL概述

WebGL是在网页上绘制，渲染，交互的复杂3D图形技术。它实际上是从OpenGL的一个特殊版本OpenGL ES中派生出来的，OpenGL ES 专用于嵌入手机，游戏机等设备。WebGl是基于OpenGL ES 2.0开发的，这三者的关系从下图就可以一目了然。

graph TD
OpenGL --> OpenGL-ES-2.0 --> WebGL

WebGL网页

WebGL网页包含了三种语言：HTML、JavaScript、GLSL ES(OpenGL ES着色器语言)。 由于GLSL ES内嵌在JavaScript中，所以WebGL网页就和传统网页结构一样。

WebGL网页的软件结构，如图：