mileszs / wicked_pdf

PDF generator (from HTML) plugin for Ruby on Rails
http://www.mileszs.com/wicked-pdf-plugin
MIT License
3.53k stars 644 forks source link

Can't get Wicked to render svg originating from javascript #85

Closed sohara closed 12 years ago

sohara commented 12 years ago

I am trying to get wicked pdf to render a google chart that uses their javascript api. I have successfully rendered the chart using the wkhtmltopdf binary but when I try to render it using the wicked_pdf_gem through rails I'm not having any luck. Are there features of wkhtmltopdf that are not available through wicked_pdf?

In my layout I have the following:

<%= content_for :head do %>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">
  google.load("visualization", "1", {packages:["corechart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addRows([
      ['2004', 1000, 400],
      ['2005', 1170, 460],
      ['2006', 660, 1120],
      ['2007', 1030, 540]
    ]);

    var options = {
      width: 600, height: 400,
      title: 'Company Performance',
      hAxis: {title: 'Year', titleTextStyle: {color: 'red'}}
    };

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>
<% end -%>
<h1>Testing PDFs w/ Javascript</h1>
<div id="chart_div" class="chart_div"></div>

And in my controller I have:

  def index
    respond_to do |format|
      format.html
      format.pdf do
        render :pdf => "file_name",
          :template => "index/index.html.erb"
      end
    end
  end

When I issue the command:

bundle exec wkhtmltopdf 'http://localhost:3000/index' - > test.pdf

The output is a pdf with the javascript-based chart properly rendered. But when I visit the url in my browser wicked_pdf doesn't render the chart. I am guessing that this should work. Is there something I'm missing?

Thanks, Sean

sohara commented 12 years ago

Please disregard. I messed up my layout files.

sunnybogawat commented 12 years ago

Hi sohara,

I am facing same issue could you please give some pointer how to solve this?

sohara commented 12 years ago

From what I recall, it was a javascript issue. I was using the wrong layout file, so the required wicked_pdf_javascript_include_tag was not being used, just a regular javascript_included_tag, which did not properly load the javascript on the page, and hence the svg which was rendered by javascript was not present on the page. You can do a test to make sure javascript from external files is being rendered in your pdf output.

sunnybogawat commented 12 years ago

I think wicked_pdf_javascript_include_tag is not required because it's looking for your public javascript file and google charts required external js which can be included using

I am doing same but still not able to load map inside PDF document

sunnybogawat commented 12 years ago

I think wicked_pdf_javascript_include_tag is not required because it's looking for your public JavaScript file and Google charts required external js which can be included using src="http://www.google.com/jsapi tag

I am doing same but still not able to load map inside PDF document

anushamummina commented 7 years ago

Guys can anyone can help me on this. I am also facing the same issue in my local environment. Staging environment it is working again in production it is not working as expected. when I am rendering as "show_as_html => true" everything is working as expected but in PDF it is loading properly.

Can anyone please help what could be the issue?

unixmonkey commented 7 years ago

Is the javascript file that kicks this off in the precompile list something like this: config.assets.precompile += ['svg_renderer.js']?

anushamummina commented 7 years ago

@unixmonkey sorry unix but I didnt understand what you are trying to say