“An Interactive Introduction to WebGL and three.js” by Haines
Conference:
Type(s):
Entry Number: 21
Title:
- An Interactive Introduction to WebGL and three.js
Course Organizer(s):
Presenter(s)/Author(s):
Abstract:
Prerequisites
Ability to read simple computer programs written in JavaScript, C, C++, or Java and a basic knowledge of computer graphics concepts, equivalent to the SIGGRAPH fundamentals course. No previous experience writing graphics applications is required.
Level
Introductory
Who Should Attend
Web application programmers who want to develop graphical applications but may have limited experience with computer graphics. Application programmers who have been writing applications with desktop OpenGL. Educators who are contemplating switching their courses to using WebGL or three.js as the graphics interface.
Description
For more than 15 years, OpenGL and its derivatives have been the most widely used APIs for creating interactive computer graphics applications across all major platforms. Over the past three years, there has been extraordinary interest in WebGL, the JavaScript implementation of OpenGL ES 2.0, and three.js, a scene graph and utility library built on top of WebGL. Applications developed using these APIs run in all major browsers. Programs can be located remotely, then accessed via their URLs and run locally, making use of the user’s GPU.
Although much is shared between the two APIs, there are major differences in how applications are developed in each and which is the best choice for a given project. Three.js is a scene graph API, so its primary job is to provide a description of the components of the scene, including the geometric objects, materials, and lights. Once the description is provided, the implementation renders the scene without the application programmer having to deal with the lower-level GPU interface. WebGL application programs allow the application to access the GPU more directly, through buffers and shaders. Knowing something about both APIs enables application programmers to make an informed choice.
This course provides an accelerated introduction to programming with WebGL and three.js. It starts with an overview of the architectural models and the development of the OpenGL family of APIs, then presents an overview of three.js that includes hands-on interactive examples that can be run and modified during the course (THIS EXAMPLE includes small modifications for SIGGRAPH attendees). The course concludes with an introduction to WebGL programming, also focusing on interactive examples.
