javascript - 导出通过循环生成的多个 Highcharts 到单个 pdf

Question

我已经创建了某些极 map 表，并且需要将所有图表导出为一个 pdf。 这些极坐标图在某个时间间隔内被渲染到同一个容器中。所以我使用 setInterval 和 3sec 间隔并在 setInterval 方法中填充图表。现在我需要将所有这 12 个图表导出到一个 pdf。

var i=0;
  var interval = setInterval(function() {
            let data1= [];
            let data2= [];
            let data3= [];
            let datetime= [];
//These arrays are filled with some logic in this part
            this.populateFiveMinSpider(data1,data2,data3,datetime);
            i++;
            if(i === 12) {
                clearInterval(interval);
             }
         }
     }, 3000)
 }

我尝试在加载后将每个图表保存到本地，然后单击“下载”按钮将所有本地文件从服务器端 (java) 合并为一个 pdf。 但这只是在本地创建一个文件，而无需单击按钮下载。并且在每个图表加载后都会出现可见的下载栏，这不符合要求。

 events: {

            load: function () {
                var chart = this;
                    setTimeout(function () {
                        // EXPORT THE CHART HERE
                        chart.exportChart({
                            type: 'application/pdf',
                            filename: 'my-pdf'+date,
                            sourceWidth: 1100,
                            sourceHeight: 600,
                            scale: 1,
                        });
                    }, 1000);
                }
        }

此代码用于下载个人 pdf。 然后我尝试使用 getPDF() 方法在不下载的情况下获取 pdf。

帮我一键下载这些文件。非常感谢任何帮助。

Answer 1

整个过程可以用JavaScript来完成。您可以在 SVG 中创建一些图表布局，然后将其导出为 PDF:

$('#export-pdf').click(function() {
    Highcharts.exportCharts([chart1, chart2, chart3, chart4], {
        type: 'application/pdf'
    });
});

---

现场演示: http://jsfiddle.net/BlackLabel/v0p6hce8/

有用的主题: https://www.highcharts.com/forum/viewtopic.php?t=40493