2

Google チャートをこのリンクのような画像に変換しようとしていますが、線についてわかりません

var chartArea = chartContainer.getElementsByTagName('iframe')[0].contentDocument.getElementById('chartArea');

iFrameGoogle チャートによって生成されたコードは、呼び出されたまたは要素を作成しません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.
4

2 に答える 2

2

これは、このページの手順に従って行うことができます。この記事のコードは、iframe を使用した古いバージョンの Google ビジュアライゼーションに基づいており、投稿されたとおりには機能しないことに注意してください。ただし、次のコードを使用して同じことを行うことができます (コメントにあります)。

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;

注: このコードは私が作成したものではありません。最初は上記のサイトの作成者 (Riccardo Govoni) によって作成され、ユーザー Thomas によってコメント セクションで更新されました。

于 2013-02-01T02:25:42.470 に答える
0

chart.getImageURI()次のように使用して、チャートの PNG バージョンを取得できます。

チャートが描かれた後に必要なので、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);
于 2014-06-04T14:11:38.563 に答える