libdvi2bitmap
libraryWhen including small images in an HTML page, it can be difficult to get the images to line up with the rest of the text, because a text with descenders (characters which go below the line such as `p' or `g') cause the image to be offset from the text line. You can use the `mark' facility to tell you how much you need to offset such an image so that it lines up properly with the surrounding text.
For example, consider the following usage:
So, a simple test file with a single line in it, with descenders (the `p'). The `mark' special goes at the beginning, following \noindent. This is important, otherwise the point that is marked is the very top-left of the image, not the bottom-left.% cat temp.tex \nopagenumbers \noindent\special{dvi2bitmap mark}% Hello, this is dvi2bitmap \bye % tex temp.tex This is TeX, Version 3.14159 (Web2C 7.3.11) (./temp.tex [1] ) Output written on temp.dvi (1 page, 240 bytes). Transcript written on temp.log.
The output with --query=bitmaps
is:
...where% dvi2bitmap --verbose=quiet --query=bitmaps temp Qbitmaps temp-page1.png 163 14 -1 11
verbose=quiet
has been used to turn
off the usual chatter. It tells us that the bitmap as a
whole is 14 pixels deep, and that the mark, which is on the
TeX baseline, remember, is at position (-1,11) relative to
an origin at the top-left of the bitmap; or in other words
there's 3 pixels of space between the TeX baseline and the
bottom of the image. We therefore know that we need to
offset the image by three pixels to make it line up
properly.There are several ways to do that, but one way is to use per-element CSS properties, like this:
So that's generated an% dvi2bitmap --verbose=quiet --query=bitmaps temp | awk '{printf "<img src=\"%s\" style=\"margin-bottom: %dpx\"/>\n", $2, $6-$4}' <img src="temp-page1.png" style="margin-bottom: -3px"/> %
<img>
element
which has the correct `src' attribute (from column 2 of the
Qbitmaps line) and the correct offset (column6 - column4).
That uses awk, but if you're generating your HTML pages with
something like Perl or Python (substantially more sensible
than awk...!), say, you could do an analogous thing with the
dvi2bitmap output, and put the generated
<img>
elements in the correct places in
the output HTML file.libdvi2bitmap
library