Next Up Previous Contents
Next: 4 The libdvi2bitmap library
Up: 3 Usage notes
Previous: 3.3 Processing many bitmaps
[ID index][Keyword index]

3.4 Using marks to position bitmaps

When 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:


% 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.
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.

The output with --query=bitmaps is:


% dvi2bitmap --verbose=quiet --query=bitmaps temp
Qbitmaps temp-page1.png 163 14 -1 11
...where 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:


% 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"/>
%
So that's generated an <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.


Next Up Previous Contents
Next: 4 The libdvi2bitmap library
Up: 3 Usage notes
Previous: 3.3 Processing many bitmaps
[ID index][Keyword index]
Dvi2bitmap -- convert DVI files to bitmap images
Starlink System Note 71
Norman Gray
14 June 1999. Release 0.12. Last updated 20 December 2003