Question

对于我的博客（http://ios-blog.co.uk），我使用wkhtml：https://code.google.com/p/wkhtmltopdf/将包含分析数据的网页转换为pdf。该图表由Google Graphs API生成。（https://google-developers.appspot.com/chart/interactive/docs/quick_start）

这是生成图表的代码：

var options = {
                        series: {
                            0: {targetAxisIndex: 0},
                            1: {targetAxisIndex: 1}
                        },
                        vAxes:{
                            0: {title: 'Impressions', minValue: 0},
                            1: {title: 'Clicks', minValue: 0}
                        }
                    };

                    var chart = new google.visualization.LineChart(document.getElementById('chartContainer'));
                    chart.draw(data, options);

在网页上，图片如下：

a busy cat http://markpetherbridge.co.uk/graph/graphLarge.png ！[Google Graph Large] [1]

然而，在生成的PDF上，图表如下所示：

a busy cat http://markpetherbridge.co.uk/graph/graphSmall.png ！[Google Graph Small] [2]

正如您所看到的，图像没有被压扁，似乎缺少“x”轴之外的东西并使图形变小。

任何人都可以对此有所了解吗？

Answer 1

我遇到了同样的问题，我所做的是压缩你试图转换的html文档中body标签的宽度，保持char div相同。

我设置的身体标签宽度为： body {width：795px！important; }

并将图表div和ChartArea保持在Javascript中1200px chartArea：{宽度：1200，高度：300}

我希望这有帮助！

使用wkhtmltopdf时压缩了Google Graphs

1 个答案: