Computergrafik
Web GL Matrices
← WebGL Shader | ● | WebGL Buffers →
WebGL stellt Vektor- und Matrizen-Operationen innerhalb eines Shaders aber nicht außerhalb zur Verfügung. Letztere müssen über ein Javascript-Package eingebunden werden.
Einbinden des https://github.com/toji/gl-matrix Javascript-Package:
<script type="text/javascript"
src="http://raw.githubusercontent.com/toji/gl-matrix/master/dist/gl-matrix-min.js">
</script>
src="http://raw.githubusercontent.com/toji/gl-matrix/master/dist/gl-matrix-min.js">
</script>
Dann können die üblichen affinen Transformationen definiert werden:
var pMatrix = mat4.create();
var mvMatrix = mat4.create();
mat4.perspective(45,
gl.viewportWidth / gl.viewportHeight,
0.1, 100.0,
pMatrix);
mat4.lookAt([0, 0, 1], [0, 0, 0], [0, 1, 0], mvMatrix);
mat4.translate(mvMatrix, [0.0, 0.0, -10.0]);
mat4.rotate(mvMatrix, angle, [0.0, 1.0, 0.0]);
var mvMatrix = mat4.create();
mat4.perspective(45,
gl.viewportWidth / gl.viewportHeight,
0.1, 100.0,
pMatrix);
mat4.lookAt([0, 0, 1], [0, 0, 0], [0, 1, 0], mvMatrix);
mat4.translate(mvMatrix, [0.0, 0.0, -10.0]);
mat4.rotate(mvMatrix, angle, [0.0, 1.0, 0.0]);
← WebGL Shader | ● | WebGL Buffers →