WebGL教學
幾年前,Java應用程序(小程序和JOGL的組合) − 被用於通過解決在GPU(圖形處理單元)來處理網絡上的三維圖形。作爲小程序需要一個JVM運行,它變得很難依靠Java小程序。幾年後,人們就開始停止使用Java小程序了。
由Adobe (Flash, AIR)的Stage3D API提供了GPU硬件加速架構。使用這些技術,程序員可以對Web瀏覽器以及對iOS和Android平臺上開發2D和3D功能的應用程序。由於Flash是專有軟件,它不是用來作爲網絡標準。
OpenGL
OpenGL(開放式圖形庫)是跨語言,對於2D和3D圖形的跨平臺API。它是命令的集合。OpenGL4.5是OpenGL的最新版本。下表列出了一組相關的OpenGL技術。
API
採用的技術
OpenGL ES
它是從庫中的2D和3D圖形在嵌入式系統上 - 包括控制檯,手機,電器,和車輛。OpenGL ES3.1是它的最新版本。它是由Khronos Group維護,官方網站:www.khronos.org
JOGL
這是Java對OpenGL結合。 JOGL4.5是其最新的版本,它是由 jogamp.org維護
WebGL
這是JavaScript和OpenGL結合。 WebGL 1.0是其最新的版本,其 khronos group 由維護
OpenGLSL
OpenGL着色語言。它是一種編程語言,目前需要在OpenGL2.0及更高版本。它是OpenGL4.4核心規範的一部分。它是專爲嵌入式系統,如手機和平板電腦量身定製的API。
注 - 在WebGL我們使用GLSL來寫着色器。
WebGL是什麼東西?
WebGL(Web圖形庫)是Web上的3D圖形的新標準,它是專用於繪製2D圖形和交互式3D圖形的目的。它是從OpenGL ES 2.0庫,用於手機和其他移動設備的低級3D的API衍生。 WebGL提供ES2.0(嵌入式系統)類似的功能並在現代3D圖形硬件上表現優異。
它可以與HTML5使用一個JavaScript的API。 HTML5有幾個功能,支持3D圖形,如2D畫布,WebGL,SVG,CSS3D變換和SMIL。
WebGL代碼編寫在HTML5的
誰開發WebGL?
一個名叫Vladimir Vukicevic 的美國塞爾維亞軟件工程師做了基礎工作,並領導創建WebGL。
2007年,Vladimir開始致力於爲HTML文檔Canvas元素定義OpenGL原型。
2011年3月,克羅諾斯集團(Kronos Group)創建WebGL。
支持的瀏覽器
下表顯示了支持WebGL的瀏覽器的列表 -
瀏覽器名稱
版本
支持
Internet Explorer(IE)
11及以上
完全支持
Google Chrome
39及以上
完全支持
Safari
8
完全支持
Firefox
36及以上
部分支持
Opera
27及以上
部分支持
移動瀏覽器
瀏覽器名稱
版本
支持
Chrome for Android
42
部分支持
Android browser
40
部分支持
IOS Safari
8.3
完全支持
Opera Mini
8
不支持
Blackberry Browser
10
完全支持
IE mobile
10
部分支持
WebGL的優勢
下面是使用WebGL的優勢 -
JavaScript編程 − WebGL的應用程序是用JavaScript編寫的。使用這些應用程序,你可以直接用HTML文檔的其他元素來進行交互。也可以使用其他JavaScript庫(如JQuery)和HTML技術,以豐富WebGL應用程序。
越來越多的移動瀏覽器支持 − WebGL的還支持移動瀏覽器,如:iOS的Safari瀏覽器,Android瀏覽器和Chrome的Android。
開源 − WebGL是一個開源的工具。您可以訪問庫中的源代碼,並瞭解它是如何工作以及它是如何開發的。
無需編譯 − JavaScript是一種半編程和半HTML組件。爲了執行這個腳本,沒有必要對文件進行編譯。相反,您可以直接打開使用任何瀏覽器的文件,並馬上可以查看結果。因爲WebGL應用程序是使用JavaScript開發的,所以沒有必要編譯WebGL應用程序。
自動內存管理 − JavaScript支持自動內存管理。沒有必要對存儲器手工分配。 WebGL繼承了JavaScript的這個特性。
Easy to set up − 由於WebGL是整合在HTML 5中,所以沒有必要做額外的設置。要編寫一個WebGL的應用程序,所需要的是一個文本編輯器和網絡瀏覽器。
開發環境設置
沒有必要爲WebGL設置一個不同的環境。支持WebGL瀏覽器有自己的內置設置的WebGL。