MENU

Fun & Interesting

WebGL Tutorial 03 - Textured Cube

Indigo Code 65,758 lượt xem 9 years ago
Video Not Working? Fix It Now

In this video, I demonstrate how to add textures to WebGL renderings by creating a spinning crate.

A live demo is available at http://www.kamaron.me/tutorial-live/webgl/03-textured-cube/

In this series, I will not be using any external libraries like Three.JS. These tutorials are intended for people comfortable (but not necessarily experienced) with JavaScript and HTML, with or without any prior graphics programming experience. Ideally, I would like anybody watching my full tutorial set to be able to create a 3D video game from scratch using WebGL.

OpenGL texture coordinates: http://stackoverflow.com/a/5532670/2589028
Applying textures to objects (OpenGL): https://open.gl/textures

Source code available at https://github.com/sessamekesh/IndigoCS-webgl-tutorials/tree/master/03%20-%20Textured%20Cube

glMatrix library used for math: http://glmatrix.net/

Other fantastic WebGL resources:
http://antongerdelan.net/opengl/webgl_starter.html
http://webglfundamentals.org/
https://www.chromeexperiments.com/webgl
https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial
https://msdn.microsoft.com/en-us/library/dn302341(v=vs.85).aspx

Comment