WebGL Tutorial
and more

WebGLEditor Test

Explicit Content

attribute vec4 aPosition; void main() { gl_Position = aPosition; }
precision mediump float; void main() { gl_FragColor = vec4(0.7, 0.7, 0.0, 1.0); }
import WebGLUtils from '/tutorials/webgl/fundamentals/examples/js/esm/WebGLUtils-v2.js'; let glu, gl; let vertexVBO1, vertexVBO2; initContext(); initVBOs(); render(); function initContext() { glu = new WebGLUtils({ vertexAttribs: ['aPosition'], renderFunc: render }); gl = glu.gl; gl.clearColor(0, 0, 0, 1); } function initVBOs() { let vertices = [ 0.0, 0.5, -0.5, -0.5, 0.5, -0.5 ]; vertexVBO1 = glu.createVBO(vertices, 2); vertexVBO2 = glu.createVBO([ 0.3, 0.3, 0.6, 0.3, 0.6, 0.6 ], 2); } function render() { gl.clear(gl.COLOR_BUFFER_BIT); glu.bindVboToAttribs(vertexVBO1); gl.drawArrays(gl.TRIANGLES, 0, vertexVBO1.verticesNum); glu.bindVboToAttribs(vertexVBO2); gl.drawArrays(gl.TRIANGLES, 0, vertexVBO1.verticesNum); }