将多个Highcharts导出为多页PDF [英] Export Multiple Highcharts to Multi-page PDF

问题描述

我试图将多个图表导出为pdf文件，每个图表都显示在不同的pdf页面上。代码如下： JSFiddle

您可以看到多个图表已导出，但它们都放置在一个PDF页面上。有谁知道一种分离的方法，以便每个图表都放在自己的页面上？ 解决方案

不知道如何用Highcharts PDF服务器做你想做的事，你可以用 http://www.cloudformatter.com/css2pdf 服务器通过格式化包含图表和周围图表的div来设置分页符。

请参阅 http://jsfiddle.net/zvx6eb7e/23/

 < div id =JSFiddle> 
<！ - 在此处插入您的文档 - > 
< header style =display：none; margin-top：20px;>< p>添加您的标题< / p>< / header> 
< footer style =display：none>< p>添加您的标题< / p>< / footer> 
< div id =container1style =height：200px; width：700px>< / div> 
< div style =page-break-before：always;> 
< div id =container2style =height：200px; width：700px>< / div> 
< / div> 
< / div> 
  

I am trying to export multiple charts to a pdf file, with each of the charts to be displayed on a different pdf page.

Code here: JSFiddle

You can see multiple chart are exported, but they are all placed on a single pdf page. Does anyone know of a way to separate, so that each chart is placed on to its own page?

解决方案

Not sure how to do what you want with the Highcharts PDF server, you can do this with the http://www.cloudformatter.com/css2pdf server by formatting a div containing the charts and surrounding charts with a div setting the page-break.

See http://jsfiddle.net/zvx6eb7e/23/

<div id="JSFiddle">
    <!-- Insert your document here -->
    <header style="display:none;margin-top:20px;"><p>Add your header</p></header>     
    <footer style="display:none"><p>Add your header</p></footer>  
    <div id="container1" style="height: 200px; width:700px"></div>
    <div style="page-break-before:always;">
      <div id="container2" style="height: 200px;  width:700px"></div>
  </div>
</div>

这篇关于将多个Highcharts导出为多页PDF的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！