How to export an HTML/C#(Razor) page that contains SVG elements to PDF?

Asked

Viewed 792 times

7

I am currently working with Highcharts, a javascript library that generates graphics. It has an export component, but only exports the chart itself, still need to assemble the PDF layout.

For the export it goes to the highcharts server.com which is not the most suitable also because maybe the application needs to run offline.

Does anyone have experience in exporting SVG with HTML? Do you have any component tips to help with this work, preferably offline?

I didn’t think it was necessary to post code in this post, but it would help any example code or external reference.

  • 2

    Requesting links will not help your question. As we are a question and answer platform. The link is just not considered an answer. And the question encourages this. It needs to do the opposite, encourage true answers that are not just link.

  • I get @bigown. I agree with you. I suggested the links thinking it would facilitate an answer. For me the best thing would be to post an example of code and some reference, but I thought it was too much to ask.

  • I deleted my answer because rereading I think it’s not quite what you want to know (if you haven’t read it, I would suggest letting the browser generate an image using a canvas, the export functions of highcharts, and an external library). I think the question is still a little confusing. Do you want to do the whole process on the server side, or do you want a browser involved? Highcharts allows both options (and, in the case of using a browser, allows you to use your own server instead of highcharts.com).

  • Have you tried this? https://www.nuget.org/packages/RazorPDF/

1 answer

3

I suggest the phantomjs.

For your specific case probably the link below help:

https://github.com/ariya/phantomjs/wiki/Screen-Capture

Once phantomjs is installed, create a file htmltopdf.js:

// Usage: htmltopdf.js url pdf
var system = require('system');
var webpage = require('webpage');

var args = system.args;
var url = args[1];
var pdf = args[2];

var page = webpage.create();
page.open(url, function () {
    page.render(pdf);
    phantom.exit();
})

Then, on the command line run:

phantomjs htmltopdf.js http://www.google.com google.pdf

It will generate a pdf file (google.pdf) from the url (www.google.com).

  • How do I access the command line through my application?

  • That’s another question. I mean, literally, to be asked on this site. But, in Java, just use the Process/Processbuilder class. Surely there is something analogous in C#.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.