jquery - 跳过 div 后面的绘图画布

Question

我canvas的文档中有一个 HTML5。在该画布上div可能有一些 s，将画布隐藏在它们后面（但画布的一部分仍然可见）。

知道画布的位置如何检查哪些 div 实际覆盖了画布，以便我不再在这些 div 后面绘制以提高性能？

我实际上如何只绘制画布的一部分以节省一些处理能力？

Answer 1

要确定是否存在重叠：

var divid = document.getElementById ("myDiv");
var canvasid = document.getElementById ("myCanvas");

var div = divid.getBoundingClientRect();
var canvas = canvasid.getBoundingClientRect();

var overlap = !(div.right < canvas.left || 
                div.left > canvas.right || 
                div.bottom < canvas.top || 
                div.top > canvas.bottom);

为了防止在分层 div 下绘制，我会在画布上的绘图中使用左/右/上/下偏移。