Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

generating small PNG images from LaTeX

397 views
Skip to first unread message

John Goche

unread,
Oct 15, 2011, 9:27:14 AM10/15/11
to

Hello,

I would like to generate square PNG images containing some
math fractions from LaTeX so that I can use the images on a website.
I need to generate quite a few of these images. Anyone have any
suggestions on how I may go about doing this? Basically I would
like my LaTeX output to be small rather than a whole page and
then I would use ps2png or some such tool under Linux to do
the conversion, but how can I generate a PS file that small?
I could capture an image of the PS file from a graphics program
and then crop it but that would be error prone and too time
consuming. I need to do this stuff from the shell somehow.

Any help would be greatly appreciated,

Thanks,

John Goche

Alain Ketterlin

unread,
Oct 15, 2011, 10:43:52 AM10/15/11
to
John Goche <johng...@googlemail.com> writes:

> I would like to generate square PNG images containing some
> math fractions from LaTeX so that I can use the images on a website.

preview.sty will let you do that. Use it with pdf(la)tex to generate one
pdf page per equation, and then use ghostscript to convert to PNG.

-- Alain.

Bob Tennent

unread,
Oct 15, 2011, 10:51:40 AM10/15/11
to
On Sat, 15 Oct 2011 06:27:14 -0700 (PDT), John Goche wrote:
>
> I would like to generate square PNG images containing some
> math fractions from LaTeX so that I can use the images on a website.

latex2html will do this for you. But even better, just put LaTeX math
expressions in your html enclosed by \( \) for in-line math and \[ \]
for displayed math, and add

<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
</script>

to the <head>. Works in any browser that supports Javascript. For more
information:

http://www.mathjax.org

Bob T.

Rolf Niepraschk

unread,
Oct 15, 2011, 2:08:03 PM10/15/11
to
Am 15.10.2011 15:27, schrieb John Goche:
>
...
> Any help would be greatly appreciated,
>
...

Here is a small example:
--------------------------------------------------
% ======= document.tex ==========
\documentclass{article}

\usepackage[active,tightpage,displaymath]{preview}

\begin{document}

One equation:

\begin{equation}
E = m c ^ 2
\end{equation}

Another equation:

\begin{equation}
a=\frac{b}{c} \sum_{i=1}^{n}x_{i}
\end{equation}

\end{document}
--------------------------------------------------

Make the following calls:

--------------------------------------------------
latex doument.tex
dvipng -D 96 -bg Transparent -fg "rgb 1.0 0.0 0.0" \
dokument.dvi -o formel%02d.png
--------------------------------------------------

The result: Two png graphic files ("picture01.png" and "picture02.png")
with red foreground and transparent background and 96dpi resolution. For
more details see the documentation of "preview.sty" and "dvipng".

...Rolf









John Goche

unread,
Oct 15, 2011, 5:49:32 PM10/15/11
to
On Oct 15, 8:08 pm, Rolf Niepraschk <Rolf.Niepras...@gmx.de> wrote:
> Am 15.10.2011 15:27, schrieb John Goche:
>
> ...
> > Any help would be greatly appreciated,
>
> ...
>
> Here is a small example:
> --------------------------------------------------
> % ======= document.tex ==========
> \documentclass{article}
>
> \usepackage[active,tightpage,displaymath]{preview}
>
> \begin{document}
>
> One equation:
>
>    \begin{equation}
>      E = m c ^ 2
>    \end{equation}
>
> Another equation:
>
>    \begin{equation}
>      a=\frac{b}{c} \sum_{i=1}^{n}x_{i}
>    \end{equation}
>
> \end{document}
> --------------------------------------------------

Thanks Bob, Rolf, and Alain for your responses.

I am struggling with having the following simple math:

$\frac{\pi}{2}$

output in a 72x72 pixel PNG on a yellow background.
The problem is that latex2html does the job but I don't
know how to specify the size or the background. On the
other hand the dvipng solution that Rolf suggested seems
to allow one to specify the color and the size but I am unable
to generate output for simple math not enclosed in begin
equation and equation blocks. Any ideas on how I can
obtain the desired result?

Thanks once again for your help,

John Goche

Peter Flynn

unread,
Oct 15, 2011, 6:28:26 PM10/15/11
to
ImageMagick or the NetPBM tools will let you subsequently crop and
otherwise modify the images s you can get them into the right size and
scale.

///Peter

Philip Hirschhorn

unread,
Oct 15, 2011, 9:55:47 PM10/15/11
to
Another thought: Use pdflatex to create a pdf (be sure to use
\pagestyle{empty} so that the math is the only thing on the page) and
then use pdfcrop to reduce the size to the bounding box of the math.
You can then convert the pdf to whatever format you prefer.

Hope this helps,
Phil Hirschhorn

--
----------------------------------------------------------------------
Philip Hirschhorn p...@math.mit.edu
p...@poincare.wellesley.edu
----------------------------------------------------------------------

XeCycle

unread,
Oct 15, 2011, 11:25:08 PM10/15/11
to
Rolf Niepraschk <Rolf.Ni...@gmx.de> writes:

