javascript - 通过一个请求导出多个图表

Question

页面上我有 2 个图表。它们是使用 Highcharts 库构建的。

我需要将它们全部导出为 PNG 文件。所以我添加了按钮，单击该按钮我需要有 2 个单独的 png 文件。

我有功能:

myApp.highchart.export.create = function (elementId, filename) {
    var chart = $(elementId).highcharts();
    chart.exportChart({ type: 'image/png', filename: filename, sourceWidth: chart.chartWidth });
}

我传入每个图表的函数 ID，但结果我总是只得到最后一个图表...我尝试添加 timeout 但这没有帮助。

我查看了浏览器中的“网络”选项卡，始终只看到 1 个对 http://export.highcharts.com/

的请求

有人可以帮我吗？

<小时/>

这里是导出 2 个图表的示例，但在我的情况下这也没有帮助(例如它使用了一些插件 highcharts-export-clientside 但我使用简单的 exporting.js )

<小时/>

UPD:我添加了highcharts-export-clientside插件，但仍然使用highcharts方法exportChart(插件中有exportChartLocal) 。使用这个插件可以导出多个图表，但是在 png 中我得到了错误的格式化图表，我的所有样式都被破坏了。所以我不知道当我不使用它的任何方法时，这个插件有什么影响。

<小时/>

似乎多重导出在 FF 中有效，但在 Chrome 中无效。

<小时/>

简单逻辑示例:http://jsfiddle.net/6mn2j5pL/

Answer 1

这可能会帮助您修复它。

You can use Highcharts.charts for getting array of your charts. Then you can use Highcharts.each for looping over your charts and exporting them one after other.

http://forum.highcharts.com/highcharts-usage/how-to-export-multiple-charts-to-separate-image-files-t35191/

此论坛提供的解决方案似乎也适用于 Chrome。