Incrustar SVG en PDF (exportando SVG a PDF usando JS)

Los puntos de partida: no tengo un servidor que pueda proporcionar nada más que archivos estáticos. Y tengo un elemento SVG (creado dinámicamente) en mi <body> que quiero exportar a un formato vectorial, preferiblemente PDF o SVG.Incrustar SVG en PDF (exportando SVG a PDF usando JS)

Empecé a buscar usando la lib jsPDF ya existente junto con downloadify. Funcionó bien Lamentablemente, esto no es compatible con SVG, solo texto.

He leído sobre las posibilidades del formato PDF para incrustar imágenes SVG, y it seems para haber sido habilitado desde Acrobat Reader 5 (junto con el plugin ImageViewer). Pero no funciona. Lo intenté con 3 lectores diferentes de PDF sin éxito.

¿Esto significa que los archivos PDF han dejado de ser compatibles con la incorporación de SVG? No he encontrado nada sobre esto.

Tengo dos preguntas; puede esto ser resuelto? Y si es así, ¿cuáles son las especificaciones para incrustar SVG dentro de un PDF? Con esa información, puedo construir ese soporte en jsPDF.

Las demandas de soporte del navegador son Safari, Chrome y Firefox. Las versiones que admiten SVG.

Fuente

2011-05-06 Simeon

Para aquellos que buscan un JS-única solución: PDFKit parece ser la mejor solución para generar PDF desde JS estos días, y es compatible con todas las primitivas de geometría SVG (incluyendo la interpretación path cadenas geometría) fuera de la caja. Todo lo que se necesitaría para representar el contenido SVG existente sería un DOM-walker que realiza un seguimiento del estilo CSS y la herencia, si no necesita cosas complejas como símbolos, etc.

No tuve éxito con el soporte de SVG incompleto del jsPDF/svgToPdf combo mencionado en la otra respuesta, y el código fuente de estos dos no se veía muy bien diseñado y completo para mí.

Fuente

2014-08-04 12:49:08

Una pregunta. 1. Abra http://pdfkit.org/demo/browser.html. 2. Abra la ventana de inspección de Chrome. 3. Haga clic en el ícono "Alternar la barra de herramientas del dispositivo" en el menú superior. 4. Actualiza la página. 5. NO PUEDO ver el pdf en la ventana derecha de la vista móvil. 6. ¿Alguien sabe por qué la vista móvil no está procesando el PDF? ? ¿Es este PDFKit un problema específico o general con la apertura de PDF en dispositivos móviles? –

¿Has probado WKHTMLTOPDF? Es una herramienta gratuita basada en webkit.
escribimos un pequeño tutorial here.

En un Mac, con Safari o Chrome, puede guardar una página HTML con SVG embebido en un archivo PDF.
Dado que estos navegadores usan WKHTMLTOPDF internamente, puede ser que esto también funcione para usted.

Fuente

2011-05-06 15:57:07 Mic

Estoy pidiendo una solución del lado del cliente aquí. Sin embargo, tiene razón en que no he especificado qué soporte de navegador estoy buscando. Así que ahora he editado mi respuesta para incluir esa – Simeon

. Desafortunadamente, todavía no puedo hacer que wkhtmltopdf funcione. Solo produce páginas en blanco para mí. –

@ art-solopov, los tiempos han cambiado, como se mencionó anteriormente, puede cambiar a pdfkit: http://pdfkit.org/docs/vector.html – Mic

Voy a responder a mi propia pregunta. Terminé usando DocRaptor que se puede llamar del lado del cliente desde JavaScript. Esto técnicamente resuelve mi problema, aunque no es una solución gratuita. Si la respuesta podría ser una solución del lado del servidor, podría usar wkhtmltopdf como proposed por micrófono.

Fuente

2011-05-09 12:55:20 Simeon

Gracias por el enlace a DocRaptor. Si va por la ruta de alojamiento de algo, puede usar WKHTMLTOPDF, ya que es de código abierto y gratuito – Mic

Agregó su respuesta y eliminó Prince XML como alternativa, ¡gracias! – Simeon

jsPDF tiene un plugin para que: svgToPdf:

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

no lo han intentado, pero esto podría permitir descartar el uso de una API externa y/o tener que depender en una solución del lado del servidor.

Fuente

2013-05-06 10:17:01 stackex

Actualmente estoy probando este enfoque, pero parece que solo consigo un pdf en blanco. ¿Conoces algún ejemplo que utilice este complemento? – BelgoCanadian

EVO HTML to PDF Converter tiene soporte para convertir el SVG incrustado en HTML a PDF. Puede ver un ejemplo de esta función aquí: http://www.evopdf.com/demo/HTML_to_PDF/HTML5_Features/SVG_to_PDF.aspx.El código de ejemplo para esto es:

// 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();

Fuente

2015-10-20 07:11:57 EvoPdf

Incrustar SVG en PDF (exportando SVG a PDF usando JS)

Respuesta

Cuestiones relacionadas