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（）方法获取 intially 加载图表的SVG字符串 - 而不是活动图表。

Answer 1

嗯，没有什么不对，它的工作方式和你写的一模一样。考虑一下：

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

在highlightSer中，您正在显示所有系列。导出图表时，从头开始创建图表，再次使用回调，因此所有系列都可见。删除highlightSer回调，您将看到差异。

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

1 个答案: