function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
gbalakrigbalakri 

Creating Charts in PDF using VisualForce

We are currently trying to develop an application on VF where we need to embed charts in PDF. Wanted to see if any one had tried it before or forsee any issues with it.
I had found the following article regarding charts and VisualForce

http://wiki.developerforce.com/index.php/Google_Visualizations

Girish

Principal

CM-Focus LLC

 

 

jlojlo

The only way to include an image in a Visualforce-generated pdf is to include an image stored inside of your Force.com org. The Google Visualization toolkit does not generate such images.

A (somewhat complex) work-around that you might try would be to create a Google Image Chart (http://code.google.com/apis/chart/image_charts.html), store the image in the Documents Tab, and then include that chart image in your pdf. I'm not 100% certain that will work, but you might try it.
TehNrdTehNrd

All of the static google charts (URL params) will work fine in the PDF generation:

 

http://code.google.com/apis/chart/image_charts.html

 

Interactive charts, http://code.google.com/apis/visualization/interactive_charts.html , will NOT work as they require javascript or flash and this doesn't work in PDF.

 

Only issue with the first option is this requires sending data over the internet unsecure and some stiff collared peeps might not like this.
jg@hhsjg@hhs

I cannot get a visualforce page to show a simple google chart when rendered as pdf.  (It works fine if outputted as normal visualforce html page).

 

To test, I simply put these on the page, then tested back and forth with the renderas="pdf" property:

 

<apex:image url="http://chart.apis.google.com/chart?chxt=y&chs=300x150&cht=gm&chd=t:70&%22&chtt=Score&chts=224499,14.5"></apex:image>

 

<img src="http://chart.apis.google.com/chart?chxt=y&chs=300x150&cht=gm&chd=t:70&%22&chtt=Score&chts=224499,14.5" />

 

 

 

Is there a different way I should be doing this?

 
jlojlo

jg@hhs - That won't work. Images included in PDFs must be stored within Force.com infrastructure. e.g. to include the chart image in your pdf you will need to figure out a way to store the chart image as a document in the Force.com database and then reference that document's url from within your Visualforce page. If you get that to work, please share your code.
TehNrdTehNrd

Nah, that actually works. External images was added to PDFs several release ago.
jlojlo

Nice! Missed this one: http://community.salesforce.com/t5/Visualforce-Development/How-to-include-image-from-external-site-in-page-that-render-as/m-p/129773
jg@hhsjg@hhs

Awesome!  I will do as it says in that link and give it another shot!

 

and.... that worked perfectly.  Thanks so much! 

 

For anyone else:

 

Go to Setup -> Security Controls -> Remote Site Settings

 

Add http://chart.apis.google.com

 

 
Ed GroenendaalEd Groenendaal
For those that come across this thread via searching, Google Image Charts have been deprecated since April 20, 2012, only the Javascript versions are available which won't work on a VF PDF.
aslamaslam
I found the solution here and its working properly using new Google Visualization API :)

https://developers.google.com/chart/interactive/docs/printing#overview
unidhaunidha
Hi,

I found solution to save visualforce chart into image.The detail solution can be found here : http://www.shelovestocode.com/2017/04/save-visualforce-chart-as-image-in.html . The key is using canvg library : https://github.com/canvg/canvg .Once it save as Attachment, we can use the image in PDF page.

 
csrviswacsrviswa
Google chart API is not working anymore. Look into below solution.
salesforce-lightning-how-to-generate-pdf-with-charts-and-images (https://csrviswa.medium.com/salesforce-lightning-how-to-generate-pdf-with-charts-and-images-f10f5dfef45e)