TWGL- WebGL 助手库

JavaScript 常用JavaScript包

详细介绍

TWGL.js 是一个微型的 WebGL 助手库,实现对 WebGL API 的简单封装,使用起来更方便。

示例代码:

<canvas id="c"></canvas>
<script src="../dist/twgl-full.min.js"></script>
<script>
    var gl = twgl.getWebGLContext(document.getElementById("c"));
    var programInfo = twgl.createProgramInfo(gl, ["vs", "fs"]);
     
    var arrays = {
        position: [-1, -1, 0, 1, -1, 0, -1, 1, 0, -1, 1, 0, 1, -1, 0, 1, 1, 0],
    };
    var bufferInfo = twgl.createBufferInfoFromArrays(gl, arrays);
    var start = Date.now() * 0.001;
     
    function render() {
        twgl.resizeCanvasToDisplaySize(gl.canvas);
        gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
         
        var uniforms = {
            time: Date.now() * 0.001 - start,
            resolution: [gl.canvas.width, gl.canvas.height],
        };
     
        gl.useProgram(programInfo.program);
        twgl.setBuffersAndAttributes(gl, programInfo, bufferInfo);
        twgl.setUniforms(programInfo, uniforms);
        twgl.drawBufferInfo(gl, gl.TRIANGLES, bufferInfo);
         
        requestAnimationFrame(render);
    }
    render();
</script>