Question

我正在使用谷歌图表网络组件，我想知道是否有办法将图表转换为图像请。感谢，

代码示例：

<google-chart
  type='pie'
  options='{"title": "Number Of Alarms per category"}'
  cols='[{"label":"category", "type":"string"}, {"label":"number",  "type":"number"}]'
  rows='[["Gold", 31],["Bronze", 28],["Silver", 31]]'>
</google-chart>

这样的图表，我使用聚合物并且它是一个spring-boot webApp，

以及我真正想要的是将这些图表作为图像放入pdf文件中，我的应用程序将通过邮件发送给用户。

Answer 1

你的代码的一个例子不应该是坏的。无论如何，有一种方法可以将图表转换为图像：

var my_div = document.getElementById('chart_div');
var my_chart = new google.visualization.ChartType(chart_div);

google.visualization.events.addListener(my_chart, 'ready', function () {
  my_div.innerHTML = '<img src="' + chart.getImageURI() + '">';
});

my_chart.draw(data);

文档：https://developers.google.com/chart/interactive/docs/printing

Answer 2

尝试组件的getImageURI方法，该方法是图表本机getImageURI方法的包装：

https://elements.polymer-project.org/elements/google-chart#method-getImageURI

选择组件并调用getImageURI将返回图像为base64编码的字符串：

var chart = document.querySelector('google-chart'),
imageAsString = chart.getImageURI()

将Google图表Web组件转换为图像

2 个答案: