webgl入門必備

2021-09-24 02:32:17 字數 1353 閱讀 9536

由於最近在搞乙個其他的東西,所以我的webgl學習系列部落格都沒有更新了,所以在這裡先做乙個總結。

我們對webgl有乙個初步的認識,就是需要先獲取到canvas的上下文,那麼我們今天就需要了解一下將影象發布到畫布上。

思路將資料由main()函式傳到頂點著色器的attribute變數上去!

先獲取到attribute變數的位址

gl.program. a_position = gl.getattriblocation(program, 『a_program』);

傳輸資料

gl.vertexattribute3f(a_postition, (資料));// 頂點的位置資料屬性

頂點著色器:頂點著色器是用來描述頂點特性(如位置、顏色等)的程式。

片元著色器:逐片元處理過程的程式(如顏色的資料)。

變數:attribute uniform兩種變數

1、attribute: 傳輸與頂點相關的資料。

2、uniform:對於所有定點都相同的資料。

我們習慣將attribute的變數宣告為a_***xx,將uniform型別的變數宣告為u_***x

緩衝區物件:然後我們說下緩衝區物件。

因為在實際的實現當中,我們的頂點、顏色、光照等有很大的一片資料,一般我們用陣列存放,但是對陣列進行操作的時候比較麻煩所以我們用緩衝區物件去進行處理。

1、 建立乙個頂點陣列。

var vertices = new float32array();
2、 建立緩衝區物件。

var vertexbuffer = gl.createbuffer();
3、 繫結緩衝區。

gl.bindbuffer(gl.array_buffer,vertexbuffer);
4、 向物件中寫入資料。

5、 將緩衝區物件分配給attribute變數。

gl.vertexattributepointer(a_position, 2, gl.float, false, 0, 0);
6、 連線a_position變數與分配給它的緩衝區。(也稱為開啟attribute變數)

gl.enablevertexattributearray(a_position);

五 WebGL入門,shader剖析

webgl用的shader語言是glsl opengl shading language shader的主要工作有 1.利用檢視和投影矩陣對點的位置進行變化 2.如果需要利用法線的時候,也同樣需要利用檢視矩陣對其進行轉換 3.紋理座標的產生和轉換 4.頂點的光照或者象素光照的計算 5.顏色計算 1 ...

Python 入門必備

互動式程式設計不需要建立指令碼檔案,而是直接通過python直譯器的互動模式進來編寫 下面我們來開啟python自帶的互動式程式設計客戶端,列印乙個hello,world 通過指令碼引數呼叫直譯器開始執行指令碼,直到指令碼執行完畢。當指令碼執行完成後,直譯器不再有效。所有python檔案將以.py為...

webgl (原生)基礎入門指南 二

本章介紹一些三維圖形學中的基本概念為後文的繪圖做個科普在我們現實世界中,每個東西都有它的長 寬 高等度量分量,那麼我們對它進行建模的時候會使用到乙個物件座標系。將這個物件放入現實世界,那麼它就存在於現實世界中的世界座標系。我們將它顯示在我們的系統裝置上,則它存在於應用程式座標系。我們把應用程式中度量...