Last Updated: February 25, 2016
·
1.724K
· darkelda

Open Google Chart V3 in a new window as an image

I use jQuery to do the job:
http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js

Import CanVG librairies:
http://canvg.googlecode.com/svn/trunk/rgbcolor.js
http://canvg.googlecode.com/svn/trunk/canvg.js

After creating an empty canvas and a button, you just have to catch the event (click) to execute this function:

jQuery('#chart_div_button').click(function(){
    canvg(document.getElementById('chart_div_canvas'), jQuery('#chart_div div div').html());
    jQuery('#chart_div').hide();
    var canvas = document.getElementById('chart_div_canvas');
    var img = canvas.toDataURL("image/png");
    window.open(img);
});

More information: https://gist.github.com/4000635

1 Response
Add your response

great post! i'm new to this and receive
"TypeError: target.getContext is not a function
var ctx = target.getContext('2d');"
or
"TypeError: target.childNodes is undefined
if (!(target.childNodes.length == 1 && target.childNodes[0].nodeName == 'OBJECT'..."
with latest canvg.

Nevertheless it works when using canvg() parameterless :)

over 1 year ago ·