twgl.js - WebGL 库


MIT
跨平台
JavaScript

软件简介

twgl.js 是一个使 WebGL API 更佳简洁的库。(WebGL 是一种
3D 绘图标准)

示例:

<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);
  function render(time) {
    twgl.resizeCanvasToDisplaySize(gl.canvas);
    gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
    var uniforms = {
      time: time * 0.001,
      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);
  }
  requestAnimationFrame(render);
</script>