本文是webgl電子書的1.3節內容
完成1.1節和1.2節案例後,想必你已經迫切希望呈現出三維的效果,不過在實現三維效果之前,本節課預先進行三維座標系的講解。
在xyz軸上分別設定乙個頂點,三個頂點確定乙個三角形,然後通過webgl渲染出來,本節課的目的就是通過這樣乙個案例讓你建立webgl三維座標系和投影兩個概念。本節課的渲染效果並不是上圖所表達的效果,上圖只是給你展示下三個頂點如何構成了乙個三角形區域。
原始碼中通過下面**定義了三角形的三個頂點座標。
//9個元素構建三個頂點的xyz座標值
// 陣列裡9個元素,每間隔3個為一組,分別代表xyz軸上的座標值
var data=
newfloat32array([
0.0,
0.0,
1.0,
//三角形頂點1座標
0.0,
1.0,
0.0,
//三角形頂點2座標
1.0,
0.0,
0.0//三角形頂點3座標])
;
用你的瀏覽器開啟本節課的案例原始碼測試,你可以看乙個直角三角形,準確地說你所看到的影象是三維空間中乙個等邊三角形平面的投影,等邊三角形平面的三個頂點分別xyz軸上,說明投影的方向是其中的乙個座標軸所在的方向,才能呈現出直角三角形這種效果。
節選自:《畫法幾何學》(大連理工教研室編)
嘗試把三角形第乙個頂點中的數值1.0(**47行),也就是z軸座標更改為0.5,檢視螢幕canvas畫布渲染的三角形是否有變化,若無變化,說明投影方向預設的是z
軸,也就是說z軸是webgl系統預設的觀察三維模型的視線方向,也就是說頂點的投影方向。
嘗試把三角形頂點2和頂點3座標中1.0,更改為0.5,觀察變化,回到數值初始狀態,再把其中的乙個1.0更改為2.0,觀察變化。可以看到超出1.0範圍的頂點,不會在圖形區域顯示出來,這就為以後顯示大場景提供了基礎,通過控制點座標值的大小就可以控制是否在場景中顯示出來,超出範圍的頂點對應畫素會被剪裁掉。
你可嘗試把三角形頂點2座標的y值1.0更改為-1.0,把頂點3行座標的x值1.0更改為-1.0,你可以看到三角形顯示在左下角,可以看出webgl座標系-1.0~1.0
區間對應的是canvas畫布的四個邊界線。
你可以嘗試把三角形三個頂點的z座標值都設定為-1.0~1.0
之外的數值,比如都更改為2.0
,重新整理瀏覽器你會發現canvas畫布上沒有任何三角形渲染效果,如果你更改其中乙個頂點的z座標為2.0
,你會發現顯示部分,其實這是因為頂點光柵化後,webgl系統會把z軸方向處在-1.0~1.0
區域之外片元畫素剪裁掉。這也就說明頂點光柵化之後得到的片元,只要不在xyz三個方向-1.0~1.0
範圍構成的立方體空間中,就會被剪裁掉。
canvas畫布寬高採用的是畫素值定義,以顯示器為準,webgl中頂點座標的表示方法採用的是相對座標,相對於canvas而言
webgl座標系統,x軸水平向右,也就是canvas畫布的width表示的寬度方向,x等於-1表示canvas畫布的左邊界,x等於1表示canvas畫布的右邊界,x等於0對應的是畫布寬度方向的中間。
webgl座標系統,y軸豎直向上,也就是canvas畫布的height表示的高度方向,y等於-1表示canvas畫布的下邊界,y等於1表示canvas畫布的上邊界,y等於0對應的是畫布高度方向的中間。
webgl座標系統,z軸垂直canvas畫布朝外,z值-1和1是z方向的極限值,gpu成像預設的沿著z軸投影,你也可以抽象出乙個概念,人眼睛位於z軸上,沿著z軸方向去觀察物體,如果你在其他的書上看到檢視座標系等其它各類座標系都是抽象出的概念 都是建立在本節課所說的webgl 座標系統之上,例如無人機導航中的所說的機體座標系、地球座標系都是直接對現實中事物的描述,三維場景中的各類座標系與無人機中座標系沒什麼區別,但是要顯示在螢幕上,就要經過一些處理,這裡不再詳述,後面的教程後為大家引入各類座標系概念, 正射投影和透射投影概念。
本節課**的執行流程與1.2案例**基本一樣,區別就是頂點陣列不一樣,webgl apigl.vertexattribpointer()
第二引數不一樣,1.2節例子是四個頂點,定義了每個頂點的x、y值,z值預設預設設定為1.0, 本案例中定義的是三個點,每個點都定義了xyz座標值,型別陣列就像乙個倉庫,儲存了大量資料,如何按照一定的規律從庫中取出資料,webgl定義了乙個api就是gl.vertexattribpointer()
方法,該方法的第2、5、6引數描述的就是如何取出,比如從哪個資料開始取出 每幾個資料為一組,間隔幾個資料,暫時不用關心,後面用到自然明白,根據這兩節課的學習,你至少知道第二引數定義的是幾個數字為一組表示乙個頂點的座標。
地理座標系 投影座標系
1.基本概念 平時開展gis開發 研究 應用工作,總會接觸到座標系,也會遇到座標轉換的問題,如地理座標系 投影座標系等。地理座標系是球面座標,參考平面是橢球面,座標單位是經緯度 投影座標系是平面座標系,參考平面是水平面,座標單位是公尺 千公尺等。地理座標系轉換到投影座標系的過程理解為投影,即將不規則...
大地座標系 地理座標系 投影座標系
大地座標系 是大地測量中以參考橢球面為基準面建立起來的座標系。地面點的位置用 大地經度 大地緯度和大地高度 表示。大地座標系的確立包括選擇乙個橢球 對橢球進行定位和確定大地起算資料。乙個形狀 大小和定位 定向都已確定的地球橢球叫參考橢球。參考橢球一旦確定,則標誌著大地座標系已經建立。大地座標系是一種...
地理座標系和投影座標系
用經緯度表示地面點位的球面座標系。在大地測量學中,對於地理座標系統中的經緯度有三種描述 天文經緯度 大地經緯度 地心經緯度。天文經緯度 表示地面點在大地水準面上的位置,用天文經度和天文緯度表示。大地經緯度 表示地面點在參考橢球面上的位置,用大地精度 大地緯度 大地高h表示 大地座標均以橢球面法線來定...