docs/module-twgl_framebuffers.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>twgl/framebuffers - Documentation</title>

    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <link rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav>
    <li class="nav-link nav-home-link"><a href="index.html">Home</a></li><li class="nav-heading">Modules</li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl.html">twgl</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.addExtensionsToContext">addExtensionsToContext</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.bindFramebufferInfo">bindFramebufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.bindTransformFeedbackInfo">bindTransformFeedbackInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.bindUniformBlock">bindUniformBlock</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createBufferInfoFromArrays">createBufferInfoFromArrays</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createFramebufferInfo">createFramebufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createProgramInfo">createProgramInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createTexture">createTexture</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createTextures">createTextures</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createTransformFeedback">createTransformFeedback</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createTransformFeedbackInfo">createTransformFeedbackInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.createUniformBlockInfo">createUniformBlockInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.drawBufferInfo">drawBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.drawObjectList">drawObjectList</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.getContext">getContext</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.glEnumToString">glEnumToString</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.isWebGL1">isWebGL1</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.isWebGL2">isWebGL2</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.resizeCanvasToDisplaySize">resizeCanvasToDisplaySize</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.resizeFramebufferInfo">resizeFramebufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.resizeTexture">resizeTexture</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setAttribInfoBufferFromArray">setAttribInfoBufferFromArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setBlockUniforms">setBlockUniforms</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setBuffersAndAttributes">setBuffersAndAttributes</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setDefaults">setDefaults</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setTextureFromArray">setTextureFromArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setUniformBlock">setUniformBlock</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#.setUniforms">setUniforms</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl.html#~createContext">createContext</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_attributes.html">twgl/attributes</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.createAttribsFromArrays">createAttribsFromArrays</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.createBufferFromArray">createBufferFromArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.createBufferFromTypedArray">createBufferFromTypedArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.createBufferInfoFromArrays">createBufferInfoFromArrays</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.createBuffersFromArrays">createBuffersFromArrays</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.setAttribInfoBufferFromArray">setAttribInfoBufferFromArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_attributes.html#.setAttributePrefix">setAttributePrefix</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_draw.html">twgl/draw</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_draw.html#.drawBufferInfo">drawBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_draw.html#.drawObjectList">drawObjectList</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_framebuffers.html">twgl/framebuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_framebuffers.html#.bindFramebufferInfo">bindFramebufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_framebuffers.html#.createFramebufferInfo">createFramebufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_framebuffers.html#.resizeFramebufferInfo">resizeFramebufferInfo</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_m4.html">twgl/m4</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.axisRotate">axisRotate</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.axisRotation">axisRotation</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.copy">copy</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.create">create</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.frustum">frustum</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.getAxis">getAxis</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.getTranslation">getTranslation</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.identity">identity</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.inverse">inverse</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.lookAt">lookAt</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.multiply">multiply</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.negate">negate</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.ortho">ortho</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.perspective">perspective</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotateX">rotateX</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotateY">rotateY</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotateZ">rotateZ</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotationX">rotationX</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotationY">rotationY</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.rotationZ">rotationZ</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.scale">scale</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.scaling">scaling</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.setAxis">setAxis</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.setDefaultType">setDefaultType</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.setTranslation">setTranslation</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.transformDirection">transformDirection</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.transformNormal">transformNormal</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.transformPoint">transformPoint</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.translate">translate</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.translation">translation</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_m4.html#.transpose">transpose</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_primitives.html">twgl/primitives</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.concatVertices">concatVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.create3DFBufferInfo">create3DFBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.create3DFBuffers">create3DFBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.create3DFVertices">create3DFVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createAugmentedTypedArray">createAugmentedTypedArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCrescentBufferInfo">createCrescentBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCrescentBuffers">createCrescentBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCrescentVertices">createCrescentVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCresentBufferInfo">createCresentBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCresentBuffers">createCresentBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCresentBuffers">createCresentBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCubeBufferInfo">createCubeBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCubeBuffers">createCubeBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCubeVertices">createCubeVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCylinderBufferInfo">createCylinderBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCylinderBuffers">createCylinderBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createCylinderVertices">createCylinderVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createDiscBufferInfo">createDiscBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createDiscBuffers">createDiscBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createDiscVertices">createDiscVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createPlaneBufferInfo">createPlaneBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createPlaneBuffers">createPlaneBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createPlaneVertices">createPlaneVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createSphereBufferInfo">createSphereBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createSphereBuffers">createSphereBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createSphereVertices">createSphereVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTorusBufferInfo">createTorusBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTorusBuffers">createTorusBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTorusVertices">createTorusVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTruncatedConeBufferInfo">createTruncatedConeBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTruncatedConeBuffers">createTruncatedConeBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createTruncatedConeVertices">createTruncatedConeVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createXYQuadBufferInfo">createXYQuadBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createXYQuadBuffers">createXYQuadBuffers</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.createXYQuadVertices">createXYQuadVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.deindexVertices">deindexVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.duplicateVertices">duplicateVertices</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.flattenNormals">flattenNormals</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.makeRandomVertexColors">makeRandomVertexColors</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.reorientDirections">reorientDirections</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.reorientNormals">reorientNormals</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.reorientPositions">reorientPositions</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_primitives.html#.reorientVertices">reorientVertices</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_programs.html">twgl/programs</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.bindUniformBlock">bindUniformBlock</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createAttributeSetters">createAttributeSetters</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgram">createProgram</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramAsync">createProgramAsync</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramFromScripts">createProgramFromScripts</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramFromSources">createProgramFromSources</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramInfo">createProgramInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramInfoAsync">createProgramInfoAsync</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createProgramInfoFromProgram">createProgramInfoFromProgram</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createUniformBlockInfo">createUniformBlockInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createUniformBlockInfoFromProgram">createUniformBlockInfoFromProgram</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createUniformBlockSpecFromProgram">createUniformBlockSpecFromProgram</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.createUniformSetters">createUniformSetters</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.setBlockUniforms">setBlockUniforms</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.setBuffersAndAttributes">setBuffersAndAttributes</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.setUniformBlock">setUniformBlock</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.setUniforms">setUniforms</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#.setUniformsAndBindTextures">setUniformsAndBindTextures</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#~createProgramInfos">createProgramInfos</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#~createProgramInfosAsync">createProgramInfosAsync</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#~createPrograms">createPrograms</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_programs.html#~createProgramsAsync">createProgramsAsync</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_textures.html">twgl/textures</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.canFilter">canFilter</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.canGenerateMipmap">canGenerateMipmap</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.createTexture">createTexture</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.createTextures">createTextures</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.getBytesPerElementForInternalFormat">getBytesPerElementForInternalFormat</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.getFormatAndTypeForInternalFormat">getFormatAndTypeForInternalFormat</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.getNumComponentsForFormat">getNumComponentsForFormat</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.loadTextureFromUrl">loadTextureFromUrl</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.resizeTexture">resizeTexture</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setDefaultTextureColor">setDefaultTextureColor</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setEmptyTexture">setEmptyTexture</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setSamplerParameters">setSamplerParameters</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setTextureFilteringForSize">setTextureFilteringForSize</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setTextureFromArray">setTextureFromArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setTextureFromElement">setTextureFromElement</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#.setTextureParameters">setTextureParameters</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#~copyOptionsAndApplyPackState">copyOptionsAndApplyPackState</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#~createTextureAsync">createTextureAsync</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#~createTexturesAsync">createTexturesAsync</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_textures.html#~getPackStateOption">getPackStateOption</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_typedArray.html">twgl/typedArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_typedArray.html#.getGLTypeForTypedArray">getGLTypeForTypedArray</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_typedArray.html#.getGLTypeForTypedArrayType">getGLTypeForTypedArrayType</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_typedArray.html#.getTypedArrayTypeForGLType">getTypedArrayTypeForGLType</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_v3.html">twgl/v3</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.add">add</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.copy">copy</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.create">create</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.cross">cross</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.distance">distance</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.distanceSq">distanceSq</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.divide">divide</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.divScalar">divScalar</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.dot">dot</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.length">length</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.lengthSq">lengthSq</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.lerp">lerp</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.lerpV">lerpV</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.max">max</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.min">min</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.mulScalar">mulScalar</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.multiply">multiply</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.negate">negate</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.normalize">normalize</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.setDefaultType">setDefaultType</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_v3.html#.subtract">subtract</a></span></li><li class="nav-heading"><span class="nav-item-type type-module">M</span><span class="nav-item-name"><a href="module-twgl_vertexArrays.html">twgl/vertexArrays</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_vertexArrays.html#.createVAOAndSetAttributes">createVAOAndSetAttributes</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_vertexArrays.html#.createVAOFromBufferInfo">createVAOFromBufferInfo</a></span></li><li class="nav-item"><span class="nav-item-type type-function">F</span><span class="nav-item-name"><a href="module-twgl_vertexArrays.html#.createVertexArrayInfo">createVertexArrayInfo</a></span></li>
