HTML5 Canvas仅绘制可见图像

时间:2017-06-09 22:45:25

标签: javascript html5 canvas html5-canvas

是否可以在HTML5 Canvas上“检测”并仅绘制可见图像?这将在我的游戏中进行巨大的性能优化,例如,如果图像2被图像2覆盖,我怎么才能绘制图像2?

1 个答案:

答案 0 :(得分:0)

这是一种愚蠢的遮挡剔除,而不是像原始DOOM那样的花哨树有序集合。

我不知道这种方法的开销是否会得到回报,你需要尝试一下才能看到。可能会遗漏;或{}或两个。

count = count of all objects
for (i = 1; i < count; i++)
    visible[i] = true;
for i = 0; i < count; i++
{
    not_hidden = true;
    for (j = 0; j < count && not_hidden; j++)
    {
        if ((i!= j) && visible[j] 
            // if j is closer/on top -- reverse this if increased depth = -z not +z
            && (z-order[j] < z-order[i]) 
            // bounding rectangles 0,0 = top-left of screen
            && (obj[i].left <= obj[j].right) && (obj[i].right <= obj[j].right) && (obj[i].left >= obj[j].left)
            && (obj[i].top <= obj[j].bottom) && (obj[i].bottom <= obj[j].bottom) && (obj[i].top >= obj[j].top) )
        {
            visible[i] = false;
            not_hidden = false;
        }
    }
}

现在只绘制可见[ix]为真的对象