Javascript 显示新图表时清除HTML画布

因此，我正在构建一个AngularJs图表，它利用一个Angular库在画布标记上创建图表。但是，当我将新数据集拖放到画布上以重新绘制时，它将继续保存旧数据。我试图完成的是如果（有新数据）{清除画布}。我知道我必须使用：

canvasReset.clearRect(0, 0, canvas.width, canvas.height); 

---

在某个地方，但我真正寻找的是一个事件处理程序，用于帮助我确定画布上是否有任何内容，如果有，则清除它。然而，我并不是在寻找鼠标或鼠标点击等，而是在寻找一些东西，看看画布是否被利用

简而言之，你不能。但是您可以捕获mouseevnets，也可以包装canvas ctx绘图函数，如

var fill = ctx.fill;
ctx.fill = function(){
    fill.apply(this, arguments);
    setDirty();
};

---

为什么不是这样：canvas=document.getElementById（'canvas'）；document.getElementById（“base”）.addEventListener（'mouseover'，function（）{if（canvas.toDataURL（）==document.getElementById（'blank'）.toDataURL（））canvasReset.clearRect（0，0，canvas.width，canvas.height）；}）；因为您的解决方案性能昂贵。对于像100x100这样的小画布，它可以工作，但1000x1000可能会有性能问题。toDataUrl（）正在将位图转换为base64字符串，我用每个像素的比较测试了您的解决方案，结果是，38毫秒用于解决方案，44毫秒用于像素比较。所以你的解决方案很慢。