如何在PrinceXML中使用Highcharts？

Question

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

我知道需要将图形创建为Canvas上的图像，但不确定如何将图形传输给princexml。有什么建议吗？

- user187809

Answer 1

我在DocRaptor工作（一个使用Prince XML进行PDF渲染的HTML转PDF API），我们刚刚发布了一篇关于如何将Highcharts添加到PDF中的博客文章：

将Highcharts添加到PDF中

基本上，你只需要使用我们的JavaScript引擎（它与Prince的JavaScript引擎不同，并且在我们将进程交给Prince之前运行），并在呈现图表的代码中禁用动画即可。

- illbzo1

---

您的JavaScript引擎在哪里可以找到？它是开源的吗？ - Thijs

Answer 2

你可以尝试将HighCharts生成的SVG直接提供给Prince使用。但这种解决方案存在一个问题，即IE8生成的是VML而不是SVG，而Prince无法渲染VML。你可以尝试直接将javascript提供给Prince，但我们还没有测试过该解决方案。编辑：我刚刚测试了使用javascript生成SVG并提供给Prince，但是没有成功，因此我们必须使用预先渲染的SVG。可能需要在服务器端使用javascript运行时来完成。

- Damo

Answer 3

PrinceXML的JavaScript引擎似乎不够强大，无法使用像Highcharts这样的组件制作图表。

因此，我运行了我的页面到PhantomJS中，以便它可以运行JS并在DOM中创建SVG元素，然后将结果提供给PrinceXML。

请确保禁用动画，否则您将打印其第0帧：

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

- Fabian Nicollier