原文地址：http://webglfundamentals.org/webgl/lessons/webgl-image-processing-continued.html

This article is a continuation of WebGL Image Processing. If you haven’t read that I suggest you start there.

本文接上一篇WebGL 图像处理的内容继续讨论。如果你还没有读过，那么我建议你先去了解下上一篇的内容。

The next most obvious question for image processing is how to apply multiple effects?

对于图像处理而言，另一个比较重要的问题是：如何同时添加多种处理效果？

原文地址：http://webglfundamentals.org/webgl/lessons/webgl-image-processing.html

Image processing is easy in WebGL. How easy? Read below.

在 WebGL 中进行图像处理非常简单。有多简单？请接着往下看。

This is a continuation from WebGL Fundamentals. If you haven’t read that I’d suggest webgl-fundamentals.html going there first.

本文接WebGL 基本原理的内容进行描述。如果还没有读过，那么你最好先去看下WebGL 基本原理相关内容。

原文地址：http://webglfundamentals.org/webgl/lessons/webgl-shaders-and-glsl.html

This is a continuation from WebGL Fundamentals.
If you haven’t read about how WebGL works you might want to read this first.

本章内容紧接WebGL 基本原理来进行介绍。如果你还不了解 WebGL 的工作机制，那么你可能需要先来读读这篇文章WebGL 工作机制。

We’ve talked about shaders and GLSL but haven’t really given them any specific details.
I think I was hoping it would be clear by example but let’s try to make it clearer just in case.

在前面的几篇文章中，我们已经提到了着色器和 GLSL 的相关知识，但是并没有对它们进行更多的解释和详细说明。我一直认为举例来介绍相关概念可以让你更容易接受，但是为了让你有更清晰的认识，我准备在这里对它们做更加详细的说明。

As mentioned in how it works WebGL requires 2 shaders every time you
draw something. A vertex shader and a fragment shader. Each shader is a function. A vertex
shader and fragment shader are linked together into a shader program (or just program). A typical
WebGL app will have many shader programs.

正如在WebGL 工作机制中提到的那样，当我们需要绘制图形的时候，WebGL 需要使用2种着色器：顶点着色器和片元着色器。着色器就是一个函数方法。顶点着色器和片元着色器在着色器程序（或者程序）中被连接到一起。一个典型的 WebGL 应用包含多个着色器程序。

译者注：这里的着色器程序应该是指 shader program 对象。program 对象有且仅有一个顶点着色器对象和一个片元着色器对象连接到它。链接 program 对象后，可以产生最终的可执行程序，它包含最后可以在硬件上执行的硬件指令。

原文地址：http://webglfundamentals.org/webgl/lessons/webgl-how-it-works.html

This is a continuation from WebGL Fundamentals.
Before we continue I think we need to discuss at a
basic level what WebGL and your GPU actually do. There are basically 2
parts to this GPU thing. The first part processes vertices (or streams of
data) into clipspace vertices. The second part draws pixels based on the
first part.

本文是上一章节WebGL 基本原理内容的延续。开始之前，我认为我们应该先理解 WebGL 和 GPU 在底层上的工作机制。GPU 其实主要处理两方面的事情，首先把顶点信息（或数据流）处理成 WebGL 空间中的顶点，然后再次基础上，逐像素绘制图形。

原文地址：http://webglfundamentals.org/webgl/lessons/webgl-fundamentals.html

WebGL makes it possible to display amazing realtime 3D graphics in your
browser but what many people don’t know is that
WebGL is actually a rasterization API, not a 3D API.

WebGL 让你在浏览器中可以渲染出令人惊叹的 3D 图形效果，但是大多数人都不知道WebGL 其实只是光栅化 API ，而不是 3D API。

Let me explain.

下面我来详细解释下。

原文地址：http://webglfundamentals.org/

WebGL from the ground up. No magic.

WebGL 并不复杂难懂。

These are a set of articles that teach WebGL from basic principles. They are NOT old rehashed out of date OpenGL articles like many others on the net. They are entirely new, discarding the old out of date ideas and bringing you to a full understanding of what WebGL really is and how it really works.

这个教程集合了一系列从基本概念来介绍 WebGL 的文章。但是，这些文章同网络上其他介绍 OpenGL 的文章完全不同。它们抛弃了那些过时的想法，取而代之的是，用一种全新的方式来帮助你全面理解 WebGL 的概念和工作原理　。

待后续整理。。。

SVG 是可缩放矢量图形（Scalable Vector Graphics，SVG），是一种描述二位矢量图形的 XML 标记语言。

百科中对 SVG 的说明：

1. SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
2. SVG 用来定义用于网络的基于矢量的图形
3. SVG 使用 XML 格式定义图形
4. SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
5. SVG 是万维网联盟的标准
6. SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体

SVG 和 Canvas 是 HTML5 中主要的 2D 图形相关技术。一方面，在 HTML5 发展的大环境下，SVG 有很好的机遇。另一方面，它的主要对手是 flash，同 flash 相比，它与很多标准（如 XSL 和 DOM 等）相兼容，而 flash 是非开源的私有技术。所以，如此看来，SVG 在未来的图形开发中必将占据重要的一席之地。

最近开发中有这样一个需求，需要设计出环形进度条的效果，而且要兼容低版本浏览器。

我们知道，传统方式下，除非使用图片，不然没办法做出这种圆环的动态效果。但是进度数据的范围相对而言比较广（整数值状态下为 0%~100% ，约 100 个独立状态），每个状态用图片来做显然是不现实的。

既然传统方式不行，那就必须考虑其他方式来解决问题。CSS3、Canvas 等都是可以参考的解决方案。使用这些技术有利有弊，依赖其他一些辅助库或框架，可以让解决方案变得更加完美。

我们分析下使用这些技术是如何解决环形进度条需求的。

前段时间，给儿子用的 iPad4 屏幕被摔碎，已经无法正常使用，需要进行换屏。

目前的官方换屏价格非常昂贵，仔细算下来不如加点钱换个新的 iPad，所以首先放弃了官方换屏的想法。其次，其他非官方的换屏服务质量良莠不齐，而且价格差异也很大，选来选去总是不放心。考虑再三，我准备使用 360 同城帮的换屏服务，价格也算可以，而且服务有保证。但是很不幸的是，过去一直有的上门服务居然没有了，所以也放弃了。

另一方面总是看到网上的各种换屏教程，一直没有机会尝试。这次有这个机会可以实际操作一把，即使失败了也有很好的借口（反正是儿子摔坏的）来敷衍老婆。

就是因为上面这些杂七杂八的想法，才让我下定决心自己换屏。