{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 一夜七次 的问题《Is it possible to save a google chart as an image?》','https://www.manongdao.com/q-472180.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I am making an application in which I would need to save the google chart as an image . All I am using is tomcat, servlets and javascript. Is there a way to save the following generated chart as an image? (refer to code at the end of post). The idea is that user would see this chart and then would have the option of uploading it to his facebook profile. I am not sure if this will be uploadable to facebook in its native format or will be needed to be saved as a jpg.
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Year');
data.addColumn('number', 'Sales');
data.addRows(4);
data.setValue(0, 0, ''+2004);
data.setValue(0, 1, 1000);
data.setValue(1, 0, '2005');
data.setValue(1, 1, 1170);
data.setValue(2, 0, '2006');
data.setValue(2, 1, 860);
data.setValue(3, 0, '2007');
data.setValue(3, 1, 1030.5);
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, {width: 400, height: 240, title: 'Company Performance',hAxis: {title: "X", titleTextStyle: {color: "green"}}});
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
Your simplest option is to regenerate a static image version of the chart using the Google Chart API
Use the grChartImg library. It's a cross browser solution from George Risvas. Supports all the browsers including older versions of IE and provides you with many auto procedures like convert a chart to image,download,show a chart to a dialog,upload it to a server etc.
For more info look at www.chartstoimage.
I hope help you.
It looks like this feature was recently1 added as:
See the documentation.
1It appears to have been added in the Jan 29, 2014 release.
This is what i do
http://danml.com/#/download.html
if 3kb script is too much use http://www.closure-compiler.appspot.com/home
First, download this library :
http://danml.com/download.html
and after you have just to add an events listener inside your chart
Example solution from Riccardo Govoni as seen on the issues page of google charts. The idea is to convert the SVG to Canvas element.
Links:
Tutorial : http://www.battlehorse.net/page/topics/charts/save_google_charts_as_image.html
Example page: http://www.battlehorse.net/attach/topics/charts/google_charts_to_image.html