html画布不会重新绘制

我画五颜六色的画布，点击重画，画黑色矩形。但矩形不会移除！我做错了什么？ 演示：

函数绘制调色板（）{
$c=document.getElementById（'palette'）；
$ctx=$c.getContext（'2d'）；
变量大小=256；
$ctx.clearRect（0，0，size，size）//
var r=255；
变量a=255；
对于（var g=0；g

应该有beginPath和closePath方法

$ctx.beginPath();
$ctx.rect(x-radius, y-radius, 2*radius+1, 2*radius+1);
$ctx.strokeStyle = 'black';
$ctx.stroke();
$ctx.closePath();

---

我刚刚解决了一个类似的问题。我有一个在web端用javascript编程的图表和一个向图表传输数据的服务器。使用WebSocket实时更新图表

基本上，在onmessage事件中，Canvas对象是使用DOM销毁和构造的。销毁前一个对象后，这将确保它正确地重新绘制

这就是我所做的

    var c = document.getElementsByName("myCanvas")[0];

    if (c != null)
    {
        c.remove();
    }

    var c = document.createElement("canvas");
    c.setAttribute("name", "myCanvas");
    c.setAttribute("width", 900);
    c.setAttribute("height", 600);
    c.setAttribute("style", "border:1px solid #d3d3d3");

    var ctx = c.getContext("2d");



    document.body.append(c);

    var c = document.getElementsByName("myCanvas")[0];

    if (c != null)
    {
        c.remove();
    }

    var c = document.createElement("canvas");
    c.setAttribute("name", "myCanvas");
    c.setAttribute("width", 900);
    c.setAttribute("height", 600);
    c.setAttribute("style", "border:1px solid #d3d3d3");

    var ctx = c.getContext("2d");



    document.body.append(c);