使用单个canvas元素我使用javascript绘制了两个不同的图表，有什么方法可以删除canvas中最后绘制的图表。我的画布代码是<canvas style="width: 100px; height: 100px; border: 1px solid red;" id="cns"></canvas>，我使用javascript和按钮创建了我的图表点击我试图删除最后绘制的图var c = document.getElementById("cns");
var d = c.getContext("2d");
d.fillStyle = "#FF0000";
d.fillRect(0, 0, 106, 106);
var c1 = document.getElementById("cns");
var d1= c.getContext("2d");
d1.fillStyle = "#00A550";
d1.fillRect(0, 0, 90, 90);
$("#clk").click(function () {
d1.clearRect(0, 0, 90, 90);
});，但它会清除给定大小的整个矩形。有没有我可以清除最后绘制的图像
答案 0 :(得分：0)
在插入第二个图之前，您可以使用context.save()方法保存到画布。然后，当你想删除第二个图时，使用context.restore()，它应该可以解决问题。
答案 1 :(得分：0)
我看到您正在获取对同一画布的多个引用（id = cns）以及对其上下文的多个引用。
对于任何单个画布，该画布都有1个且仅有1个上下文。单个画布没有多个图层（例如Photoshop就是这样）。
因此，您的d和d1变量实际上包含相同的上下文。这就是为什么清除d或d1将清除画布上的相同区域的原因。
在画布上处理多组图纸（多个图表）的常用方法是：
保存足够的信息以重新创建每个单独的绘图（图表） - 通常保存在JS对象中。
清除整个画布。
使用保存的信息重新绘制当前所需的图表。