将Highcharts重置为初始状态

Question

使用预设选项创建我的Highchart工作正常：

chart = new Highcharts.Chart(options);

然而，当我想要销毁并重新创建图表时，它只会销毁。即使我删除chart.destroy();，图表仍然完全被清空，但没有重新创建。

$('#resetChart').on("click", function(e){
    e.preventDefault();
    chart.destroy();
    chart = new Highcharts.Chart(options);
});

我在如何重置这个图表上有些困惑。

编辑::

检查图表容器显示，饼图正在创建某些东西，但似乎没有正确地检索到数据。即使在选项中设置了数据变量，我是否还需要重新传递我的数据变量?

series: [{
                name: name,
                data: data,
                /* changes bar size */
                pointPadding: 0,
                borderWidth: 0,
                pointWidth: 15,
                shadow: false
        }]

然后页面上定义了数据（针对我们的CMS）：

<script type="text/javascript">
        data = [
            {
                y: {value},
                name: 'field1',
                id:'1'
            },
            {
                y: {value},
                name: 'field2',
                id:'2'
            },
            {
                y: {value},
                name: 'field3',
                id:'3'
            }
        ];
    </script>

- Gregg B

Answer 1

$('#resetChart').on("click", function(e){
    e.preventDefault();
    while(chart.series.length > 0) chart.series[0].remove(true);
    chart = new Highcharts.Chart(options);
});

http://jsfiddle.net/tapkr/1

- Ram

---

似乎不起作用。我也在他们的基本饼图演示中尝试了一下：http://jsfiddle.net/tapkr/ - Gregg B

那个链接对你有效吗？也许是因为浏览器问题，因为这个小工具没有重置。 - Gregg B

在FF中，那个小工具正在破坏图表。我看不到它会被重建。 - wergeld

抱歉Raminson，我看到这在小工具中确实可以运行，但如果我再次调用图表它仍然不起作用。然而，在我的项目中它仍然无法运行。我怀疑这与我编辑到我的问题中的数据变量有关。 - Gregg B

@Grillz 在移除系列后，你应该定义一个新的图表，你试过了吗？http://jsfiddle.net/tapkr/5/ - Ram

Answer 2

当你第一次创建图表时，通过参数传递一些选项，你可以将它们保存到变量中，当你想再次创建时，你可以使用相同的选项，如下面的代码。

var defaultOptions = {
    // your options
};

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

drawDefaultChart();

$('#resetChart').on("click", function(e){
    e.preventDefault();
    chart.destroy();
    drawDefaultChart();
});

您可以在这里看到它的工作过程。

- Ricardo Alvaro Lohmann