Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ChartKick charts do not show when rendering to PDF using Wicked_PDF

I am using Rails 4, Wicked_PDF and Chartkick Gem's
For Google Charts I use:

<%= javascript_include_tag "//www.google.com/jsapi", "chartkik" %>

The html view comes up with charts and everything as expected. When I append .pdf to the url the pdf document shows in the browser but the ChartKick charts do not show.
The following error appears where the chart should be:

Error Loading Chart: No adapter found

I have found the following online in the PDFKit documentation.

Resources aren't included in the PDF: Images, CSS, or JavaScript does not seem to be downloading correctly in the PDF. This is due to the fact that wkhtmltopdf does not know where to find those files. Make sure you are using absolute paths (start with forward slash) to your resources. If you are using PDFKit to generate PDFs from a raw HTML source make sure you use complete paths (either file paths or urls including the domain). In restrictive server environments the root_url configuration may be what you are looking for change your asset host.

I am assuming that wkhtmltopdf is not finding the link to the charts, but I am not sure how to fix this.
Does anyone have a suggestion?

I found this link:
Render jQuery in wicked_pdf

Where Unixmonkey helps FattRyan to solve this for Highcharts.

Can anyone help how to set this wicked_pdf_javascript_include_tag so that Wicket_PDF will accept charts from Chartkick using Google charts?

like image 308
user3334207 Avatar asked Dec 20 '22 10:12

user3334207


1 Answers

You have to specify a protocol http or https when referencing to a CDN inside the pdf layout.

Also chartkick is served via the assets pipeline, so use wicked_pdf_javascript_include_tag instead.

Replace this line:

<%= javascript_include_tag "//www.google.com/jsapi", "chartkik" %>

With this:

<%= javascript_include_tag "https://www.google.com/jsapi" %>
<%= wicked_pdf_javascript_include_tag "chartkick" %>

That's how I do it in a project of mine.

Cheers.

like image 79
thesubroot Avatar answered Dec 22 '22 00:12

thesubroot