WebGL Textures & Vertices

Beginner's Guide

Page Eighty Nine

WebGL Textures & Vertices: Beginner's Guide Summary

WebGL Textures & Vertices: Beginner's Guide provided an introduction to WebGL for JavaScript designers and developers. We explained fundamental concepts of WebGL. The book covered how to declare a simple square mesh with vertices. We demonstrated mapping the mesh with textures from JPG image files. We explained how to crop, tile, and repeat textures.

The book's examples animate a rotating textured square. We briefly discussed animation with 4 x 4 matrices and the window's requestAnimationFrame() method. We included an overview of perspective projection, which provides a sense of depth. The animation section includes how to use WebGL API methods uniformMatrix4fv(WebGLUniformLocation, boolean, Float32Array) and drawElements(Number, Number, type, Number).

The book builds a foundation for future projects with element array buffers and two simple shaders. The examples demonstrated how to reuse data for efficient processing with indices.

For readers unfamiliar with shaders, we explained two shaders line by line. The shader section covered storage qualifiers attribute, uniform, and varying. The vertex shader discussed vec2, vec4 and mat4 types. The fragment shader explained how to use sampler2D with the built in function texture2D(). Sections titled Compile and Link Shaders with a Program and Compile & Link a Program, demonstrated how to use shaders with JavaScript and WebGL.

We don't rely on external libraries, but focus on WebGL itself. This introduction to WebGL, improves understanding of external libraries, if you chose to use them. Optionally create your own online WebGL projects.

WebGL Textures & Vertices: Beginner's Guide provided examples and explanation covering a long list of WebGL methods. Projects include working examples, thorough comments, explanation, and diagrams, to clarify each process. The list of WebGL methods includes createProgram(), attachShader(), linkProgram(), useProgram(), createShader(), shaderSource(), compileShader(), getShaderParameter(), getShaderInfoLog(), getUniformLocation(), uniformMatrix4fv(), getAttribLocation(), enableVertexAttribArray(), viewport(), createBuffer(), bindBuffer(), bufferData(), vertexAttribPointer(), uniformi(), createTexture(), activeTexture(), bindTexture(), pixelStorei(), texImage2D() , validateProgram(), getProgramParameter(), getProgramInfoLog(), deleteProgram(), and drawElements(). If you're interested in learning WebGL, WebGL Textures & Vertices: Beginner's Guide provided helpful information toward a great start.

WebGL Textures & Vertices: Beginner's Guide represents the first in the series titled Online 3D Media with WebGL. This book covers the most material focusing on initialization of buffers and individual textures. Subsequent books in the series discuss new features such as mipmaps, texture atlases, animated textures, and shader effects. Most of the books build upon the same source code.

Thank you for reading WebGL Textures & Vertices: Beginner's Guide. We hope this book helped you on the way toward creating 3D media for the Web. Enjoy free tutorials and learn about upcoming books at SevenThunderSoftware.com.

WebGL Beginner's Guide Introduction WebGL Beginner's Guide
Copyright © 2015 Seven Thunder Software. All Rights Reserved.