PDF doesn't contain SVG images

Oct 7, 2015 at 3:45 PM
TL;DR: How to include SVG images in a PDF generated by Madoko?.

I'm working on a document with SVG images. They are included fine in the HTML output, but for PDF I can't get them included.

$ madoko --pdf doc.mdk reports this:
  error: source line: THE-LINE
  ! Unable to load picture or PDF file 'img/THE-SVG-FILENAME.svg'.
  <to be read again> 
  l.216 ...components}]{img/THE-SVG-FILENAME.svg}
  log written at: doc.log
I tried to export it to LaTeX first and then to PDF, but got a similar error:
$ madoko --tex doc.mdk
$ pdflatex doc.tex

! LaTeX Error: Unknown graphics extension: .svg.

See the LaTeX manual or LaTeX Companion for explanation.
Type  H <return>  for immediate help.
l.216 ...components}]{img/e-wallet-components.svg}
Ignoring the error messages, it will produce the PDF without the images.

Somebody explains a solution for a similar problem, by not ingluding the .svg extension in the \includesvg code.

So i tried deleting that file extension from the .tex file generated by madoko --tex, and regenerating the PDF, but i got the obvious answer of File Not Found:
$ sed -i "s/\.svg//g" doc.tex
$ pdflatex doc.tex

! LaTeX Error: File `img/e-wallet-components' not found.
This must be because the .tex file generated is not using the \includesvg code and I should not expect that solution to work the same... but I had to try.

So, How to include SVG images in a PDF generated by Madoko?.
Oct 7, 2015 at 8:49 PM
Ah -- including .svg -- this is not well supported yet but it would be nice if we can find a good solution.
Clearly, in the HTML output there is no problem for .svg files -- however, LaTeX does not support .svg images well at all. Currently, to include .svg images, you need the svg package and a bunch of external programs that need to be run to convert the .svg image internally to a .pdf. This is not great from a Madoko perspective since it makes it less portable (on Window various programs need to be installed) and it makes it not possible to do the generation on the server since shell escapes are not allowed because of security.

The best solution is to convert the .svg files to .pdf files for Latex.... is that possible for you? I saw there are various ways to convert a .svg to a .pdf images (with Inkscape you can export .pdf directly). Also, I think Madoko should have extra support here -- already when including .pdf or .ps images, the HTML backend uses a .png instead; for a included .svg images, the LaTeX backend could by default look for a .pdf image. If this can work for you, you can for now include such images as:
~ HtmlOnly
[img]: "myimage.svg" { width=100% }
~ TexOnly
[img]: "myimage.pdf"
ps. If you really don't want to do such conversion and use the svg package, you can use the following metadata:
Package: svg
Refer: myimage.svg
Where Refer ensures Madoko knows about the image file. Then use raw tex to include the svg image in the PDF:
Oct 7, 2015 at 11:33 PM
Edited Oct 7, 2015 at 11:33 PM
Thank you. I used the solution based on specific rules for HTML and TEX.

It's kind of sad to maintain two representations of the same image and complicate the source .mdk file fot this, but is good meanwhile.

Thank you again.
Oct 13, 2015 at 7:29 PM
I fixed your issue with a generic image choice mechanism. The latest releases support this (0.9.9-beta, already online, and use npm install -g madoko to update the console program). You can now use:
[img]: "myimage.[svg,pdf]"
To let the backend choose the best image format automatically. Of course, you still need to provide a image in a LaTeX supported format (like pdf, eps, png, jpg etc) since it is generally difficult to include svg images directly in LaTeX.

Let me know if this works for you :-)
Oct 15, 2015 at 4:07 PM
This worked fine for my document, thanks!
A related question: is there a way to define a maximum width and/or an scale (similar to the includegraphics command's scale in LaTeX) for the figures? That would very useful for generating nice PDFs.

Oct 15, 2015 at 4:25 PM
:-) Great to hear.

What do you mean with maximum width? Currently, the new backend recognized the following css attributes:
  • width, height: in any dimension
  • zoom or transform-scale but set the \includegraphics scale attribute (not a perfect fit with CSS but especially zoom seems to be the same on most browsers)
  • transform-rotate: rotates the image
Both the zoom and transform-rotate can only be given a number for now; zoom as a factor (i.e. 2 or 0.5) and transform-rotate as counter-clockwise degrees.
For width you can use auto or a dimension, or a percentage of available width (100%).

I hope this helps
Oct 15, 2015 at 4:33 PM
The maximum width would be similar to the max-width CSS property: http://www.w3schools.com/cssref/pr_dim_max-width.asp
For example, if I set the zoom to 0.8 and the max-width to 100% and the scaled figure would be larger than the \linewidth of the page, it should only zoom in to width=100%.
This of course is quite a quirky use case. I usually do this with the adjustbox package in LaTeX:
\begin{adjustbox}{max size={\textwidth}{\textheight}}
Oct 15, 2015 at 4:56 PM
Ah, I see. max-width is supported for general block elements but currently not taken into account for images -- I will update Madoko to do that. However, I am not sure if that works well with scaling -- we'll see :-)
Oct 19, 2015 at 8:49 PM

Just to let you know npm install -g madoko insists in installing 0.9.8-beta and npm install -g madoko@0.9.9-beta fails reporting: version not found: madoko@0.9.9-beta.

The madoko codeplex page reports 0.9.8-beta as the current version. Searching in history it is the tag 0.9.9-beta. I'll try cloning the project a figure out how to run it, and tell you back if it worked for me.
Oct 23, 2015 at 10:03 PM
Thanks! The version trouble may have been fixed by now; latest release is 0.9.12-beta.