在同一容器ID中显示不同图表的顶点图表

如何解决在同一容器ID中显示不同图表的顶点图表

我试图通过同一容器ID中的按钮调用不同的图形。我尝试使用destroy方法删除任何以前的图表，但是它似乎不起作用。上一张图一直显示。

// First graph
function get_res_graph() {
    var url = "pkg_graphs_ajax.BAR_MTL_POWER";
    var v_data1 = []
    var v_data2 = [];
    var chart1 = new ApexCharts(document.querySelector("#g_container1"),options);
    chart1.render();
    // here is the ajax call to get data for the graph and using the graph method updateSeries
}

// Second graph
function get_resource_util_mon_graph() {
    var url = "pkg_graphs_ajax.LINE_AP_GRAFIK";
    var v_data1 = []
    var v_data2 = [];
    var v_xcat = [];
    //chart1.destroy();  // tried this but doesnt work
    $('#g_container1').html('');
    var chart2 = new ApexCharts(document.querySelector("#g_container1"),opt_resource_util_mon);
    chart2.render();

    // here is the ajax call to get data for the graph and using the graph method updateSeries
}

// The options for the graphs are stored in a seperate graphs.js files.

// HTML graph container 
<div id="g_container" style="margin-left:10%; padding:1px 16px; width:750px; border:1px solid #aaa; background-color:white;">
            <div id="g_container1"></div>
</div>

// Buttons to call the graphs
<button style="width:100px;" class="button_bottom" type="button" onClick="get_res_graph()">Graph 1</button>

<button style="width:100px;" class="button_bottom" type="button" onClick="get_resource_util_mon_graph()">Graph 2</button>

当我单击“图表1”按钮后单击“图表2”按钮时，将同时显示两个图表。我希望在调用图2时删除/清除图1。