如何检查画布是否为空白？

Question

如果HTML5画布为空白或有彩色像素,我该如何检查.有快速的方法吗？

<canvas width="200" height="200"></canvas>

Answer 1

您可以创建一个新的空白画布,并比较数据URL.

// returns true if all color channels in each pixel are 0 (or "blank")
function isCanvasBlank(canvas) {
  return !canvas.getContext('2d')
    .getImageData(0, 0, canvas.width, canvas.height).data
    .some(channel => channel !== 0);
}

的jsfiddle