如何在princeXML中使用highcharts？

Question

我正在评估princexml，到目前为止，它非常非常好。不过，还有一个小问题。有没有办法将highcharts生成的图形保存到浏览器的princexml中？

我知道我需要在画布上将图形创建为图像，但不确定如何将图形提供给princexml。有什么想法吗？

Answer 1

我在DocRaptor工作(一个HTML to PDF API，使用王子XML进行PDF渲染)，我们刚刚发表了一篇关于将Highcharts添加到PDF的博客文章：

Adding Highcharts to PDFs

基本上，您只需要使用我们的JavaScript引擎(与普林斯的JavaScript引擎不同，它在我们将进程交给普林斯之前运行)，并在渲染图形的代码中禁用动画。

Answer 2

您可以做的一件事就是将HighCharts生成的SVG提供给普林斯。

这个解决方案的一个问题是，IE8不会生成SVG，而是VML，普林斯不能生成VML。你也许可以直接把你的javascript提供给王子，但是我们还没有测试出这个解决方案。

编辑：

实际上，我刚刚测试了用生成SVG的javascript来馈送王子……但是不走运，所以我们只能给它提供预渲染的SVG。可能需要在服务器端使用javascript运行时。

Answer 3

PrinceXML的JavaScript引擎似乎还不够强大，不能用Highcharts这样的组件来制作图表。

所以我所做的就是在PhantomJS中运行我的页面，这样它就会运行JS并在DOM中创建SVG元素，然后将结果提供给PrinceXML。

请务必禁用动画，否则将打印其第0帧：

​

Highcharts.setOptions({
                plotOptions: {
                    series: {
                        animation: false //Animations prevent proper PDF generation of charts!
                    }
                }
            });

​