</nav>

<div id="main">
    
    <h1 class="page-title">twgl/framebuffers</h1>
    

<section>

<header>
    
        
</header>

<article>
    <div class="container-overview">
    
        
            <div class="description"><p>Framebuffer related functions</p>
<p>For backward compatibility they are available at both <code>twgl.framebuffer</code> and <code>twgl</code><br>
itself</p>
<p>See <a href="module-twgl.html"><code>module:twgl</code></a> for core functions</p></div>
        

<div class="section-method">


<dl class="details">

    
</dl>


</div>
        
    
    </div>

    
        <h3 class="subsection-title">Methods</h3>

        
<div class="section-method">

    
    <h4 class="name" id=".bindFramebufferInfo"><span class="type-signature">(static) </span>bindFramebufferInfo<span class="signature">(gl, framebufferInfo<span class="signature-attributes">opt</span>, target<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>

    
<div class="description">
    <p>Binds a framebuffer</p>
<p>This function pretty much solely exists because I spent hours<br>
trying to figure out why something I wrote wasn't working only<br>
to realize I forget to set the viewport dimensions.<br>
My hope is this function will fix that.</p>
<p>It is effectively the same as</p>
<pre><code>gl.bindFramebuffer(gl.FRAMEBUFFER, someFramebufferInfo.framebuffer);
gl.viewport(0, 0, someFramebufferInfo.width, someFramebufferInfo.height);</code></pre>
</div>


<dl class="details">

    
</dl>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>gl</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>WebGLRenderingContext</code></span>


            </td>

            
                <td class="attributes">
                

                </td>
            

            <td class="description last">
                <p>the WebGLRenderingContext</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>framebufferInfo</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code><a href="module-twgl.html#.FramebufferInfo">module:twgl.FramebufferInfo</a></code></span>
|

<span class="param-type"><code>null</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>a framebufferInfo as returned from <a href="module-twgl.html#.createFramebufferInfo"><code>module:twgl.createFramebufferInfo</code></a>.<br>
If falsy will bind the canvas.</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>target</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>number</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>The target. If not passed <code>gl.FRAMEBUFFER</code> will be used.</p>
                
            </td>
        </tr>

    
    </tbody>
</table>


</div>
        
            
<div class="section-method">

    
    <h4 class="name" id=".createFramebufferInfo"><span class="type-signature">(static) </span>createFramebufferInfo<span class="signature">(gl, attachments<span class="signature-attributes">opt</span>, width<span class="signature-attributes">opt</span>, height<span class="signature-attributes">opt</span>)</span><span class="type-signature"> &rarr; {<a href="module-twgl.html#.FramebufferInfo">module:twgl.FramebufferInfo</a>}</span></h4>

    
<div class="description">
    <p>Creates a framebuffer and attachments.</p>
<p>This returns a <a href="module-twgl.html#.FramebufferInfo"><code>module:twgl.FramebufferInfo</code></a> because it needs to return the attachments as well as the framebuffer.<br>
It also leaves the framebuffer it just created as the currently bound <code>FRAMEBUFFER</code>.<br>
Note: If this is WebGL2 or if you called <a href="module-twgl.html#.addExtensionsToContext"><code>module:twgl.addExtensionsToContext</code></a> then it will set the drawBuffers<br>
to <code>[COLOR_ATTACHMENT0, COLOR_ATTACHMENT1, ...]</code> for how ever many color attachments were created.</p>
<p>The simplest usage</p>
<pre><code>// create an RGBA/UNSIGNED_BYTE texture and DEPTH_STENCIL renderbuffer
const fbi = twgl.createFramebufferInfo(gl);
</code></pre>
<p>More complex usage</p>
<pre><code>// create an RGB565 renderbuffer and a STENCIL_INDEX8 renderbuffer
const attachments = [
  { format: RGB565, mag: NEAREST },
  { format: STENCIL_INDEX8 },
]
const fbi = twgl.createFramebufferInfo(gl, attachments);
</code></pre>
<p>Passing in a specific size</p>
<pre><code>const width = 256;
const height = 256;
const fbi = twgl.createFramebufferInfo(gl, attachments, width, height);
</code></pre>
<p><strong>Note!!</strong> It is up to you to check if the framebuffer is renderable by calling <code>gl.checkFramebufferStatus</code>.<br>
<a href="https://www.khronos.org/registry/webgl/specs/latest/1.0/#6.6">WebGL1 only guarantees 3 combinations of attachments work</a>.</p>
</div>


<dl class="details">

    
</dl>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>gl</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>WebGLRenderingContext</code></span>


            </td>

            
                <td class="attributes">
                

                </td>
            

            <td class="description last">
                <p>the WebGLRenderingContext</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>attachments</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>Array.&lt;<a href="module-twgl.html#.AttachmentOptions">module:twgl.AttachmentOptions</a>></code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>which attachments to create. If not provided the default is a framebuffer with an<br>
<code>RGBA</code>, <code>UNSIGNED_BYTE</code> texture <code>COLOR_ATTACHMENT0</code> and a <code>DEPTH_STENCIL</code> renderbuffer <code>DEPTH_STENCIL_ATTACHMENT</code>.</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>number</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>the width for the attachments. Default = size of drawingBuffer</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>height</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>number</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>the height for the attachments. Default = size of drawingBuffer</p>
                
            </td>
        </tr>

    
    </tbody>
</table>


<div class="section-returns">
<h5>Returns:</h5>

        
<dl class="param-type">
    <dt>
        Type:
    </dt>
    <dd>
        
<span class="param-type"><code><a href="module-twgl.html#.FramebufferInfo">module:twgl.FramebufferInfo</a></code></span>


    </dd>
</dl>


<div class="param-desc">
    <p>the framebuffer and attachments.</p>
</div>

    
</div>


</div>
        
            
<div class="section-method">

    
    <h4 class="name" id=".resizeFramebufferInfo"><span class="type-signature">(static) </span>resizeFramebufferInfo<span class="signature">(gl, framebufferInfo, attachments<span class="signature-attributes">opt</span>, width<span class="signature-attributes">opt</span>, height<span class="signature-attributes">opt</span>)</span><span class="type-signature"></span></h4>

    
<div class="description">
    <p>Resizes the attachments of a framebuffer.</p>
<p>You need to pass in the same <code>attachments</code> as you passed in <a href="module-twgl.html#.createFramebufferInfo"><code>module:twgl.createFramebufferInfo</code></a><br>
because TWGL has no idea the format/type of each attachment.</p>
<p>The simplest usage</p>
<pre><code>// create an RGBA/UNSIGNED_BYTE texture and DEPTH_STENCIL renderbuffer
const fbi = twgl.createFramebufferInfo(gl);

...

function render() {
  if (twgl.resizeCanvasToDisplaySize(gl.canvas)) {
    // resize the attachments
    twgl.resizeFramebufferInfo(gl, fbi);
  }
</code></pre>
<p>More complex usage</p>
<pre><code>// create an RGB565 renderbuffer and a STENCIL_INDEX8 renderbuffer
const attachments = [
  { format: RGB565, mag: NEAREST },
  { format: STENCIL_INDEX8 },
]
const fbi = twgl.createFramebufferInfo(gl, attachments);

...

function render() {
  if (twgl.resizeCanvasToDisplaySize(gl.canvas)) {
    // resize the attachments to match
    twgl.resizeFramebufferInfo(gl, fbi, attachments);
  }</code></pre>
</div>


<dl class="details">

    
</dl>


    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        
        <th>Attributes</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>gl</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>WebGLRenderingContext</code></span>


            </td>

            
                <td class="attributes">
                

                </td>
            

            <td class="description last">
                <p>the WebGLRenderingContext</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>framebufferInfo</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code><a href="module-twgl.html#.FramebufferInfo">module:twgl.FramebufferInfo</a></code></span>


            </td>

            
                <td class="attributes">
                

                </td>
            

            <td class="description last">
                <p>a framebufferInfo as returned from <a href="module-twgl.html#.createFramebufferInfo"><code>module:twgl.createFramebufferInfo</code></a>.</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>attachments</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>Array.&lt;<a href="module-twgl.html#.AttachmentOptions">module:twgl.AttachmentOptions</a>></code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>the same attachments options as passed to <a href="module-twgl.html#.createFramebufferInfo"><code>module:twgl.createFramebufferInfo</code></a>.</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>width</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>number</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>the width for the attachments. Default = size of drawingBuffer</p>
                
            </td>
        </tr>

    
        <tr>
            
                <td class="name"><code>height</code></td>
            

            <td class="type">
            
                
<span class="param-type"><code>number</code></span>


            </td>

            
                <td class="attributes">
                
                    &lt;optional><br>
                

                </td>
            

            <td class="description last">
                <p>the height for the attachments. Default = size of drawingBuffer</p>
                
            </td>
        </tr>

    
    </tbody>
</table>


</div>
        
    
</article>

</section>


</div>

<br class="clear">

<script src="scripts/prep.js"></script>
<script>prettyPrint();</script>
<script src="scripts/linenumber.js"></script>
</body>
</html>