注：文章譯自http://wgld.org/，原作者杉本雅広(doxas)，文章中如果有我的額外說明，我會加上［lufy：］，另外，鄙人webgl研究還不夠深入，一些專業詞語，如果翻譯有誤，歡迎大家指正。
必須準備的東西
上次介紹了3D繪圖的基礎知識。講了一下由Z座標的不同決定的兩種座標系，以及座標變換的種類。這一次，說一說實際WebGL繪圖的時候必須準備的東西。
首先，HTML，javascript相關的基礎知識就不解釋了。如果，有不明白的單詞或概念的話，請自己查一下。我是認爲你有一定的HTML和javascript基礎的前提下進行講解的。
HTML的準備
就像前面說的那樣(二，開始WebGL之前，先了解一下canvas)，WebGL利用的是canvas的繪圖區域。也就是說，使用WebGL的網頁，HTML裏面肯定含有canvas標籤。
向這個canvas標籤上添加一個ID屬性，在javascript中使用getElementById等函數很容易能獲取到這個canvas對象，獲取了這個canvas之後，利用javascript可以完成所有的操作。
一個最低限度的HTML模版，就是像下面這樣。
<html>
<head>
<title>WebGL TEST</title>
<script src="script.js" type="text/javascript"></script>
</head>
<body>
<canvas id="canvas"></canvas>
</body>
</html>另外，所有的腳本都寫在HTML中當然是可以的，個人認爲將javascript代碼分離成單獨的文件比較好，這個不是必須的。
關於着色器
WebGL中，所謂的固定渲染管線是不存在的。估計會有人問，什麼是固定渲染管線？先來簡單說明一下。
固定渲染管線，簡單來說，就是3d渲染所進行的一連串的計算流程，就像流水線一樣。（說的有點太簡單了。）
固定渲染管線中，上次所說的模型，視圖，投影的座標變換都會替我們完成。不需要理解細節，只需要知道所有的這些座標變換都包含在裏面，都會幫我們計算好。
如果有了固定渲染管線，編寫程序就比較容易了，因爲所有的變換都是由固定渲染管線來完成的，但是缺點就是自由度低。固定渲染管線只能完成一些最基本的操作，如果想要做一些特殊的處理，就比較麻煩了。
好了，固定渲染管線就說到這裏了。
前面說了，WebGL中不存在固定渲染管線。也就是說，座標變換必須全部由自己來做。而且，這個記述了座標變換的機制就叫做着色器(Shader)。
這樣可以由程序員控制的機制叫做可編輯渲染管線。而着色器又有 處理幾何圖形頂點的頂點着色器和處理像素的片段着色器兩種類型。
由於WebGL中沒有固定管線，所以必須準備好頂點着色器和片段着色器。
着色器的處理方法
頂點着色器和片段着色器要怎麼準備呢？
實際上，着色器的添加可以有多種做法。着色器是由程序員自己編寫的，而且着色器的代碼就是簡單的字符串而已。所以，不管用什麼方法，只要把這個着色器字符串傳給程序就可以了。
最簡單的方法，就是把着色器記錄在HTML中。使用這種方法的話，是利用HTML的script標籤來做的。下面是一個簡單的例子。
<script id="vshader" type="x-shader/x-vertex">
※頂點着色器
</script>
<script id="fshader" type="x-shader/x-fragment">
※片段着色器
</script>>>指定type屬性的理由
type屬性指定了［x-shader/x-vertex］和［x-shader/x-fragment］，這並不是HTML中定義的正式的寫法。但是一般的瀏覽器如果遇到不識別的標籤的話會無視掉的，瀏覽器不會認爲這是javascript代碼的。瀏覽器只會把它當成無意義的字符串，而程序中則可以使用標籤裏面的內容。
另一個，也可以不使用script標籤來做。
主要是因爲着色器的代碼就是簡單的字符串，可以直接在javascript內部定義字符串。這樣的話，着色器被定義在了javascript文件中，HTML的代碼就變的簡單多了，並不是說，這種做法比前一種做法好。
總結
使用WebGL進行3D渲染，這次說了下面幾個必須要做的準備。
最低限度，需要HTML，canvas標籤，處理WebGL的javascript代碼，頂點着色器和片段着色器的代碼。
另外，比如要描畫3D模型的模型數據，圖片文件等當然有時候也是需要的，但是根據你用WebGL想要做的東西不同而不同。真要說最新限度的話，只需要一個HTML文件。javascript代碼和着色器代碼都可以記錄在HTML文件中。
基本上，本網站的所有javascript代碼都是記錄在單獨的文件內的，而着色器的代碼，也不是必須記錄在HTML中，要根據情況隨機應變吧。
下次，介紹3D繪圖的核心內容，矩陣。