Teknik Informatika    
   
Daftar Isi ☛
(Sebelumnya) WebGainWebGUI (Berikutnya)

WebGL

WebGL
WebGL logo
WebGL out-of-core rendering: OpenWebGlobe
Screenshot from a WebGL-based application running in Google Chrome
Original author(s)Mozilla Foundation
Developer(s)WebGL Working Group
Stable release1.0 / March 3, 2011; 2 years ago (2011-03-03)[1]
Operating systemCross-platform
TypeAPI
Websitewww.khronos.org/webgl
HTML

WebGL (Web Graphics Library) is a JavaScript API for rendering interactive 3D graphics and 2D graphics[2] within any compatible web browser without the use of plug-ins. WebGL is integrated completely into all the web standards of the browser allowing GPU accelerated usage of physics and image processing and effects as part of the web page canvas. WebGL elements can be mixed with other HTML elements and composited with other parts of the page or page background.[3] WebGL programs consist of control code written in JavaScript and shader code that is executed on a computer's Graphics Processing Unit (GPU). WebGL is designed and maintained by the non-profit Khronos Group.[4]

Contents

Design

WebGL is based on OpenGL ES 2.0 and provides an API for 3D graphics.[5] For security reasons, GL_ARB_robustness (OpenGL 3.x) or GL_EXT_robustness (OpenGL ES) is needed. It uses the HTML5 canvas element and is accessed using Document Object Model interfaces. Automatic memory management is provided as part of the JavaScript language.[4]

WebGL lacks the matrix mathematics routines deprecated in OpenGL 3.0. This functionality must instead be provided by the user in the JavaScript code space; this necessary code is frequently supplemented by a matrix library such as glMatrix, TDL, or mjs.

History

WebGL grew out of the Canvas 3D experiments started by Vladimir Vukićević at Mozilla. Vukićević first demonstrated a Canvas 3D prototype in 2006. By the end of 2007, both Mozilla[6] and Opera[7] had made their own separate implementations.

In early 2009, the non-profit technology consortium Khronos Group started the WebGL Working Group, with initial participation from Apple, Google, Mozilla, Opera, and others.[4][8] Version 1.0 of the WebGL specification was released March 2011.[1] As of March 2012, the chair of the working group is Ken Russell.

Notable early applications of WebGL include Google Maps and Zygote Body.[9][10]

Implementation

Desktop Browsers

  • Mozilla Firefox – WebGL has been enabled on all platforms that have a capable graphics card with updated drivers since version 4.0.[11] Mozilla Firefox 8.0 and newer versions use Cross-origin resource sharing (CORS) to control all WebGL cross-domain textures.[12][13]
  • Google Chrome – WebGL has been enabled on all platforms that have a capable graphics card with updated drivers since version 9.[14] Google Chrome 13.0 and newer versions use Cross-origin resource sharing (CORS) to control all WebGL cross-domain textures.[15]
  • Safari – Safari 5.1 and newer versions installed on Mac OS X Lion and Mac OS X Snow Leopard implemented support for WebGL, which is disabled by default.[16][17][18][19][20]
  • Opera – WebGL has been implemented in Opera 11 and 12, also disabled by default.[21][22]
  • Internet Explorer – As of version 10, there is no built-in support for WebGL, and Microsoft has not announced any plans for implementing it in the future. WebGL support can be manually added to Internet Explorer using third-party plugins such as Chrome Frame and IEWebGL.[23]

Mobile Browsers

  • Nokia N900 – WebGL is available in the stock microB browser from the PR1.2 firmware update onwards.[24]
  • BlackBerry PlayBook – WebGL is available via WebWorks and browser in PlayBook OS 2.0[25]
  • Google Chrome - WebGL is available for Android devices in unstable builds since January 2013.[26]
  • Firefox for mobile – WebGL is available for Android devices in unstable builds since early 2011.[27]
  • The Sony Ericsson Xperia range of Android smartphones have had WebGL capabilities following a firmware upgrade.[28]
  • Opera Mobile 12 final supports WebGL (on Android only).[29]
  • Tizen 1.0

