how to thoroughly remove JQPlot Chart

Question

Do you know how to thoroughly remove/clean JQPlot chart. Here is my code to clean it:

     $j("#reset").click(function() {

                                                  $j("#chart").empty();
                                                        if (plot1) {

                                                            plot1 = null;
                                                        }


                                            });

when I click reset button, the chart can be removed from my page, but when I choose new conditions from drop down lists to generate new chart, the old chart will overlap with the new chart, like this image showed Do you know how to truly clean the old chart? Thanks!

Answer 1

Maybe you want to use redraw method.

http://www.jqplot.com/docs/files/jqplot-core-js.html#jqPlot.redraw

Answer 2

You can redraw it with empty values using :

$.("#reset").click(function(){
  if(plot1){
    plot1 = $.jqplot('chart', [[[]]], {});
    plot1.redraw();
  }
});

Please see working example here

Answer 3

My method is "expensive" but works for me. Use .remove():

if ($("#chart").length) {
    $("#chart1").remove();
} else {
    $(parent).append("<div id=\"chart1\"></div>");
}
// put $.jqplot below here

Answer 4

You can use the destroy method. e.g.

if (C.chart != null) {
    C.chart.destroy();
    C.chart = null;
}
C.chart = $.jqplot("chart", chartData, {