Javascript 计算画布的空白区域

帮助我：

我有一块帆布。画布中有一些形状，这些形状随时间随机变化，它们是不同的类型（如：三角形、平行四边形、梯形、正方形、圆形等）。在每次渲染这些形状之后，画布上还剩下一些空白区域

---

现在，在每次随机渲染这些形状之后，如何计算画布的空白区域？

从画布区域减去形状的区域

如果形状不重叠，则这是请求的区域

如果形状重叠，您可以计算重叠，将其添加回以前找到的区域

---

如果计算面积和重叠太困难，您可以使用蛮力将画布渲染为位图并计算彩色像素。

对您的实际设计一无所知，很难判断。精确确定这一点的唯一方法是计算画布的面积，减去所有形状的面积（您需要在某处存储对这些形状的引用），然后添加形状之间相交的面积。不精确的，方便的和设计不可知的方法来计算Cavas上留下的空白像素。如果你的画布的后背是相同的颜色，你可以通过所有的像素循环，并比较背面颜色像素的数量到所有其他彩色像素。