初始化著色器函式initshaders()被定義在了cuon.util.js中
使用：initshaders(gl, vshader, fshader);
引數：gl 指定渲染的上下文
vshader 指定頂點著色器程式**(字串)
fshader 指定片元著色器程式**（字串）
返回值：
true 初始化著色器成功
false 初始化著色器失敗
頂點著色器
var
vshader_source=""
+"void main()\n"
;
類似於c語言，必須包含乙個main()函式， void**這個函式不會有返回值，而且你不能為main()指定引數。
函式內部的兩行**
gl_position 型別：vec4 表示頂點的位置 必須設定
gl_pointsize 型別：float 表示點的尺寸（畫素數） 如果不設定，預設為1.0
glsl es資料型別
float 表示是浮點數
vec4表示由四個浮點數組成的向量
由4個分量組成的向量被稱為齊次座標，它能夠提高處理三維資料的效率，所以被大量使用
齊次座標：（x,y,z,w）。齊次座標（x,y,z,w）等價於三維座標（x/w,y/w,z/w）。所以如果齊次座標的第四個分量是1，你就可以將它當做單位座標來使用。w的值必須大於等於0的。如果w趨近於0，那麼它所表示的點將趨近於無窮遠，所以在齊次座標系中可以有無窮的概念。齊次座標的存在，似的用矩陣乘法來描述頂點變換成為可能，三維圖形系統在計算過程中，通常使用齊次座標來表示頂點的三維座標。
片元著色器
// 片元著色器程式
varfshader_source=""
+"void main()\n"
;
片元著色器的作用就是處理片元，使其顯示在螢幕上。
片元著色器將點的顏色賦值給gl_fragcolor變數，該變數是片元著色器唯一的內建變數，它控制著畫素在螢幕上的最終顏色。
gl_fragcolor 型別：vec4 描述：指定片元顏色（rgba格式）。
對這個內建變數賦值後，相應的畫素就會以這個顏色值顯示。型別和頂點著色器中的頂點位置一樣，也是vce4型別。四個浮點分量，分別代表rgba值。
繪製操作
// 繪製乙個點
gl.drawarrays
(gl.
points,0
,1);
引數：mode 指定繪製的方式，可接收一下常量符號：gl.points，gl.lines, gl.line_strip, gl.line_loop, gl.********s, gl.********_strip, gl.********_fan
first 指定從哪個頂點開始繪製（整數型）
count 指定繪製需要用到多少個頂點（整數型）
返回值：無
錯誤 invalid_enum 傳入的mode引數不是前述引數之一
invalid_value 引數first或count是負數
示例當中由於我們只繪製了單獨的點，所以第乙個值是gl.points，第二個引數表示從第1個頂點開始畫起，第三個引數表示僅繪製的乙個點。
webgl學習 著色器
著色器是一段使用glsl語言 一種類c的高階語言 編寫的簡短程式，它定義了3d物件的畫素點實際繪製到螢幕上的方式，webgl要求開發者要為每個待繪製的物件提供乙個著色器，乙個著色器可以應用於多個物件，因此在實際的應用中，整個場景通常提供乙個統一的 著色器。乙個著色器，通常由兩個部分組成 頂點著色器 ...
建立WebGL著色器程式
既然是高階，我們就要先從基礎入手，那麼先看一下如何建立乙個webgl的著色器程式 初始化著色器程式外掛程式 initshaders.js function initshaders gl,vertexshaderid,fragmentshaderid else var fragelem documen...
一 WebGL 著色器和繪製
var vshader source void main 型別和變數名字 var fshader source void main param mode 繪製模式 gl.points,gl.lines,gl.line strip,gl.line loop param first 從哪個點開始繪製 p...