Chevron Down
Table of Contents
Chevron DownGetting Started
Chevron DownAPI Reference

Module Structure contains a lot of classes and functions that might make new users wonder where to get started. therefore organize classes and functions into groups, as shown in the following table and also in the folder structure of the source code

src/webglA set of classes covering all WebGL objects. Currently supports WebGL 2.0. These classes organize the WebGL2 API and makes it easy to work with in JavaScript.
src/coreA set of common classes across all 3D graphics applications. They are on a higher abstraction level than the WebGL API.'s signature Model class is in this folder.
src/geometryThis folder contains a collection of geometric primitives extending from the base Geometry class, including ConeGeometry, CubeGeometry, IcoSphereGeometry, PlaneGeometry, SphereGeometry, SphereGeometry. They can be used to create Models class with common geometries
src/modelsSome predefined subclasses of Models created from simple geometries from the src/geometry folder
src/ioNode.js and browser file loaders. Also enables using streams in browser.
src/packages/eventsA very simple browser event handling class used by examples
src/'s internal shader module system and shader assembler utility
src/webgl-utilsMiscellaneous utilies

WebGL Classes

The heart of is the webgl module, a set of JavaScript class wrappers covering all WebGL objects. From v4, After creating a context, perhaps with's createGLContext function, you have can start instantiating's WebGL2 classes: Buffer, FrameBuffer, RenderBuffer, Program, Shader, Texture2D, Texture3D, TextureCube, Query, TransformFeedback, VertexArrayObject

Core Classes

The core classes, with the signature Model class, represents a set of objects that is common in most 3D rendering libraries or engines. These objects are at higher abstraction levels than the actual WebGL objects and that can serve as the basic building blocks for most 3D applications.

  • Model - A renderable object with program, attributes, uniforms and other state required for rendering 3D objects on the screen
  • Geometry - Holds attributes and drawType for a primitive geometric object
  • AnimationLoop - A simple animation loop that connects with browser's animation mechanism

Basic Geometries and Models

A Geometry object holds a set of attributes (native JavaScript arrays) (vertices, normals, texCoords, indices) and a drawMode prop to indicate how to interpret those vertices and normals as actual geometries.

There are several basic geometry classes predefined in Geometry, ConeGeometry, CubeGeometry, IcoSphereGeometry, PlaneGeometry, SphereGeometry, SphereGeometry. They are all subclasses of the Geometry class.

Corresponding to those geometry objects, also provides commonly used Model classes that consist of basic geometries. These include Cone, Cube, Cylinder, IcoSphere, Plane and Sphere, etc...

Users are encouraged to write their own geometries and models and could include them in its future releases.