[...]
Thanks for you suggestion, I'm wondering if I can use preview.sty for
separate compilation --- I found compiling PSTricks graphics very slow,
so I want to compile them in a separate file, and \includegraphics these
PDF in the main.tex. What about that?

PS. I used XeLaTeX to compile you example, but it didn't seem to crop
spaces on the left. What if I want to do that? Neither flushleft nor
fleqn work.

--
Carl Lei (XeCycle)
Department of Physics, Shanghai Jiao Tong University
OpenPGP public key: 7795E591
Fingerprint: 1FB6 7F1F D45D F681 C845 27F7 8D71 8EC4 7795 E591

Rolf Niepraschk

unread,
Oct 16, 2011, 6:18:37 AM10/16/11
to
Use the package option "textmath" instead or in addition to
"displaymath". See

texdoc preview

for more details.

...Rolf

Rolf Niepraschk

unread,
Oct 16, 2011, 6:22:44 AM10/16/11
to
Am 16.10.2011 05:25, schrieb XeCycle:
...
>
> Thanks for you suggestion, I'm wondering if I can use preview.sty for
> separate compilation --- I found compiling PSTricks graphics very slow,
> so I want to compile them in a separate file, and \includegraphics these
> PDF in the main.tex. What about that?

Look at the packages "pst-pdf" and "auto-pst-pdf" (based on "preview")

==> http://tug.org/PSTricks/main.cgi?file=pdf/pdfoutput

...Rolf

Rolf Niepraschk

unread,
Oct 16, 2011, 7:25:53 AM10/16/11
to
Am 16.10.2011 05:25, schrieb XeCycle:
...
>
> PS. I used XeLaTeX to compile you example, but it didn't seem to crop
> spaces on the left. What if I want to do that? Neither flushleft nor
> fleqn work.
>
...
Have you tried the package option "xetex"?

...Rolf


XeCycle

unread,
Oct 16, 2011, 8:04:38 AM10/16/11
to
I did, sorry I forgot to mention that. The complete file is here
(modified):

--8<---------------cut here---------------start------------->8---
\documentclass[fleqn]{article}

\usepackage[active, xetex, tightpage, displaymath]{preview}

\begin{document}
\[ \sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6} \]
\end{document}
--8<---------------cut here---------------end--------------->8---

It didn't crop off all the left margin. It didn't even crop the right
margin --- without [fleqn] it can crop the right margin. Compiled with
xelatex.

John Goche

unread,
Oct 16, 2011, 8:42:57 AM10/16/11
to
On Oct 16, 3:55 am, Philip Hirschhorn <p...@math.mit.edu> wrote:

> Another thought: Use pdflatex to create a pdf (be sure to use
> \pagestyle{empty} so that the math is the only thing on the page) and
> then use pdfcrop to reduce the size to the bounding box of the math.
> You can then convert the pdf to whatever format you prefer.

Thanks,

This was helpful since I need to crop and rescale programmatically
rather than by hand with imagemagic or netpbm. So I tried the
following.
However I am not sure how to achieve the following:

1. resize the cropped image so that it is square, say 72x72 pixels
2. arbitrarily change the font size of the enclosed math
3. change the background of the (fancy)box to yellow
4. ensure the PNG is anti-aliased so that there are no jagged edges

Ideally the PNG I end up with would be a vector image so that I can
rescale it as needed. Don't know whether to achieve this I somehow
need to start with a metafont file or something. (?)

$ cat doc.tex
\documentclass{slides}

\usepackage{fancybox}

\begin{document}
\pagestyle{empty}

\Huge
\fbox{$+\frac{\pi}{2}$}

\end{document}
$ pdflatex doc.tex; pdfcrop doc.pdf; pdf2ps doc-crop.pdf; ps2png doc-
crop.ps doc-crop.png
$ gimp doc-crop.png

Thanks again for all your help,

