到現在為止，一直學的都是繪製一些簡單的三角形。下面，我們將學習如何繪製如圖所示的乙個立方體，目標：
如果按以前所學的知識，製作這個正方體就需要使用三角形兩個拼乙個矩形，最後拼出來六個正方形來組成這個立方體，由於繪製三角形需要重複呼叫頂點，雖然只需要8個頂點的位置，但是，繪製三角形的時候，卻需要多次呼叫，所以給我們提供了乙個gl.drawelements()函式的解決方案。使用該函式替代gl.drawarrays()函式進行繪製，能夠避免重複定義頂點，報錯頂點數量最小。為此，你需要知道模型的每乙個頂點的座標，這些頂點座標描述了整個模型。
我們將立方體拆成頂點和三角形，如圖7.32所示。立方體唄拆成6個面：前、後、左、右、上、下，每個面都由兩個三角形組成，與三角形列表中的兩個三角形相關聯。每個三角形都有3個頂點，與頂點列表中的3個頂點相關聯。三角形列表中的數字表示該三角形的3個頂點在頂點列表中的索引值。頂點列表中共有8個頂點，索引值為從0到7。
而現在新的gl.drawelements()方法就是通過頂點索引繪製物體，首先我們來看一下如何使用gl.drawelements()，我們需要在gl.element_array_buffer（而不是之前一直使用的gl.array_buffer）中指定頂點的索引值。所以兩種方法最重要的區別就在於gl.element_array_buffer，它管理這具有索引結構的三位模型資料。
如果傳入的type引數和gl.element_array_buffer中的資料型別（uint8array或uint16array）不一致，也並不會出現錯誤。但是如果兩者不一致，比如緩衝區是uint16array型別的，而傳入的引數為gl.unsigned_short，那麼程式會錯誤地理解緩衝區中的資料，並會繪製出一些不可**的東西。
下面書寫乙個案例：
在124行：
本案例不再使用verticescolor中的頂點順序來進行繪製，所以必須額外注意每個頂點的索引值，我們要通過索引值來指定繪製的順序。比如說，第1個頂點的索引為0，第2個頂點的索引為1，等等。
183行：
緩衝區物件indexbuffer中的資料來自於陣列indices，該陣列以索引值的形式儲存了繪製頂點的順序。索引值是整型數，所以陣列的型別是uint8array（無符號8位整型數）。如果有超過256個頂點，那麼就應該使用uint16array。indices中的元素如圖7.33中的三角形列表所示，每3個索引值為1組，指向3個頂點，由這3個頂點組成1個三角形。通常我們不需要手動建立這些頂點和索引資料，因為三維建模工具會幫助我們建立它們。
在呼叫gl.drawelements()時，webgl首先充繫結到gl.element_array_buffer的緩衝區（也就是indexbuffer）中獲取索引值，然後根據該索引值，從繫結到gl.array_buffer的緩衝區（即vertexcolorbuffer）中獲取頂點的座標、顏色等資訊，然後傳遞給attribute變數並執行頂點著色器。對每個索引值都這樣做，最後就繪製出了整個立方體，而且值呼叫了一次gl.drawelements()。這種方式通過索引來訪問頂點資料，從而迴圈利用頂點資訊，控制記憶體的開銷，但代價是你需要通過索引來簡介地訪問頂點，在某種程度上使程式賦值話了，所以，兩個繪製方法各有優劣，具體用哪乙個取決於具體的需求。
OpenGL WebGL 繪製立方體
include 繪製立方體 將立方體的八個頂點儲存到乙個陣列裡面 static const float vertex list 3 將要使用的頂點的序號儲存到乙個陣列裡面 static const glint index list 2 繪製立方體 void drawcube void glend s...
OpenGL學習07 繪製立方體
opengl在繪製場景之前，需要先產生或者說定義乙個場景，這個產生目標場景檢視的過程類似於照相機拍照的過程。1.把照相機固定在三角架上，並讓它對準場景 檢視變換 2.對場景進行安排，使各個物體在 中的位置是我們所希望的 模型變換 3.選擇照相機鏡頭，並調整放大倍數 投影變換 4.確定最終 的大小。例...
用頂點陣列繪製立方體
code include include include static glfloat vertices static glfloat vertices static glubyte front static glubyte right static glubyte back static glub...