1.紋理坐標
紋理坐標是紋理圖像上的坐標，通過紋理坐標可以在紋理圖像上獲取紋理顏色。WebGL系統中的紋理坐標系統是二維的，如圖所示。為了將紋理坐標和廣泛使用的x、y坐標區分開來，WebGL使用s和t命名紋理坐標（st坐標系統）。
紋理圖像的四個角坐標為左下角（0.0，0.0），右下角（1.0,0.0），右上角（1.0， 1.0）和左上角（0.0， 1.0）。紋理坐標很通用，因為坐標值與圖像自身的尺寸無關，不管是128*128還是128*256的圖像，右上角的紋理坐標始終是(1.0, 1.0)。
2.紋理映射步驟
1.准備好映射到幾何圖形上的紋理圖像。
2.為幾何圖形配置紋理映射方式。
3.加載紋理圖像，對其進行寫配置，以在WebGL中使用它。
4.在片元着色器中將相應的紋理從紋理中抽取出來，並將紋素的顏色賦給片元。
3.gl.createTexture()
創建紋理對象以存儲紋理圖像。
4.gl.deleteTexture()
使用textur刪除紋理對象。如果刪除一個已經被刪除的紋理對象，不會報錯也不會產生任何影響。
5.gl.pixelStorei(pname, param)
使用pname和param指定的方式處理加載得到的圖像。參數
pname:可以是以下二者之一。gl.UNPACK_FLIP_Y_WEBGL,對圖像進行Y軸反轉。默認值為false；gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL,將圖像RGB顏色值的每一個分量乘以A。默認為false；WEBGL，默認值為false。
param:指定非0（true）或0（false）。必須為整數。
例如：gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, 1)，將圖像進行Y軸反轉。由於WebGL紋理坐標系統中的t軸的方向和PNG、BMP、JPG等格式圖片的坐標系的Y軸方向相反。因此，只有將圖像的Y軸進行反轉，才能夠正確地將圖像映射到圖形上。
6.gl.activeTexture(texUnit)
激活texUnit指定的紋理單元。參數：
texUnit:指定准備激活的紋理單元：gl.TEXTURE0、gl.TEXTURE1…、gl.TEXTURE7。最后的數字表示紋理單元的編號
系統支持的紋理單元個數取決於硬件和瀏覽器的WebGL實現，但在默認情況下，WebGL至少支持8個紋理單元。
7.gl.bindTexture(target, texture)
開啟texture指定的紋理對象，並將其綁定到target上。此外，如果已經通過gl.activeTexture()激活了某個紋理單元，則紋理對象也會綁定到這個紋理單元上。參數：
target:gl.TEXTURE_2D或gl.TEXTURE_BUVE_MAP
texture:表示綁定的紋理對象
例如，之前執行了gl.activeTexture(gl.TEXTURE0)函數，激活了第0個紋理單元。現在執行gl.bindTexture(gl.TEXTURE_2D, texture)。那么紋理對象texture也會綁定到紋理單元gl.TEXTURE0上。
8.gl.texParameteri(target, pname, param)
將param的值賦給綁定到目標的紋理對象的pname參數上。參數：
target:gl.TEXTURE_2D或gl.TEXTURE_CUBE_MAP
pname:紋理參數
param:紋理參數的值
pname可指定4個紋理參數：
放大方法（gl.TEXTURE_MAP_FILTER）:當紋理的繪制范圍比紋理本身更大時，如何獲取紋理顏色。比如說，將16*16的紋理圖像映射到32*32像素的空間時，紋理的尺寸變為原始的兩倍。默認值為gl.LINEAR。
縮小方法（gl.TEXTURE_MIN_FILTER）: 當紋理的繪制返回比紋理本身更小時，如何獲取紋素顏色。比如說，你將32*32的紋理圖像映射到16*16像素空間里，紋理的尺寸就只有原始的一般。默認值為gl.NEAREST_MIPMAP_LINEAR。
水平填充方法（gl.TEXTURE_WRAP_S）:這個參數表示，如何對紋理圖像左側或右側區域進行填充。默認值為gl.REPEAT。
垂直填充方法（gl.TEXTURE_WRAP_T）:這個參數表示，如何對紋理圖像上方和下方的區域進行填充。默認值為gl.REPEAT。
可以賦給gl.TEXTURE_MAP_FILTER和gl.TEXTURE_MIN_FILTER參數的值包括：
gl.NEAREST: 使用原紋理上距離映射后像素中心最新的那個像素的顏色值，作為新像素的值。
gl.LINEAR: 使用距離新像素中心最近的四個像素的顏色值的加權平均，作為新像素的值（和gl.NEAREST相比，該方法圖像質量更好，但也會有較大的開銷。）
可以賦給gl.TEXTURE_WRAP_S和gl.TEXTURE_WRAP_T的常量：
gl.REPEAT:平鋪式的重復紋理
gl.MIRRORED_REPEAT:鏡像對稱的重復紋理
gl.CLAMP_TO_EDGE:使用紋理圖像邊緣值
9.gl.texImage2D(target, level, internalformat, format, type, image)
將image指定的圖像分配給綁定到目標上的紋理對象。參數：
target:gl.TEXTURE_2D或gl.TEXTURE_CUBE
level:傳入0（實際上，該參數是為金字塔紋理准備的）
internalformat:圖像的內部格式
format:紋理數據格式，必須使用與internalformat相同的值
type:紋理數據的類型
image:包含紋理圖像的Image對象
紋理數據格式包含： gl.RGB（紅、l綠色、藍）、gl.RGBA（紅、l綠色、藍、透明度）、gl.ALPHA（0.0， 0.0， 0.0， 透明度）、gl.LUMINANCE、gl.LUMINANCE_ALPHA。
如果紋理圖片是JPG格式，該格式將每個像素用RGB三個分量表示，所以參數指定為gl.RGB。其他格式，例如PNG為gl.RGBA、BMP格式為gl.RGB。
type參數指定了紋理數據類型，通常我們使用gl.UNSIGNED_BYTE數據類型。所有數據格式如下：
gl.UNSIGNED_BYTE:無符號整形，每個顏色分量占據1字節
gl.UNSIGNED_SHORT_5_6_5：RGB每個分量分別占據5、6、5比特
gl.UNSIGNED_SHORT_4_4_4_:RGBA每個分量分別占據4、4、4、4比特
gl.UNSIGEND_SHORT_5_5_5_1: RGBA，RGB每個分量個占據5比特，A分量占據1比特
10.專用於紋理的數據類型
sampler2D:綁定到gl.TEXTURE_2D上的紋理數據類型
samplerCube:綁定到gl.TEXTURE_CUBE_MAP上的紋理數據類型
11.gl.uniform1i(location, texUnit)
textUnit單元的紋理傳遞給着色器。參數：
location:紋理對象的地址
texUnit:紋理單元編號
例如gl.uniform1i(u_Sampler, 0)，將0號紋理傳遞給着色器中的取樣器變量
12.vec4 texture2D(smapler2D sampler, vec2 coord)
從sampler指定的紋理上獲取coord指定的紋理坐標處的像素顏色。參數：
sampler:指定紋理單元編號
coord：指定紋理坐標
返回值：紋理坐標處像素的顏色值，其格式由gl.texImage2D()的inernalformat參數決定。下面列出了不同參數下的返回值。如果由於某些願意能導致紋理圖像不可使用，那就返回（0.0, 0.0, 0.0 1.0）。
internalformat/返回值
gl.RGB/(R,G,B,1.0)
gl.RBGA/(R,G,B,A)
gl.ALPHA(0.0, 0.0, 0.0, A)
gl.LUMINANCE/(L, L, L, 1.0)
gl.LUMINANCE_ALPHA/(L, L, L, A)
13.texImage2D(target, level, internalformat, width, height, border, format, type, offset)
將image指定的圖像分配給綁定到目標上的紋理對象。是WebGL2.0的函數，主要區分WebGL1.0的同名函數區別。參數：
target:gl.TEXTURE_2D或gl.TEXTURE_CUBE
level:傳入0（實際上，該參數是為金字塔紋理准備的）
internalformat:圖像的內部格式
width:文理繪制寬度
height:紋理繪制高度
format:紋理數據格式，必須使用與internalformat相同的值
type:紋理數據的類型
image:包含紋理圖像的Image對象