Content creation

WebGL scenes can be created without programming using a content creation tool such as Blender or Autodesk Maya. The scenes are then exported to WebGL. This was first possible with Inka3D, a WebGL export plugin for Maya. There are also services to publish interactive 3D content online using WebGL such as p3d.in and Sketchfab. Some game and simulation authoring tools combine model creation, scene creation and programming. AgentCubes[30][31] is a 3D game design authoring tool aimed at end users with no modeling and programing background. It combines model creation and drag and drop programing to create WebGL based games.

See also

References

  1. ^ a b "Khronos Releases Final WebGL 1.0 Specification". http://www.khronos.org/news/press/rel eases/khronos-releases-final-webgl-1. 0-specification. Retrieved 3 March 2011.
  2. ^ Gregg Tavares (Feb. 9, 2012). "WebGL Fundamentals". HTML5 Rocks. http://www.html5rocks.com/en/tutorial s/webgl/webgl_fundamentals/.
  3. ^ Tony Parisi (15 Aug 2012). "WebGL: Up and Running". O'Reilly Media, Incorporated. http://my.safaribooksonline.com/book/ animation-and-3d/9781449326487/chapte r-6dot-integrating-2d-and-3d/overlayi ng_3d_visuals_on_2d_pa.
  4. ^ a b c "WebGL – OpenGL ES 2.0 for the Web". Khronos.org. http://www.khronos.org/webgl/. Retrieved 2011-05-14.
  5. ^ "WebGL Specification". Khronos.org. http://www.khronos.org/registry/webgl /specs/latest/. Retrieved 2011-05-14.
  6. ^ "Canvas 3D: GL power, web-style". Blog.vlad1.com. http://blog.vlad1.com/2007/11/26/canv as-3d-gl-power-web-style/. Retrieved 2011-05-14.
  7. ^ "Taking the canvas to another dimension". My.opera.com. 2007-11-26. http://my.opera.com/timjoh/blog/2007/ 11/13/taking-the-canvas-to-another-di mension. Retrieved 2011-05-14.
  8. ^ "Khronos Details WebGL Initiative to Bring Hardware-Accelerated 3D Graphics to the Internet". Khronos.org. 2009-08-04. http://www.khronos.org/news/press/rel eases/khronos-webgl-initiative-hardwa re-accelerated-3d-graphics-internet. Retrieved 2011-05-14.
  9. ^ "Google Body – Google Labs". Bodybrowser.googlelabs.com. http://bodybrowser.googlelabs.com. Retrieved 2011-05-14.
  10. ^ Bhanoo, Sindya N. (2010-12-23). "New From Google: The Body Browser". Well.blogs.nytimes.com. http://well.blogs.nytimes.com/2010/12 /23/new-from-google-the-body-browser/. Retrieved 2011-05-14.
  11. ^ "Mozilla Firefox 4 Release Notes". Mozilla.com. 2011-03-22. http://www.mozilla.com/en-US/firefox/ 4.0/releasenotes/. Retrieved 2012-03-20.
  12. ^ "Cross-domain textures". Developer.mozilla.org. 2012-01-28. http://developer.mozilla.org/en/WebGL /Cross-Domain_Textures. Retrieved 2012-03-20.
  13. ^ on November 8, 2011 by Benoit Jacob (2011-11-08). "Using CORS to load WebGL textures from cross-domain images". Hacks.mozilla.org. http://hacks.mozilla.org/2011/11/usin g-cors-to-load-webgl-textures-from-cr oss-domain-images/. Retrieved 2012-03-20.
  14. ^ February 8, 2011 – 7:56am ET (2012-03-03). "Google releases Chrome 9; comes with Google Instant, WebGL – FierceCIO:TechWatch". FierceCIO. http://www.fiercecio.com/techwatch/st ory/google-releases-chrome-9-comes-go ogle-instant-webgl/2011-02-08. Retrieved 2012-03-20.
  15. ^ "Using Cross-domain images in WebGL and Chrome 13". Blog.chromium.org. 2011-07-06. http://blog.chromium.org/2011/07/usin g-cross-domain-images-in-webgl-and.ht ml. Retrieved 2012-03-20.
  16. ^ "New in OS X Lion: Safari 5.1 brings WebGL, Do Not Track and more". Fairerplatform.com. 2011-05-03. http://fairerplatform.com/2011/05/new -in-os-x-lion-safari-5-1-brings-webgl -do-not-track-and-more/. Retrieved 2012-03-20.
  17. ^ "Enable WebGL in Safari". Ikriz.nl. 2011-08-23. http://www.ikriz.nl/2011/08/23/enable -webgl-in-safari. Retrieved 2012-03-20.
  18. ^ "Getting a WebGL Implementation". Khronos.org. 2012-01-13. http://www.khronos.org/webgl/wiki/Get ting_a_WebGL_Implementation. Retrieved 2012-03-20.
  19. ^ "Implementations/WebKit". Khronos.org. 2011-09-03. http://www.khronos.org/webgl/wiki/Imp lementations/WebKit. Retrieved 2012-03-20.
  20. ^ "WebGL Now Available in WebKit Nightlies". Webkit.org. http://www.webkit.org/blog/603/webgl- now-available-in-webkit-nightlies/. Retrieved 2012-03-20.
  21. ^ "WebGL and Hardware Acceleration". My.opera.com. 2011-02-28. http://my.opera.com/core/blog/2011/02 /28/webgl-and-hardware-acceleration-2. Retrieved 2012-03-20.
  22. ^ "Introducing Opera 12 alpha". My.opera.com. 2011-10-13. http://my.opera.com/desktopteam/blog/ 2011/10/13/introducing-opera-12-alpha. Retrieved 2012-03-20.
  23. ^ "FAQ". Iewebgl. http://www.iewebgl.com/Faq.aspx. Retrieved 2012-03-20.
  24. ^ suihkulokki (2010-06-07). "WebGL on N900". Suihkulokki.blogspot.com. http://suihkulokki.blogspot.com/2010/ 06/webgl-on-n900.html. Retrieved 2011-05-14.
  25. ^ Halevy, Ronen. "PlayBook OS 2.0 Developer Beta Includes WebGL, Flash 11, & AIR 3.0". BerryReview. http://www.berryreview.com/2011/10/18 /playbook-os-2-0-developer-beta-inclu des-webgl-flash-11-air-3-0/. Retrieved 15 November 2011.
  26. ^ Brandon Jones (2013-01-10). "Get WebGL working on the Android Chrome Beta". Tojicode. http://blog.tojicode.com/2013/01/get- webgl-working-on-android-chrome-beta. html. Retrieved 2013-02-12.
  27. ^ iclkevin (2011-11-12). "WebGL on Mobile Devices". iChemLabs. http://www.ichemlabs.com/1375. Retrieved 2011-11-25.
  28. ^ "Xperia™ phones first to support WebGL™ – Developer World". blogs.sonyericsson.com. The Sony Ericsson Developer Program. November 29, 2011. http://blogs.sonyericsson.com/wp/2011 /11/29/xperia-phones-first-to-support -webgl/. Retrieved December 5, 2011.
  29. ^ "Opera Mobile 12". Opera Software. http://my.opera.com/mobile/blog/2012/ 02/27/opera-mobile-12. Retrieved 27 February 2012.
  30. ^ AgentCubes - a game design tool
  31. ^ The Scalable Game Design arcade featuring WebGL based games

External links

(Sebelumnya) WebGainWebGUI (Berikutnya)