我想转换一个谷歌图成像图像此链接 ,但我不明白的进线
var chartArea = chartContainer.getElementsByTagName('iframe')[0].contentDocument.getElementById('chartArea');
由谷歌图表生成的代码,不会产生任何iFrame
调用或元素chartArea
有人能帮我吗 ?
更新
遵循由图表生成的,当我改造他成图像的源
http://chart.googleapis.com/chart?cht=lc&chs=500x200&chtt=Acessos%20ao%20im%C3%B3vel%20dos%20ultimos%20sete%20dias&chxt=x%2Cy&chxl=0%3A%7C24%2F01%7C25%2F01%7C26%2F01%7C27%2F01%7C28%2F01%7C29%2F01%7C30%2F01%7C1%3A%7C%7C0%7C&chdlp=r&chdl=San%7CSite%7CAtendimento&chco=ff8a00%2C585857%2C5501ff&chd=e%3Af.f.f.f.f.f.f.%2Cf.f.f.f.f.f.f.%2Cf.f.f.f.f.f.f.
这可以通过以下的步骤来完成这个页面 。 需要注意的是,本文中的代码是基于旧版本的谷歌可视化的,其使用的内部框架,并张贴将无法正常工作。 但是,您可以使用下面的代码(在评论中发现的)做相同的:
var svg = $(chartContainer).find('svg').parent().html();
var doc = chartContainer.ownerDocument;
var canvas = doc.createElement('canvas');
canvas.setAttribute('style', 'position: absolute; ' + '');
doc.body.appendChild(canvas);
canvg(canvas, svg);
var imgData = canvas.toDataURL("image/png");
canvas.parentNode.removeChild(canvas);
return imgData;
注:我没有创建这个代码,它最初是由上述网站的作者(里卡多Govoni)创建,并在用户托马斯的评论部分更新。
你可以使用你的图表的PNG版本chart.getImageURI()
类似以下内容:
需要在图表绘制后,所以在ready
活动!
var my_div = document.getElementById('my_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);