经过一系列的研究,搜集资料,终于实现了导出含有highcharts图表的html页面到pdf,但还是存在一些问题,jspdf不支持中文,导出的pdf第一次打开关闭时总是问是否保存,还有就是pdf画板的宽度,试了调大一点,但不成功,只能改变窗口的大小到600px左右去配合。
思路:
1. highcharts生成图表
2.获取图表的svg,并创建一个canvas元素,使用canvg把svg转成
canvas
3.
canvas转成image DataURL,把图表替换成转换后的image。
4.使用jspdf把html页面导出到pdf格式。(jspdf里面有例子:jsPDF-master/examples/html2pdf/showcase_supported_html.html ,要想把输出到页面改为导出,则把html2pdf的响应函数里面的代码改为 pdf.save(‘Test.pdf’); 就行)
另外,要注意的是jspdf有点坑,我修改例子里的config.js文件,让”html2pdf“只加载dist文件夹里的jspdf.min和html2canvas,但是一直报require的错,看了下,jspdf.min.js文件里也包含了config的一些设定,找到”require.config“,把跟”html2pdf“这个例子相关的那段代码删了就不报错了。相关文件的路径也是要修改一下的。
如果有哪位研究出以下几点烦请告知,谢谢。
1.怎么让jspdf支持中文
2.调整pdf 取样画板的宽度
3.导出的pdf 打开关闭时不弹出询问保存。
资料参考: http://stackoverflow.com/questions/25630811/export-highcharts-to-pdf-using-javascript-and-local-server-no-internet-connec