WebGL 帧缓冲区 附 深度缓冲区 和 模板缓冲区

    webgl 中渲染到纹理需要用到帧缓冲区，但是同时想使用深度缓冲区和模板缓冲区需要的步骤如下，直接上代码

            var width = 800;
            var height = 600;

            //创建帧缓冲区对象
            var frameBuffer = gl.createFramebuffer();
            //创建渲染缓冲区对象
            var renderbuffer = gl.createRenderbuffer();
            //绑定帧缓冲区
            gl.bindFramebuffer(gl.FRAMEBUFFER, frameBuffer);
            //绑定渲染缓冲区
            gl.bindRenderbuffer(gl.RENDERBUFFER, renderbuffer);
            //初始化渲染缓冲区，这里只指定了模板缓冲区，没有指定深度缓冲区
            //如果需要深度缓冲区，第二参数可改为 DEPTH_STENCIL,同时 framebufferRenderbuffer 的第二个参数为 DEPTH_STENCIL_ATTACHMENT
            gl.renderbufferStorage(gl.RENDERBUFFER, gl.STENCIL_INDEX8, width, height);
            gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.RENDERBUFFER,renderbuffer);

            //创建帧缓冲纹理
            var texture = gl.createTexture();
            gl.bindTexture(gl.TEXTURE_2D, texture);
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
            gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
            gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
            //附着帧缓冲区的颜色缓冲区
            gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);

想了解模板缓冲区的可以看我转载的一篇博文 WebGL 模板缓冲区