highcharts - 如何在princeXML 中使用highcharts？

Question

我正在评估princexml，到目前为止它非常非常好。一个小问题。有什么方法可以在浏览器上将 highcharts 生成的图形保存到princexml 中？

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

Answer 1

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

将 Highcharts 添加到 PDF

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

Answer 2

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

使用此解决方案您将遇到的一个问题是 IE8 不会生成 SVG，而是 VML，prince 无法渲染。您也许可以将您的 javascript 直接提供给 Prince，但我们尚未测试此解决方案。

编辑：

实际上，我只是测试了用可以生成 SVG 的 javascript 给 Prince 喂食……但没有运气，所以我们坚持喂它预渲染的 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!
                    }
                }
            });