Save Charts as Image

[Patrike]

Hi : )

Does the new version has something to do with the no-work with the code bellow?

https://gist.github.com/1333906

Thanks

[asgallant]

Yes.  The newest release of the charts does not use iframes to draw the charts in all browsers except IE < 9 (which aren't relevant here anyway, since this image conversion script only supports SVG charts, which IE < 9 does not use).  I think there have been some other changes in the background that also affect the script, but I'll have to investigate further.

[trybka]

I didn't do a thorough pass through the script, but if you change the getImgData function to something like the below (look for the parent of the svg element under your chartContainer, rather than under an iframe) then it seems to work...

http://jsfiddle.net/SCjm8/1/

      function getImgData(chartContainer) {
        var chartArea = chartContainer.getElementsByTagName('svg')[0].parentNode;
        var svg = chartArea.innerHTML;
        var doc = chartContainer.ownerDocument;
        var canvas = doc.createElement('canvas');
        canvas.setAttribute('width', chartArea.offsetWidth);
        canvas.setAttribute('height', chartArea.offsetHeight);
        
        canvas.setAttribute(
            'style',
            'position: absolute; ' +
            'top: ' + (-chartArea.offsetHeight * 2) + 'px;' +
            'left: ' + (-chartArea.offsetWidth * 2) + 'px;');
        doc.body.appendChild(canvas);
        canvg(canvas, svg);
        var imgData = canvas.toDataURL('image/png');
        canvas.parentNode.removeChild(canvas);
        return imgData;
      }

[Patrike]

Thanks for the replies:

In IE8 the http://jsfiddle.net/SCjm8/1/ gives me a javascript error and both functions did not work

In Firefox 15.0.1 when i click in generate png... it generates a random file (ie: 1Q3mAK86.part) but if i rename it to anything.png it works. The convert to image works.

Thanks again.

[asgallant]

It will never work in IE < 9, as they use VML instead of SVG.  You would need a completely different method to save charts as images from VML.

[trybka]

The previous code did not work in IE8 before the newest release, though.

You can verify by changing the package loader to load '1.30' instead of '1' to get the old iframes behavior with the 'chartArea' div that the script used before.

[Sergio]

Is it possible to change the file name before it is downloaded??

Thanks in advance

[asgallant]

No, you can't set the name of the file download.

[Thomas Rybka]

You can't do it entirely from the client-side, but if you had a server, you could do it on the server-side.

Here's an example using some PHP:

http://greenethumb.com/article/1429/user-friendly-image-saving-from-the-canvas/

They submit the image data to their backend which wraps it appropriately and gives back a file with a good filename.

-Tom

Thomas Rybka | Software Engineer | try...@google.com | GViz

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Sergio González]

II'm adapting the code to work with google charts and everything its OK minus the php area. My server is IIS and I have trouble decoding the image data and returning it to the client. Do you know some example about IIS asp.net svg data-> client?

Thanks in advance

2013/3/6 Thomas Rybka <try...@google.com>

--
You received this message because you are subscribed to a topic in the Google Groups "Google Visualization API" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/google-visualization-api/YTD_JxX_RFc/unsubscribe?hl=en.
To unsubscribe from this group and all its topics, send an email to google-visualizati...@googlegroups.com.

[Sergio González]

I solved it, the problem was not the base64 decoding, my mistake was use Response.Write method instead Response.BinaryWrite method.

Thanks a lot guys!

2013/3/7 Sergio González <sgo...@gmail.com>