I'm currently adding a billboard mode to animated sprites and static sprites in my 3D engine.
The code below works fine, but I want to know if a more optimized solution exists. I've heard about another method using the transpose the view matrix, but this make some weird things in my case.
getModelMatrix() {
let matrix = Utils.MAT4_IDENTITY();
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(this.position[0], this.position[1], this.position[2]));
if (this.billboardMode) {
let viewMat = view.getCameraViewMatrix();
matrix = Utils.MAT4_MULTIPLY(matrix, view.getCameraMatrix()); // used to cancel the view camera matrix multiplication
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(viewMat[12], viewMat[13], viewMat[14])); // but keep position !
// or just do that, but not working
// matrix = Utils.MAT4_MULTIPLY(matrix, transpose(view.getCameraViewMatrix()));
}
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_Y(this.rotation[1]));
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_X(this.rotation[0])); // y -> x -> z
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_ROTATE_Z(this.rotation[2]));
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_SCALE(this.scale[0], this.scale[1], this.scale[2]));
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_SCALE(1 / this.pixelsPerUnit, 1 / this.pixelsPerUnit, 0));
matrix = Utils.MAT4_MULTIPLY(matrix, Utils.MAT4_TRANSLATE(-this.offset[0], -this.offset[1], 0));
return matrix;
}
What is the common way to transform a sprite to billboard ?