24 WebGL從指定視點觀察旋轉後的三角形

2021-08-01 22:20:40 字數 2337 閱讀 5265

舉個例子,預設情況下視點在原點,實現沿著z軸負方向進行觀察。假如我們將視點移動到(0,0,1),如圖所示。這時,視點與被觀察的三角形的距離增加了1.0個單位。實際上,如果我們使三角形沿z軸負方向移動1.0個單位,也可以達到同樣的的效果,因為這兩種方法處理完後,兩個點的位置之間的關係是一樣的。

「改變觀察者的狀態」與「對整個世界進行平移和旋轉變換」,本質上是一樣的,它們都可以用矩陣來描述。

我們需要兩個矩陣:旋轉矩陣(表示三角形的旋轉)和檢視矩陣(表示觀察世界的方式)

用檢視矩陣乘以頂點座標會把頂點變換到合適的位置,使得觀察者(以預設狀態)觀察新位置的頂點,就好像在觀察者處在(檢視矩陣描述的)視點上觀察原始頂點一樣。現在要在某個視點觀察旋轉後的三角形,我們需要先旋轉三角形,然後從這個視點來觀察它。換句話說,我們需要先對三角形進行旋轉變換,再對旋轉後的三角形進行「移動視點」等效的變換。我們按照上述順序相乘兩個矩陣。具體看一下等式。

獲取旋轉後的頂點座標:

《旋轉後的頂點座標》=《旋轉矩陣》x《原始頂點座標》

在獲取「從視點上看上去」的旋轉後的頂點座標:

兩個式子代入,可得:

除了旋轉矩陣,你還可以使用平移、縮放等基本變換矩陣或它們的組合,這時的矩陣被稱為模型矩陣(model matrix)。上面的式子可以寫成

《檢視矩陣》x《模型矩陣》x《原始頂點座標》

(1)頂點著色器:

//頂點著色器

var vshader_source = "" +

"attribute vec4 a_position;\n" +

"attribute vec4 a_color;\n" +

"uniform mat4 u_viewmatrix;\n" +

"uniform mat4 u_modelmatrix;\n" +

"varying vec4 v_color;\n" +

"void main()\n";

多宣告了乙個模型矩陣,然後在運算裡面加入。

(2)獲取模型矩陣並且賦值

在上面的**中,程式對每個頂點進行《檢視矩陣》x《模型矩陣》x《原始頂點座標》的運算。但是無論對哪個頂點而言,兩個矩陣相乘的結果都是一樣的。所以我們可以在js**裡面,計算出相乘的結果,再傳到頂點著色器裡面。這兩個矩陣相乘的結果被稱為模型檢視矩陣(model view matrix),如下所示

《模型檢視矩陣》=《檢視矩陣》x《模型矩陣》

在頂點著色器中的運算,則可以簡化為:

<

模型檢視矩陣

>x《頂點座標》

然後**就可以簡化為:

(1)頂點著色器:

//頂點著色器

var vshader_source = "" +

"attribute vec4 a_position;\n" +

"attribute vec4 a_color;\n" +

"uniform mat4 u_modelviewmatrix;\n" +

"varying vec4 v_color;\n" +

"void main()\n";

(2)給模模型檢視矩陣賦值

//設定視角矩陣的相關資訊

var u_modelviewmatrix = gl.getuniformlocation(gl.program, "u_modelviewmatrix");

if (u_modelviewmatrix < 0)

//設定視角矩陣的相關資訊(視點,視線,上方向)

var viewmatrix = new matrix4();

viewmatrix.setlookat(0.20, 0.25, 0.25, 0, 0, 0, 0, 1, 0);

//設定模型矩陣的相關資訊

var modelmatrix = new matrix4();

modelmatrix.setrotate(-10,5,0,1);

//計算出模型檢視矩陣 viewmatrix.multiply(modelmatrix)相當於在著色器裡面u_viewmatrix * u_modelmatrix

var modeviewmatrix = viewmatrix.multiply(modelmatrix);

//將試圖矩陣傳給u_viewmatrix變數

gl.uniformmatrix4fv(u_modelviewmatrix, false, modeviewmatrix.elements);

ORACLE SEQUENCE重置從指定數字開始

1.首先從序列存放表中查出實體所對應的序列值 我的序列存放表在right庫中 select from sys sequence no where code like tmlinetel sys sequence no為序列表名,tmlinetel為實體名 查出後結果如下圖 2.取出序列的當前值 先執...

Git push 從本地指定分支到遠端指定分支

有時需要將指定的本地分支強制push到遠端分支,可以在以下命令基礎上加 f,強制執行。git push origin dev master meaning git pushto remoteorigin masterfrom localdev 以上命令的含義是push 到遠端origin的maste...

從指定DNS伺服器查詢指定網域名稱的ip

需要從指定dns伺服器查詢出網域名稱對應的ip位址 host 網域名稱 dns伺服器ip位址例如 www.a.shifen.com has address 183.232.231.172 先檢視本地路由配置 netstat nr 新增路由規則 route add net 10.0.0.0 192.1...