O'Reilly logo

WebGL Beginner's Guide by Brandon Jones, Diego Cantor

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Time for action — trying out cube maps

  1. Open the file ch7_Cubemap.html using your HTML5 internet browser. Once again, this contains a simple textured cube example on top of which we'll build the cube map example. We want to use the cube map to create a reflective-looking surface.
  2. Creating the cube map is a bit more complicated than the textures we've loaded in the past, so this time we'll use a function to simplify the asynchronous loading of individual cube faces. It's called loadCubemapFace and has already been added to the configure function. Below that function, add the following code which creates and loads the cube map faces:
    cubeTexture = gl.createTexture(); gl.bindTexture(gl.TEXTURE_CUBE_MAP, cubeTexture); gl.texParameteri(gl.TEXTURE_CUBE_MAP, ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required