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
Written by Nicolas RAMY
Related protips
1 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 :)
Have a fresh tip? Share with Coderwall community!
JavaScript on a page runs with the privileges of that origin. One altered library, tag manager, or snippet can read inputs, change what people see, and call your APIs as the user.
Security insights from Cside