Javascript 为什么是WebGL';清除';拉到前缓冲器?

Javascript 为什么是WebGL';清除';拉到前缓冲器?,javascript,webgl,Javascript,Webgl,为什么不需要交换缓冲区或glFinish <!DOCTYPE html> <html> <head> <title>Game v.0.0</title> <script> var gl = null; function startGame() { { var canvas = document.getEle

为什么不需要交换缓冲区或glFinish

<!DOCTYPE html>
<html>
    <head>
        <title>Game v.0.0</title>
        <script>
            var gl = null;
            function startGame()
            {   {   var canvas = document.getElementById('gameCanvas');
                    var glNames = ["webgl", "experimental-webgl", "webkit-3d", "moz-webgl"];
                    for (var glNameI = 0; glNameI < glNames.length; ++glNameI)
                        try
                        {   gl = canvas.getContext(glNames[glNameI]);
                            if (gl) break;
                        }
                        catch(e)
                        {}
                    if(!gl)
                    {   canvas.outerHTML = "<a>WebGL NOT SUPPORTED? :(</a>";
                        return;
                    }
                }

                window.onkeydown = function(ev)
                {   switch(ev.keyCode)
                    {
                    case 49:// 1 key
                        gl.clearColor(0.3,0.7,0.2,1.0);
                        gl.clear(gl.COLOR_BUFFER_BIT); 
                        break;
                    case 50:// 2 key
                        gl.clearColor(0.3,0.2,0.7,1.0);
                        gl.clear(gl.COLOR_BUFFER_BIT); 
                        break;
                    }
                };
            }
        </script>
        <style type="text/css">
            canvas {border: 2px dotted blue;}
        </style>
    </head>

    <body onload="startGame()">
        <div><canvas id="gameCanvas" width="640" height="480"></canvas></div>
    </body>

</html>

游戏v.0.0
var-gl=null;
函数startName()
{{var canvas=document.getElementById('gameCanvas');
var glNames=[“webgl”、“实验性webgl”、“webkit-3d”、“moz-webgl”];
对于(变量glNameI=0;glNameI
因为WebGL就是这样工作的

WebGL自动交换/复制。每当您执行任何影响WebGL drawingBuffer(想想“backbuffer”)的操作时,它都会被标记为交换/复制。下次浏览器合成网页时,它将进行交换或复制。您可以告诉它始终复制。您不能告诉它始终交换

具体来说,使用
{preserveDrawingBuffer:true}
创建WebGL上下文,如中所示

gl = someCanvas.getContext("webgl", {preserveDrawingBuffer: true});
告诉WebGL您始终希望它进行复制

默认情况下,WebGL会根据各种因素选择交换或复制。例如,如果启用了抗锯齿,则始终是有效的副本(解析)如果禁用了抗锯齿,则可能是交换。此外,在这种默认情况下,当执行复制或交换后
preserveDrawingBuffer
为false时,它将清除backbuffer。这是为了尝试使其看起来一致,而不管它选择复制还是交换

如果
preserveDrawingBuffer
=true,则它永远不会清除backbuffer

如果要在多个JavaScript事件上执行大量工作,并且在所有工作完成之前不让用户看到结果,则需要使用附加纹理或renderbuffer渲染到帧缓冲区,然后在所有工作完成后渲染,而不是附加到画布(backbuffer)


至于
gl.finish
,这在WebGL中是没有作用的。它没有意义。

因为WebGL就是这样工作的

WebGL自动交换/复制。每当您执行任何影响WebGL drawingBuffer(想想“backbuffer”)的操作时,它都会被标记为交换/复制。下次浏览器合成网页时,它将进行交换或复制。您可以告诉它始终复制。您不能告诉它始终交换

具体来说,使用
{preserveDrawingBuffer:true}
创建WebGL上下文,如中所示

gl = someCanvas.getContext("webgl", {preserveDrawingBuffer: true});
告诉WebGL您始终希望它进行复制

默认情况下,WebGL会根据各种因素选择交换或复制。例如,如果启用了抗锯齿,则始终是有效的副本(解析)如果禁用了抗锯齿,则可能是交换。此外,在这种默认情况下,当执行复制或交换后
preserveDrawingBuffer
为false时,它将清除backbuffer。这是为了尝试使其看起来一致,而不管它选择复制还是交换

如果
preserveDrawingBuffer
=true,则它永远不会清除backbuffer

如果要在多个JavaScript事件上执行大量工作,并且在所有工作完成之前不让用户看到结果,则需要使用附加纹理或renderbuffer渲染到帧缓冲区,然后在所有工作完成后渲染,而不是附加到画布(backbuffer)

至于
gl.finish
,这在WebGL中是没有意义的。

FYI
“webkit-3d”
“moz-WebGL”
自WebGL 4年前发货以来一直不相关。FYI
“webkit-3d”
“moz-WebGL”
自WebGL 4年前发货以来一直不相关