Встраивание SVG в PDF (экспорт SVG в PDF с использованием JS) - PullRequest
Новая
       23

Встраивание SVG в PDF (экспорт SVG в PDF с использованием JS)

29 голосов
/ 06 мая 2011

Отправные точки: у меня нет сервера, который может предоставить что-либо, кроме статических файлов. И у меня есть элемент SVG (динамически созданный) в моем <body>, который я хочу экспортировать в векторный формат, предпочтительно PDF или SVG.

Я начал изучать использование уже существующей lib jsPDF вместе с downloadify . Работало нормально. К сожалению, это не поддерживает SVG, только текст.

Я читал о возможностях формата PDF для встраивания изображений SVG, и кажется, что был включен после Acrobat Reader 5 (вместе с плагином ImageViewer). Но это не работает. Я пробовал с 3 различными программами для чтения PDF без успеха.

Значит ли это, что в PDF-файлах отсутствует поддержка встраивания SVG? Я ничего не нашел по этому поводу.

У меня два вопроса; это можно решить? И если да, каковы спецификации для встраивания SVG в PDF? С помощью этой информации я могу создать эту поддержку в jsPDF самостоятельно.

Требованиями к поддержке браузера являются Safari, Chrome и Firefox. Версии с поддержкой SVG.

Ответы [ 5 ]

24 голосов
/ 04 августа 2014

Для тех, кто ищет решение только для JS: PDFKit кажется лучшим решением для создания PDF из JS в наши дни, и оно поддерживает все геометрические примитивы SVG (включая интерпретацию path геометрия струн) из коробки. Все, что потребуется для визуализации существующего SVG-контента, - это DOM-обходчик, который отслеживает стилизацию и наследование CSS, если вам не требуются сложные вещи, такие как символы и т. Д.

Мне не удалось с отрывочной поддержкой SVG комбо jsPDF / svgToPdf , упомянутого в другом ответе, и исходный код этих двух не выглядел очень хорошо созданный и полный для меня.

8 голосов
/ 09 мая 2011

Я отвечу на свой вопрос. В итоге я использовал DocRaptor , который можно назвать на стороне клиента из JavaScript. Это технически решает мою проблему, даже если это несвободное решение. Если бы я мог ответить на стороне сервера, я мог бы использовать wkhtmltopdf , как , предложенный Mic.

6 голосов
/ 06 мая 2013

jsPDF имеет плагин для этого: svgToPdf :

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

Я не пробовал, но это может позволить отказаться от использования внешнего API и / или полагаться на решение на стороне сервера.

5 голосов
/ 06 мая 2011

Вы пробовали WKHTMLTOPDF?Это бесплатный инструмент на основе webkit.Мы написали небольшое руководство здесь.

На Mac с Safari или Chrome вы можете сохранить HTML-страницу со встроенным SVG в PDF.Поскольку эти браузеры используют WKHTMLTOPDF для внутреннего использования, возможно, это будет работать и для вас.

0 голосов
/ 20 октября 2015

EVO HTML в PDF Converter поддерживает конвертирование SVG, встроенного в HTML, в PDF.Вы можете увидеть пример для этой функции здесь: http://www.evopdf.com/demo/HTML_to_PDF/HTML5_Features/SVG_to_PDF.aspx.Пример кода для этого: 

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