Export google chart in a dashboard as png -
i trying export google chart in dashboard png image through button. following error-
one or more participants failed draw() undefined not function
here code:
<html> <head> <!--load ajax api--> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> // load visualization api , controls package. google.load('visualization', '1.0', {'packages':['controls']}); // set callback run when google visualization api loaded. google.setonloadcallback(drawdashboard); // callback creates , populates data table, // instantiates dashboard, range slider , pie chart, // passes in data , draws it. function drawdashboard() { // create our data table. var data = google.visualization.arraytodatatable([ ['name', 'donuts eaten'], ['michael' , 5], ['elisa', 7], ['robert', 3], ['john', 2], ['jessica', 6], ['aaron', 1], ['margareth', 8] ]); // create dashboard. var dashboard = new google.visualization.dashboard( document.getelementbyid('dashboard_div')); // create range slider, passing options var select = new google.visualization.controlwrapper({ 'controltype': 'categoryfilter', 'containerid': 'filter_div', 'options': { 'filtercolumnlabel': 'donuts eaten' } }); // create pie chart, passing options var chart = new google.visualization.chartwrapper({ 'charttype': 'columnchart', 'containerid': 'chart_div', 'options': { 'width': 500, 'height': 300, 'legend': 'right' } }); google.visualization.events.addlistener(chart, 'ready', function(e) { document.getelementbyid('png').outerhtml = '<a href="' + chart.getimageuri() + '">printable version</a>'; }); // establish dependencies, declaring 'filter' drives 'piechart', // pie chart display entries let through // given chosen slider range. dashboard.bind(select, chart); // draw dashboard. dashboard.draw(data); } </script> </head> <body> <div id='png'></div> <!--div hold dashboard--> <div id="dashboard_div"> <!--divs hold each control , chart--> <div id="filter_div"></div> <div id="chart_div"></div> </div> </body> </html>
please me going wrong.
a fiddle helps!
https://jsfiddle.net/kujxsn7z/
the things changed:
- created div hold png output attempt call
getimageuri() failing because applying on chartwrapper, not on chart object. fix need call, in instance:
chart.getchart().getimageuri()
so reference chartwrapper, use getchart refer chart contains, , execute getimageiri() on chart object itself.
Comments
Post a Comment