2 ms·
Does anyone have any good suggestions as to which approach to take if I want to produce PDF with vector graphics inside? Right now our pipeline looks like this
by vbezhenar 4y ago
Does anyone have any good suggestions as to which approach to take if I want to produce PDF with vector graphics inside?
Right now our pipeline looks like this:
1. Code generates SVG. It contains quite a lot of elements and takes something like 250 KB unzipped or 20 KB zipped.
2. SVG is converted to big PNG using resvg. Now this SVG is something like 1.5MB unoptimized. We further use pngquant to shrink it to something like 500KB.
3. We use HTML templates to produce a document with embedded PNG image.
4. Now we use HTML to PDF (could be Chromium, but we use some Java library) to produce PDF document and this is the end result.
Good thing about this pipeline is that SVG and HTML are somewhat easy to understand and modify.
This PDF document obviously contains raster and not vector image, so it does not look good when zoomed and it takes more space that I'd like.
What I want to implement: keep HTML part (because that's kind of report and it should be changed if necessary) but embed image with some kind of vector approach, so PDF would contain vectorized image.
I tried to just embed SVG as it is. Well, it kind of worked. But Chrome printed out enormous pdf. Something like 100 MB I think. My computer almost choked trying to render it. But it was vector, yes.
I've given up on this task as I didn't find any easy approach and generating PostScript for the whole document seems not appropriate. I think I could generate PostScript file for the image, but how do I embed PostScript file into HTML so PDF print would use it as it is?
- jefftk 4y agoI've never used it, but maybe https://github.com/yWorks/svg2pdf.js https://github.com/yWorks/svg2pdf.js does what you want?
- jahewson 4y agoThat’s pretty crazy. PDF is a vector format so rendering SVG to a bitmap to insert into it is like using email to send a photo of a fax. Seems like you’re already aware of that though! There’s many libraries out there that can convert vector SVG directly to vector PDF. Sometimes it’s worth just paying the license for, say pdftron. Alternatively if you are generating the would-be SVG content in JS you could directly generate PDF instead of SVG with http://pdfkit.org/ http://pdfkit.org/ Chrome usually does a good job rendering SVG directly to PDF. It’s overkill of course, but if you’re already used to using it then it’s the path of least resistance. If you’re getting giant PDFs output then I suspect there’s something weird with your input SVG. It might contain some pathological content (huge embedded images? paths with large amounts of almost invisible details? fonts that aren’t embedded sensibly? e.g. vectors of every glyph)
- vbezhenar 4y agoNo, that image is pretty primitive. Lots of lines, lots of dots (tiny circles), some polylines, few text labels. Nothing fancy at all. I dont really want to turn entire document into svg. There’s some text, some tables, things that fit perfectly for HTML and not so much for SVG. Right now I’m thinking about using GNU groff. It would be a very different approach.
- jahewson 4y agoThat’s understandable. Maybe try commenting out all the generating code and adding it back piece by piece until the document size balloons, then you’ve found your culprit. The MuPDF ‘mutool’ is pretty handy for dumping internal PDF content to see which parts are large.
- amichal 4y agoCommercial solution but princexml is really good at this. Its really the kind of tool you want if your "generate pdf" functionality needs any advanced pdf functionalty
- ilaksh 4y agohttps://github.com/alafr/SVG-to-PDFKit https://github.com/alafr/SVG-to-PDFKit (svg-to-pdfkit)
- MayeulC 4y agoWhy not use inkscape? You can also use something like `scour` on your svg beforehand.