Webgl operation

Rules for elements of different types of numbers in WebGL:

Vector and floating-point operations

vec3 v3a = vec3(1.0.2.0.3.0)
f =1.0

v3b = v3a + f   / / (2.0, 3.0, 4.0)
// v3b.x = v3a.x +f
// v3b.y = v3a.y +f
// v3b.z = v3a.z +f

Copy the code

Vector operation

v3c = v3a+v3b / / (3.0, 5.0, 7.0)
// v3c.x = v3a.x +v3b.x
// v3c.y = v3a.y +v3b.y
// v3c.z = v3a.z +v3b.z
Copy the code

Operations on matrices and floating point numbers

Operations on matrices and floating point numbers occur on each component of the matrix

m3b = m3a *f;
// m3b[0].x = m3a[0].x * f; m3b[0].y = m3a[0].y * f; m3b[0].z = m3a[0].z * f;
// m3b[1].x = m3a[1].x * f; m3b[1].y = m3a[1].y * f; m3b[1].z = m3a[1].z * f;
// m3b[2].x = m3a[2].x * f; m3b[2].y = m3a[2].y * f; m3b[2].z = m3a[2].z * f;
Copy the code

matrixRight by the vector

The result of a matrix multiplied by a vector is a vector, where each component is the corresponding component of the original vector, multiplied by the sum of the product of each element in the corresponding row of the matrix.

v3b = m3a * v3a;
// v3b.x = m3a[0].x * v3a.x + m3a[1].x * v3a.y + m3a[2].x * v3a.z;
// v3b.y = m3a[0].y * v3a.x + m3a[1].y * v3a.y + m3a[2].y * v3a.z;
// v3b.z = m3a[0].z * v3a.x + m3a[1].z * v3a.y + m3a[2].z * v3a.z;
Copy the code

matrixLeft by the vector

The result of a matrix multiplied by a vector is a vector, where each component is the corresponding component of the original vector, multiplied by the sum of the product of each element in the corresponding column of the matrix.

v3b = v3a * m3a;
// v3b.x = v3a.x * m3a[0].x + v3a.y * m3a[0].y + v3a.z * m3a[0].z;
// v3b.y = v3a.x * m3a[1].x + v3a.y * m3a[1].y + v3a.z * m3a[1].z;
// v3b.x = v3a.x * m3a[2].x + v3a.y * m3a[2].y + v3a.z * m3a[2].z;
Copy the code

Matrix times matrix

Matrix A * matrix B is equal to the sum of each element of the row corresponding to matrix A * each element of the column corresponding to matrix B

m3c = m3a * m3b;
// m3c[0].x = m3a[0].x * m3b[0].x + m3a[1].x * m3b[0].y + m3a[2].x * m3b[0].z ;
// m3c[1].x = m3a[0].x * m3b[1].x + m3a[1].x * m3b[1].y + m3a[2].x * m3b[1].z ;
// m3c[2].x = m3a[0].x * m3b[2].x + m3a[1].x * m3b[2].y + m3a[2].x * m3b[2].z ;

// m3c[0].y = m3a[0].y * m3b[0].x + m3a[1].y * m3b[0].y + m3a[2].y * m3b[0].z ;
// m3c[1].y = m3a[0].y * m3b[1].x + m3a[1].y * m3b[1].y + m3a[2].y * m3b[1].z ;
// m3c[2].y = m3a[0].y * m3b[2].x + m3a[1].y * m3b[2].y + m3a[2].y * m3b[2].z ;

// m3c[0].z = m3a[0].z * m3b[0].x + m3a[1].z * m3b[0].y + m3a[2].z * m3b[0].z ;
// m3c[1].z = m3a[0].z * m3b[1].x + m3a[1].z * m3b[1].y + m3a[2].z * m3b[1].z ;
// m3c[2].y = m3a[0].z * m3b[2].x + m3a[1].z * m3b[2].y + m3a[2].z * m3b[2].z ;
Copy the code