WebGL Textures & Vertices

Beginner's Guide

Page Forty Six

Vertex Shader Line By Line

1.attribute vec4 a_position;   
2.attribute vec2 a_tex_coord0;

3.varying vec2 v_tex_coord0;
 
4.uniform mat4 um4_matrix;
5.uniform mat4 um4_pmatrix;
 
6.void main(void) {

7.gl_Position = um4_pmatrix * um4_matrix * a_position;

8.v_tex_coord0 = a_tex_coord0;

9.}

Listing 42b:Vertex Shader with Line Numbers

Line 1 attribute vec4 a_position; declares an attribute of type vec4 named a_position. Attribute a_position processes X, Y, and Z coordinates. The coordinates originate with our Float32Array of numbers representing vertex coordinates and texel coordinates.

When the vertex shader runs, the first three entries within a_position contain values for one vertex at a time. WebGL assigns the default value 1.0 to the last entry within a_position. Therefore a_position.x represents the X coordinate of one vertex. a_position.y represents the Y coordinate of one vertex. Each Float32Array prepared for the book's projects always assign 0.0 to the Z coordinate. a_position.z always equals 0.0.

Line 2 attribute vec2 a_tex_coord0; declares an attribute of type vec2 named a_tex_coord0. We run texels through this attribute. For example a_tex_coord0.s equals an S coordinate from our Float32Array of vertex and texel data. a_tex_coord0.t equals a T coordinate from our Float32Array of vertex and texel data. Every specified texel from the Float32Array runs through the vertex processor, one at a time. When the vertex shader runs, the two entries within a_tex_coord0 contain S and T values for one texel at a time.

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