重置图表选项后 HighCharts 导出中断

Question

在初始加载页面时，我们设置图表选项并创建图表。我们允许用户操作显示/隐藏哪些系列项目，还可以更改每个系列的类型。我们还有一个“重置图表”操作，可以将图表恢复到其原始加载设置。一旦用户重置图表，对图表所做的任何更改都不会反映在导出的图像上，除非用户更改了他们的系列图表类型。一个示例 jsFiddle 是 here，它演示了这个问题。

图表加载后，单击导出类型，您会看到它们匹配。现在从图例中取消选择其中一个系列并再次导出 - 请注意导出和页面仍然匹配。现在从下拉列表中选择“单个系列”并导出 - 它们再次匹配。现在单击重置图表或从下拉列表中选择“多系列”。这会使图表恢复到最初加载时的样子。现在取消选择一个系列并导出 - 它们不再匹配。导出的图像仍然选择了所有系列。现在再次选择“单个系列”并将类型更改为“线”并导出 - 再次显示所有系列，但它们都是线型。

这就是我在“重置图表”点击操作中重置图表的方式：

   //reset Main Chart chart to original specs
    resetMainChart.live('click', function () {
        forceResetChart(chartMainLoc);
    });
...
function forceResetChart(chart) {
    if (mainGraphMode.is(':visible')) {
        if (mainGraphMode.val() == 'multiple') {
            //if (mainGraphFormatType.val() != 'null') {
            //    mainGraphFormatType.val('null');
            //}
            mainGraphFormatType.val('null');
        } else {
            mainGraphMode.val('multiple');
            mainGraphFormatType.val('null');
        }
        mainGraphFormatType.hide();
        mainGraphFormatDefault.show();
    } else {
        mainGraphFormatType.val('null');
    }
    $('#chartMain').highcharts().destroy();
    chartMainLoc = new Highcharts.Chart(optionsChartMain, highlightSer);
}

我不知道为什么以这种方式重置图表会破坏导出。我已经阅读了对其他问题的一些回复，指出我们应该获取当前显示图表的 SVG 并将其发送到导出方法。我不知道该怎么做。文档指出 getSVG() 方法获取 最初 加载图表的 SVG 字符串 - 而不是活动图表。

Answer 1

嗯，没有错，它完全按照你写的那样工作。考虑一下：

chartMainLoc = new Highcharts.Chart(optionsChartMain, highlightSer);

在highlightSer 中，您正在显示所有系列。导出图表时，从头开始创建图表，并再次使用回调，因此所有系列都可见。去掉highlightSer回调，你就会看到区别了。