WebGL (Web Graphics Library) is the new standard for 3D graphics on the Web, designed for rendering 2D graphics and interactive 3D graphics. This tutorial starts with a basic introduction to WebGL, OpenGL, and the Canvas element of HTML-5, followed by a sample application. This tutorial contains dedicated chapters for all the steps required to write a basic WebGL application. It also contains chapters that explain how to use WebGL for affine transformations such as translation, rotation, and scaling.

This tutorial will be extremely useful for all those readers who want to learn the basics of WebGL programming.

It is an elementary tutorial and one can easily understand the concepts explained here with a basic knowledge of JavaScript or HTML-5 programming. However, it will help if you have some prior exposure to OpenGL language and matrix operation related to 3D graphics.

Course Content

WebGL Tutorial
WebGL Home
WebGL Introduction
WebGL Html5 Canvas Overview
WebGL Basics
WebGL Graphics Pipeline
WebGL Application
WebGL Sample Application
WebGL Context
WebGL Geometry
WebGL Shaders
Associating Attributes & Buffer Objects
WebGL Drawing a Model
WebGL Examples
WebGL Drawing Points
WebGL Drawing a Triangle
WebGL Modes of Drawing
WebGL Drawing a Quad
WebGL Colors
WebGL Translation
WebGL Scaling
WebGL Rotation
WebGL Cube Rotation
WebGL Interactive Cube
WebGL Quick Guide
WebGL Useful Resources
WebGL Discussion

Student Feedback

Course Rating