Question

我想使用WebGL渲染一个大场景（一个建模的城市），我认为遮挡剔除是优化性能的好方法。

我知道WebGL 2.0有一个名为“查询对象”的新功能来获取遮挡信息。但每次我使用 gl.getQueryParameter（query，gl.QUERY_RESULT）时，我都得到了相同的结果 1 。

我在这里写了一个演示来解释这个问题：

    var query = gl.createQuery();
    gl.beginQuery(gl.ANY_SAMPLES_PASSED, query);
    gl.drawArrays(gl.TRIANGLES,0,n);
    gl.endQuery(gl.ANY_SAMPLES_PASSED);

    var tick = function(){
        if(!gl.getQueryParameter(query,gl.QUERY_RESULT_AVAILABLE)){
            requestAnimationFrame(tick);
            return;
        }
        var result = gl.getQueryParameter(query,gl.QUERY_RESULT);
        console.log(Number(result));
        gl.deleteQuery(query);
    };

    tick();

这是我的顶点信息，表示三角形被第一个三角形遮挡。

    var vertexData = new Float32Array([
            0.0,0.5,0.0,        //first triangle
            -0.5,-0.5,0.0,
            0.5,-0.5,0.0,

            0.0,0.5,-0.5,       //second triangle
            -0.5,-0.5,-0.5,
            0.5,-0.5,-0.5
    ]);

，结果始终为1。

“1”的结果是什么？

此外，我如何使用WebGL 2.0进行遮挡剔除？有没有帮助样品？

Answer 1

遮挡查询和遮挡剔除不是一回事。

基本对象剔除可以（并且应该）完全在CPU上完成（例如，对象边界框上的平截头体检查，门户可见性，八叉树等）比在GPU上更有效，因为应用程序可以利用场景级知识图形驱动程序根本没有。

在GPU上，最容易通过使用前后渲染顺序渲染不透明对象来提供遮挡剔除（同样，游戏引擎通常会粗略地对对象批次进行排序），并使用深度测试来剔除模糊的东西。

遮挡查询是一种非常专业的工具，可用于少量视觉效果（例如镜头光晕），但在单帧内进行任何激进的剔除都非常难以进行管道处理。

Answer 2

首先，here is a good example介绍如何使用WebGL 2遮挡查询API。

与其他答案相反，遮挡查询可以绝对用于实施遮挡剔除。问题是您将需要一些复杂的CPU端数据结构/算法的帮助。我不会在这里差一点地自己解释它，而是将您引荐给实际的专家GPU Gems 2 - Chapter 6 Hardware Occlusion Queries Made Useful。如果没有适当的算法，则遮挡查询本身将比仅呈现对象要昂贵！

WebGL 2.0遮挡查询

2 个答案: