Embedding SVG in PDF (exporting SVG to PDF using JS)

倖福魔咒の 提交于 2019-11-26 21:51:23

For anyone looking for a JS-only solution: PDFKit seems to be the superior solution to generate PDF from JS these days, and it supports all SVG geometry primitives (including interpreting path geometry strings) out of the box. All that would be needed to render existing SVG content would be a DOM-walker that keeps track of CSS styling and inheritance, if you do not require complex stuff like symbols etc.

I wasn't successful with the sketchy SVG support of the jsPDF/svgToPdf combo mentioned in the other answer, and the source code of these two didn't look very well-crafted and complete to me.

Simeon

I'll reply to my own question. I ended up using DocRaptor that can be called client-side from JavaScript. This technically solves my problem, even though it is a non-free solution. If I the answer could be a server-side-solution, I could use wkhtmltopdf as proposed by Mic.

jsPDF has a plugin for that: svgToPdf:

https://github.com/ahwolf/jsPDF/blob/master/jspdf.plugin.svgToPdf.js

I haven't tried it, but this could allow discarding the use of an external API and/or having to rely on a server-side solution.

Did you try WKHTMLTOPDF? It's a free tool based on webkit.
We wrote a small tutorial here.

On a Mac, with Safari or Chrome, you can save an HTML page with embedded SVG to a PDF.
Since these browsers use WKHTMLTOPDF internally, may be this will work for you as well.

EVO HTML to PDF Converter has support for converting the SVG embedded in HTML to PDF. You can see an example for this feature here : http://www.evopdf.com/demo/HTML_to_PDF/HTML5_Features/SVG_to_PDF.aspx . The sample code for this is:

// Create a HTML to PDF converter object with default settings
HtmlToPdfConverter htmlToPdfConverter = new HtmlToPdfConverter();

// Convert the HTML page with SVG to a PDF document in a memory buffer
byte[] outPdfBuffer = htmlToPdfConverter.ConvertUrl(urlHtmlWithSVG);

// Send the PDF as response to browser

// Set response content type
Response.AddHeader("Content-Type", "application/pdf");

// Instruct the browser to open the PDF file as an attachment or inline
Response.AddHeader("Content-Disposition", String.Format("attachment; filename=SVG_to_PDF.pdf; size={0}", outPdfBuffer.Length.ToString()));

// Write the PDF document buffer to HTTP response
Response.BinaryWrite(outPdfBuffer);

// End the HTTP response and stop the current page processing
Response.End();
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!