Intégration de SVG dans le PDF (exportation de SVG vers le PDF en utilisant JS)
les points de départ: je n'ai pas de serveur qui puisse fournir autre chose que des fichiers statiques. Et j'ai un élément SVG (dynamiquement créé) dans mon <body> que je veux exporter vers un format vectoriel, préférablement PDF ou SVG.
j'ai commencé à regarder en utilisant le lib déjà existant jsPDF avec télécharger . Il a bien fonctionné. Malheureusement, cela ne supporte pas SVG, seulement le texte.
j'ai découvrez les possibilités du format PDF d'intégrer des images SVG, et il semble que ait été activé depuis Acrobat Reader 5 (avec le plugin ImageViewer). Mais ça ne fonctionne pas. J'ai essayé avec 3 lecteurs PDF différents sans succès.
cela signifie-t-il que PDFs a abandonné le support SVG embedding? Je n'ai rien trouvé sur ce sujet.
j'ai deux questions; peut - on y répondre? Et si oui, quelles sont les spécifications pour intégrer SVG dans un PDF? Avec cette info, je peux construire ce support en jsPDF moi-même.
les exigences de la prise en charge du navigateur sont Safari, Chrome et Firefox. Les versions qui supportent SVG.
5 réponses
pour tous ceux qui recherchent une solution uniquement JS: " PDFKit semble être la meilleure solution pour générer des PDF à partir de JS de nos jours, et il prend en charge toutes les primitives SVG geometry (y compris l'interprétation de path geometry strings) out of the box. Tout ce qui serait nécessaire pour rendre le contenu SVG existant serait un DOM-walker qui garde la trace du style CSS et de l'héritage, si vous n'avez pas besoin de choses complexes comme des symboles, etc.
Je n'ai pas réussi avec le support SVG sommaire du combo jsPDF / svgToPdf mentionné dans l'autre réponse, et le code source de ces deux-là ne m'a pas semblé très bien conçu et complet.
je vais répondre à ma propre question. J'ai fini par utiliser DocRaptor qui peut être appelé côté client à partir de JavaScript. Cela résout techniquement mon problème, même si c'est une solution non-libre. Si je la réponse pourrait être une solution côté serveur, je pourrais utiliser wkhtmltopdf comme proposé par Mic.
jsPDF a un plugin pour cela: svgToPdf :
https://github.com/ahwolf/jsPDF/blob/master/jspdf.plugin.svgToPdf.js
je n'ai pas essayé, mais cela pourrait permettre de jeter l'utilisation de l'API externe et/ou d'avoir à compter sur une solution côté serveur.
avez-vous essayé WKHTMLTOPDF? C'est un outil gratuit basé sur webkit.
Nous avons écrit un petit tutoriel ici.
sur un Mac, avec Safari ou Chrome, vous pouvez enregistrer une page HTML avec SVG intégré à un PDF.
puisque ces navigateurs utilisent wkhtmltopdf en interne, peut-être que cela fonctionnera pour vous aussi.
EVO Html to PDF Converter a le soutien pour convertir le SVG incorporé dans HTML en PDF. Vous pouvez voir un exemple de cette fonctionnalité ici: http://www.evopdf.com/demo/HTML_to_PDF/HTML5_Features/SVG_to_PDF.aspx . Le code de l'échantillon est le suivant:
// 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();