Create pdf with wkhtmltopdf and rendering javascript

Question

I'm attempting to create a PDF of a javascript chart that I have in a model window (my chart is a combination of javascript and css in an .aspx view). The only thing in the rendered PDF file is the static content from the window, the actual javascript chart is not there.

My call to create the PDF is as follows:

public byte[] WKHtmlToPdf(string url)
    {
        var fileName = " - ";
        var wkhtmlDir = "C:\\Temp\\wkhtml";
        var wkhtml = "C:\\Temp\\wkhtml\\wkhtmltopdf.exe";
        var p = new Process();

        p.StartInfo.CreateNoWindow = true;
        p.StartInfo.RedirectStandardOutput = true;
        p.StartInfo.RedirectStandardError = true;
        p.StartInfo.RedirectStandardInput = true;
        p.StartInfo.UseShellExecute = false;
        p.StartInfo.FileName = wkhtml;
        p.StartInfo.WorkingDirectory = wkhtmlDir;

        string switches = "";
        switches += "--print-media-type ";
        switches += "--margin-top 0mm --margin-bottom 0mm --margin-right 0mm --margin-left 0mm ";
        switches += "--page-size Letter ";
        p.StartInfo.Arguments = switches + " " + url + " " + fileName;
        p.Start();

        //read output
        byte[] buffer = new byte[32768];
        byte[] file;
        using (var ms = new MemoryStream())
        {
            while (true)
            {
                int read = p.StandardOutput.BaseStream.Read(buffer, 0, buffer.Length);

                if (read <= 0)
                {
                    break;
                }
                ms.Write(buffer, 0, read);
            }
            file = ms.ToArray();
        }

        // wait or exit
        p.WaitForExit(60000);

        // read the exit code, close process
        int returnCode = p.ExitCode;
        p.Close();

        return returnCode == 0 ? file : null;
    }

Any ideas on how I could grab the javascript chart? Perhaps the .Net version would be more appropriate or I have to save the generated page to a file and pass that into the tool.

Thanks.

I had this problem and fixed it by ensuring I was using wkhtmltopdf 0.9.9. The "gem install" version (0.8.3) wasn't cutting it. — dfrankow, Jan 20 '12 at 18:39

score 9 · Accepted Answer · edited Sep 06 '12 at 07:44

9

In our project we do something simular, with success. We use wkhtmltopdf 0.9.9 in combination with Highcharts at the moment. With jQuery flot we had success too after a little tweaking. In our project we first render the view to a string and pass it to wkhtml using it's stdin. Then we catch the stdout of wkhtml and pass it back to the browser.

Your wkhtml-setting seems to be right, except we use stdin and stdout. Don't know if that can be a problem.

If you use one of those charts I think I can help you. What chart are you using?

One last note: Wkhtmltopdf 0.10rc2 seems to have some problems loading external resources (js/css) from localhost when using a portnumber different from port 80.

edited Sep 06 '12 at 07:44

Niko Nyman

1,916
2
16
26

answered Aug 05 '11 at 14:55

Rick van Hal

206
1
4

thanks for you "One last note", im currently searching how to fix it :) – AgelessEssence Aug 30 '11 at 21:53
1

Got it to work, basically I opened a hidden browser window disabling animations, saved an image of the chart and then created a html string with the image inside to render to PDF. – Zero Cool Sep 07 '11 at 23:06
1

You have mentioned that rending view to string? how to do that? I have a javascript and dynamic trend line chart (from highchart) rendering. But chart itself is not shown on the pdf. Any pointers? – Coder May 13 '15 at 07:19

score 6 · Answer 2 · answered Aug 05 '11 at 13:34

It looks like you're trying to get the output of a chart, which judging by the tags is from an Extjs 4 script.

The ext script is probably using some of the chart's animation, and will certainly be waiting for javascript events to execute and render the chart. It's probably therefore not done by the time the default time (200 ms) is done.

A quick fix would be to add the javascript-delay page option to the command line:

wkhtmltopdf http://dev.sencha.com/deploy/ext-4.0.2a/examples/charts/Mixed.html --javascript-delay=2000 test.pdf will certainly work on *nix, and a similar thing should work on windows.

Thanks, good idea. Unfortunately it doesn't change anything for me. I'm thinking it may be the model window the chart is displayed in and your extjs assumption is correct. — Zero Cool, Aug 05 '11 at 22:41

score 1 · Answer 3 · answered Feb 28 '14 at 18:43

I was using wkhtmltopdf 0.9.9 and the pdfkit ruby gem, and having a similar problem.

I fixed it by changing all tags to use absolute urls. It seems that wkhtmltopdf didn't know what url the page was accessed via so relative resources weren't being loaded. I don't know if that's a limitation of the pdfkit or wkhtmltopdf.

I got the idea from https://github.com/mileszs/wicked_pdf.

Create pdf with wkhtmltopdf and rendering javascript

3 Answers3

Linked