Question

在我的Laravel 5项目中，我使用Lavacharts（由Google图表提供支持）来显示图表，并使用dompdf包装器laravel-dompdf来生成PDF文件。

是否可以使用dompdf导出此类图表，如果可以，如何实现？

据推测，我必须首先将图表保存为图像，但这不是一个选项，因为保存图像是通过Javascript完成的，并且为了生成PDF，所有工作都在后端（PHP）完成。

Answer 1

Dompdf无法在页面上处理基于JavaScript的内容。您有两种选择：

在浏览器中预览图表并将图像版本发送到服务器进行渲染。
使用无头浏览器（如PhantomJS）将HTML（使用JavaScript）呈现为PDF

我对第二个选项没什么好说的，但是第一个选项......

Google Charts API可以为您的图表generate a PNG version。关于如何将PNG发送到PHP代码（search it），有很多关于SO的帖子。

以下内容可能有效：

<script type="text/javascript">
google.charts.load("current", {packages:['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {

  var data = google.visualization.arrayToDataTable([
    ['Element', 'Density', { role: 'style' }],
    ['Copper', 8.94, '#b87333', ],
    ['Silver', 10.49, 'silver'],
    ['Gold', 19.30, 'gold'],
    ['Platinum', 21.45, 'color: #e5e4e2' ]
  ]);

  var options = {
    title: "Density of Precious Metals, in g/cm^3",
    bar: {groupWidth: '95%'},
    legend: 'none',
  };

  var chart_div = document.getElementById('chart_div');
  var chart_input = document.getElementById('chart_input');
  var chart = new google.visualization.ColumnChart(chart_div);

  // Wait for the chart to finish drawing before calling the getImageURI() method.
  google.visualization.events.addListener(chart, 'ready', function () {
    chart_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
    chart_input.value = chart.getImageURI();
  });

  chart.draw(data, options);

}
</script>

<div id='chart_div'></div>

<form method="post" action="print_chart.php">
<input type="hidden" name="chartImg" id="chartImg">
<button type="submit">print</button>
</form>

Google Charts使用dompdf支持的数据uri呈现PNG。在服务器端获得PNG后，您只需将其插入img标记：

$html = '<img src="' . $_POST['chart_input'] . '">';
$dompdf->load_html($html);
$dompdf->render();
$dompdf->stream('chart.pdf');

是否可以使用dompdf导出Google Chart？

1 个答案: