Chart.js functions for redrawing the contents of a canvas by emptying it

I put together a few methods I found on the web for clearing canvas

1. Resetting the height cleared the canvas, but it didn’t work when I used it

var c = document.getElementById("Canvas ID")
c.height=c.height;
Copy the code

2. Apply a layer of color to the canvas to cover the original drawing. This is only applicable to empty the filled color bar

var c = document.getElementById("Canvas ID")
c.clearRect(0.0,c.width,c.height);
Copy the code

Effective way to

// Delete the original canvas and create a new one
// Pass in the id of the canvas obtained by getElementById
function clearChartjsCanvas(c){
    // Delete the object
    c.remove();
    // Generate a new object
    var cdom = document.createElement("canvas");
    // Fill the new object with data
    cdom.setAttribute("id".'Chart_doughnut_fpm');
    cdom.setAttribute("width".'10');
    cdom.style.setProperty("height"."10");
    document.getElementById('Id of the canvas div').appendChild(cdom);
    // Get a new object
    var canvas = document.getElementById("Canvas ID")
    var ctx = canvas.getContext("2d");
}
Copy the code