javascript - 为什么我的 highcharts 图表没有正确重置/销毁？

Question

在我的代码中，我正在像这样初始化图表...

<script type="text/javascript">
var chart = null,
defaultOptions = {
chart: etc etc
};


function drawDefaultChart() {
    chart = new Highcharts.Chart(defaultOptions);
}

$(function() {
    $(document).ready(function() {
        drawDefaultChart();
    });
});

</script>

然后在我的 body 里

<a href="#" onclick="drawDefaultChart()">Reset</a>

但是当您单击该链接时，它所做的只是使用先前状态的设置重新绘制图形...我不太确定发生了什么。如果我添加 chart.destroy();图表根本不起作用...

function drawDefaultChart() {
    chart.destroy();  //this makes the chart not work at all
    chart = new Highcharts.Chart(defaultOptions);
}

你可以清楚地看到我正在将默认选项传递给应该重绘的图表....我不明白为什么它使用旧的过滤器设置，我正要跳下一座桥，有人可以帮忙吗？

我的实例在这里http://goo.gl/sGu0M

////////更新

我付出了很多血、汗水和泪水才做到了这一点。我最终将数据放入另一个页面上的 php 变量中(以节省空间)，然后使用 php 变量调用它，然后每次有人单击链接时我都会调用它。我发现为了重新绘制图表，您必须每次都重新加载所有数据。就屏幕上的数据量而言，PHP 使这更容易。

这是最终帮助我弄明白的链接。 http://jsfiddle.net/dane/YUa3R/34/

Answer 1

总是推荐引用API文档。

使用以下代码片段销毁图表$('#container').highcharts().destroy();

Click here一个可行的解决方案。