(Hope I'm not asking for too much),

Best Regards,

John Goche

John Goche

unread,
Oct 16, 2011, 9:17:08 AM10/16/11
to
On Oct 16, 12:18 pm, Rolf Niepraschk <Rolf.Niepras...@gmx.de> wrote:

> Use the package option "textmath" instead or in addition to
> "displaymath". See
>
>    texdoc preview
>
> for more details.
>
> ...Rolf

Thanks Rolf,

I have now tried the following. I am using the slides document class
only because I want my text to be medium sized and the article
document
class does not give me a large enough size even when I use the \Huge
directive. I don't know of any alternative way to gain finer control
over the
font size in the document but I see the dvipng command has a wonderful
-D flag which gives enough support for this as seen in the man page. I
have only one problem: I would like my images to be exactly square,
with adequate _padding_ added as needed. For this I have tried
enclosing
the text in a fancybox but I still don't know how to make the fancybox
square
or of a specified size with the math centered within it.

Thanks once again for all your help,

John Goche

$ cat doc.tex
\documentclass{slides}

\usepackage{fancybox}

\begin{document}
\pagestyle{empty}

\Huge
\fbox{$+\frac{\pi}{2}$}

\end{document}
$ latex document.tex; dvipng -D 96 -bg "rgb 1.0 1.0 0.0" -fg "rgb 1.0
0.0 0.0" document.dvi -o formel%02d.png; gimp *png

XeCycle

unread,
Oct 16, 2011, 9:30:24 AM10/16/11
to
Philip Hirschhorn <p...@math.mit.edu> writes:

[...]

> Another thought: Use pdflatex to create a pdf (be sure to use
> \pagestyle{empty} so that the math is the only thing on the page) and
> then use pdfcrop to reduce the size to the bounding box of the math.
> You can then convert the pdf to whatever format you prefer.

Thank you very much for pointing `pdfcrop' out, this is also the
simplest solution to my pstricks separate compilation need, since I want
to use XeLaTeX which rejected many solutions.

remo

unread,
Oct 16, 2011, 1:53:14 PM10/16/11
to

OK, thanks for your replies, I finally managed to achieve what I
wanted.
On Ubuntu Linux 11.04 I had to download the latest ImageMagic 6.6.8-10
as no deb package was available but only after installing zlib and
libpng was
I able to run convert (convert from the ImageMagick package) on the
image file:

$ convert image.png -background "#ffff00" -gravity Center -extent
72x72 hello.png

Combined with the other latex and dvipng commands I can finally obtain
the result
I want from a script file.

Thanks again,

John Goche

ddoherty03

unread,
Oct 17, 2011, 12:31:34 PM10/17/11
to
Thanks for the tip about mathjax. This is the simplest way to handle
this IMHO.

dan

JohnF

unread,
Oct 17, 2011, 2:16:22 PM10/17/11
to
John Goche <johng...@googlemail.com> wrote:
> [...]does not give me a large enough size even when I use the \Huge
> directive.
> [...]I see the dvipng command has a wonderful
> -D flag which gives enough support for this
> [...]I would like my images to be exactly square,
> with adequate _padding_ added as needed. For this I have tried
> enclosing the text in a fancybox but I still don't know how
> to make the fancybox square
> or of a specified size with the math centered within it.

You're using these images in an html document with an <img> tag???
If that's right, then I think you could use my program
http://www.forkosh.com/mathtex.html for all of this.
You can read the details at its homepage there, or just look
at the sample page I put at http://www.forkosh.com/mathtest.html
and see its page source.

The base expression for the sample is \frac{a}{\sqrt{1+a^2}}
embedded in the tag
<img src="http://www.forkosh.dreamhost.com/mathtex.cgi?
\png\frac{a}{\sqrt{1+a^2}}" align="absmiddle">
That \png tells mathtex to generate a png rather than
its default gif. Then change the base expression to
\png\color{blue}\frac{a}{\sqrt{1+a^2}}
and mathtex automatically includes the color package.
Then add
\png\dpi{300}\color{blue}\frac{a}{\sqrt{1+a^2}}
and mathtex automatically uses that -D switch when it runs dvipng.
Finally, to square it off, use height and width attributes
in the html <img> tag, so the whole end result becomes
<img src="http://www.forkosh.dreamhost.com/mathtex.cgi?
\png\dpi{300}\color{blue}\frac{a}{\sqrt{1+a^2}}"
height=100 width=100 align="absmiddle">
You can see all that being done in the page source.
I didn't try to pad it off with a box, but that ought to
work with mathtex if it works for you.

It seems to me like the one trick you missed was
trying to square off the image within latex rather
than just using those html height and width attributes.
That ought to work with any other solution besides mathtex
that's been mentioned in this thread, too.

If you want to use mathtex and are just doing a few hundred images,
feel free to use that cgi at forkosh.dreamhost.com,
in which case you don't need anything installed on your server.
If you're doing thousands, please install the gpl'ed program
yourself (see its homepage cited above for details).
--
John Forkosh ( mailto: j...@f.com where j=john and f=forkosh )

Scott Pakin

unread,
Oct 17, 2011, 10:14:23 PM10/17/11
to
One possibility is to use Google's Chart API. For example,

https://chart.googleapis.com/chart?cht=tx&chl=\frac{a}{\sqrt{1%2Ba^2}

refers to a PNG file for \frac{a}{\sqrt{1+a^2}}. A bit fancier,

https://chart.googleapis.com/chart?cht=tx&chl=\frac{a}{\sqrt{1%2Ba^2}&chs=100x100&chf=bg,s,000080&chco=ffff00

refers to a 100x100 white-on-navy-blue graphic of the same formula. See

http://code.google.com/apis/chart/infographics/docs/formulas.html

for more information.

-- Scott

Martin Scharrer

unread,
Oct 18, 2011, 7:15:26 AM10/18/11
to
Have a look at http://tex.stackexchange.com/questions/11866/compile-a-latex-document-into-a-png-image-thats-as-short-as-possible/11880#11880 which explains how to use the standalone class for something like this.

Best Regards,
Martin Scharrer

0 new messages