0

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

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

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

   //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 字符串-而不是活动图表。

4

1 回答 1

1

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

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

highlightSer您显示所有系列。导出图表时,从头开始创建图表,并再次使用回调,因此所有系列都可见。删除highlightSer回调,您将看到不同之处。

于 2013-09-25T11:45:52.453 回答