WebGL

Use WebGL in Internet Explorer 11 to create dynamic 2D and 3D graphics for games and interactive content.

WebGL is available on all IE11 devices. IE11 supports rendering WebGL pages including those written with three.js, a popular WebGL library.

With the emerging WebGL web standard, web developers can create new kinds of 2D and 3D experiences by programming the computer’s graphics processing unit (GPU). Using WebGL, you program the GPU directly to quickly render complex 3D objects and scenes.

Create WebGL content on your page

WebGL can range from simple to complex. However, all programs essentially perform the following steps:

  1. Add a canvas element to the page, and create a new WebGL rendering context.
  2. Initialize a viewport.
  3. Upload arrays of coordinate (vertices) and image data (fragments or textures) to the GPU.
  4. Compile and run vertex and fragment shaders (programs that run on the GPU) to manipulate the vertex and imaged loaded in the previous step.
  5. Draw to the screen.

The GPU is optimized for these types of operations which enables WebGL programs to perform at a high level.

Note  For an example that shows some of these steps, see the Get started with WebGL.

Here are a few resources to help you get started writing your own WebGL content.

LinkDescription
Learning WebGLStep-by-step guidance for writing WebGL code. Lots of news, links, and job opportunities.
Three.JS page Demos, source code, and links to resources for the popular three.js WebGL library.
Webplatform.orgWebGL documentation and examples

 

For more ideas, see this WebGL Resources page.

The WebGL implementation in IE11 is an early preview version. If you're writing WebGL pages, you can use IE11 to develop your content. Some of the WebGL functionality is unsupported at this time. For more about the IE11 implementation, see the IEblog.

Since WebGL is a web standard, you can write content that works across browsers and devices. For more info and best practices, see Hyper-Fast Web Graphics with WebGL.

Here are the methods, objects, and properties that are supported as of IE11.

APIType
activeTexture method
attachShader method
bindBuffer method
bindFramebuffer method
bindRenderbuffer method
bindTexture method
blendEquation method
blendEquationSeparate method
blendFunc method
blendFuncSeparate method
bufferData method
bufferSubData method
checkFramebufferStatus method
clear method
clearColor method
clearDepth method
colorMask method
compileShader method
copyTexImage2D method
copyTexSubImage2D method
createBuffer method
createProgram method
createShader method
createTexture method
cullFace method
deleteFramebuffer method
depthFunc method
depthMask method
depthRange method
disable method
disableVertexAttribArray method
drawArrays method
drawElements method
enable method
enableVertexAttribArray method
framebufferRenderbuffer method
framebufferTexture2D method
frontFace method
generateMipmap method
getActiveAttrib method
getActiveUniform method
getAttribLocation method
getAttachedShaders method
getBufferParameter method
getContextAttributes method
getError method
getExtension method
getFramebufferAttachmentParameter method
getParameter method
getProgramParameter method
getRenderbufferParameter method
getShaderParameter method
getShaderPrecisionFormat method
getShaderSource method
getSupportedExtensions method
getTexParameter method
getUniform method
getUniformLocation method
getVertexAttrib method
getVertexAttribOffset method
isEnabled method
linkProgram method
pixelStorei method
polygonOffset method
readPixels method
renderbufferStorage method
scissor method
shaderSource method
texImage2D method
texParameterf method
texParameteri method
texSubImage2D method
uniform1f method
uniform1fv method
uniform1i method
uniform1iv method
uniform2f method
uniform2fv method
uniform2i method
uniform2iv method
uniform3f method
uniform3fv method
uniform3i method
uniform3iv method
uniform4f method
uniform4fv method
uniform4i method
uniform4iv method
uniformMatrix2fv method
uniformMatrix3fv method
uniformMatrix4fv method
useProgram method
vertexAttribPointer method
viewport method
WebGLActiveInfo object
WebGLContextAttributes object
WebGLContextEvent object
WebGLContextEvent object
WebGLFramebuffer object
WebGLObject object
WebGLProgram object
WebGLRenderbuffer object
WebGLRenderingContext object
WebGLShader object
WebGLShaderPrecisionFormat object
WebGLTexture object
WebGLUniformLocation object
alpha property
canvas property
depth property
drawingBufferHeight property
drawingBufferWidth property
name property
precision property
premultipliedAlpha property
preserveDrawingBuffer property
rangeMax property
rangeMin property
size property
statusMessage property
type property

 

API reference

WebGL

Samples and tutorials

Get started with WebGL
Hyper-Fast Web Graphics with WebGL

Internet Explorer Test Drive demos

Everest: Rivers of Ice

 

 

Show:
© 2014 Microsoft. All rights reserved.