是否可以使用 dompdf 导出 Google 图表？答案

【问题标题】：Is it possible to export a Google Chart using dompdf?是否可以使用 dompdf 导出 Google 图表？
【发布时间】：2016-05-19 15:43:17
【问题描述】：

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

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

大概我必须先将图表另存为图像，但这并不是一个真正的选择，因为保存图像是通过 Javascript 完成的，而生成 PDF 的所有工作都在后端 (PHP) 中完成。

【问题讨论】：

这些数据是私有的吗？如果没有，请通过公共路径公开图表并使用 wkhtmltopdf 或适当的包装器，例如 github.com/barryvdh/laravel-snappy。如果数据是私有的，我会使用相同的方法，但设置一个路由中间件/过滤器来限制对特定 ip（例如您的服务器）的访问，或者如果使用共享服务器，则需要一个特定的（长的，不可猜测的）令牌作为请求的一部分

标签： php laravel charts dompdf

【解决方案1】：

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

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

关于第二个选项我没有太多要说的，但是关于第一个......

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

类似以下的方法可能会起作用：

<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 支持的 data-uri 呈现 PNG。在服务器端获得 PNG 后，您可以将其插入到 img 标签中：

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

【讨论】：