WebGL

Nutzen Sie WebGL in Internet Explorer 11, um dynamische 2D- und 3D-Grafiken für Spiele und interaktive Inhalte zu erstellen.

WebGL steht auf allen Geräten mit IE11 zur Verfügung. IE11 unterstützt das Rendern von WebGL-Seiten. Das gilt auch für Seiten, die mit three.js (einer gängigen WebGL-Bibliothek) erstellt wurden.

Mit dem aufkommenden WebGL-Webstandard können Webentwickler durch Programmieren des Grafikprozessors (Graphics Processing Unit, GPU) des Computers neue Arten von 2D- und 3D-Umgebungen schaffen. Mit WebGL programmieren Sie die GPU direkt, um komplexe 3D-Objekte und -Szenen schnell zu rendern.

Erstellen von WebGL-Inhalt auf Ihrer Seite

WebGL kann einfach bis komplex sein. Mit allen Programmen werden jedoch im Prinzip die folgenden Schritte ausgeführt:

  1. Fügen Sie der Seite ein canvas-Element hinzu, und erstellen Sie einen neuen WebGL-Renderkontext.
  2. Initialisieren Sie einen Viewport.
  3. Laden Sie Arrays mit Koordinatendaten (Vertizes) und Bilddaten (Fragmente oder Texturen) in den GPU hoch.
  4. Kompilieren Sie Vertex- und Fragmentshader (auf der GPU ausgeführte Programme), und führen Sie sie aus, um den Vertex und das Bild, die im vorherigen Schritt geladen wurden, zu bearbeiten.
  5. Zeichnen Sie auf den Bildschirm.

Die GPU ist für diese Vorgänge optimiert, weshalb WebGL-Programme schnell ausgeführt werden können.

Hinweis  Ein Beispiel, in dem einige dieser Schritte gezeigt werden, finden Sie unter Erste Schritte mit WebGL.

Im Folgenden finden Sie einige Ressourcen, die Sie beim Einstieg in die Erstellung eigener WebGL-Inhalte unterstützen.

LinkBeschreibung
Erlernen von WebGLSchrittweise Anleitung für die Erstellung von WebGL-Code. Viele Neuigkeiten, Links und Stellenangebote.
Seite zu "Three.JS" Demos, Quellcode und Links zu Ressourcen für die beliebte WebGL-Bibliothek "three.js".
Webplatform.orgWebGL-Dokumentation und Beispiele

 

Weitere Anregungen finden Sie auf der WebGL-Seite Ressourcen.

Die WebGL-Implementierung in IE11 ist eine frühe Vorschauversion. Bei der Erstellung von WebGL-Seiten können Sie IE11 zum Entwickeln Ihrer Inhalte verwenden. Bestimmte WebGL-Funktionen werden derzeit nicht unterstützt. Weitere Informationen zur IE11-Implementierung finden Sie im IEBlog.

Da es sich bei WebGL um einen Webstandard handelt, können Sie Inhalte erstellen, die browser- und geräteübergreifend verwendet werden können. Weitere Informationen sowie bewährte Methoden finden Sie unter Hyper-Fast Web Graphics with WebGL.

Im Folgenden finden Sie die ab IE11 unterstützten Methoden, Objekte und Eigenschaften.

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

 

API-Referenz

WebGL

Beispiele und Lernprogramme

Erste Schritte mit WebGL
Hyper-Fast Web Graphics with WebGL

Demos für die Internet Explorer-Testversion

Everest: Rivers of Ice

 

 

Anzeigen:
© 2014 Microsoft