Simple 3D WebGL

Written by Luis Cruz on Thursday, 08 September 2011. Posted in MSCS Project

An Intro to WebGL

Simple 3D WebGL

After an introductory exercise for drawing three primitive 2D shapes using WebGL, I am introducing some 3D shapes: a cube and pyramid. Not many changes are required for 3D; except adding more vertices. Here we introduce the drawElements function in order to draw each face of the cube independently and be able to color them.

Since WebGL does not support some matrix operations, I am using a 3rd party library for Matrix calculations that can be found here glMatrix.js. In this first example you will also see how to setup vertex and fragment shaders, how to color, and a bit more.You will be able to see the code on your browser by going to "View Code" menu.

 

You need an HTML5/WebGL compatible Browser (IE does not work) Check WebGL.

Social Bookmarks

About the Author

Luis Cruz

I am pursuing my MS in Computer Science at Georgia Institute of Technology (GaTech) with emphasis in Computer Graphics. I received by BS in Computer Science at GaTech in 2009 with specialization in Software Engineering and Computer Graphics.

Leave a comment

You are commenting as guest.