Skip to main content

Section 19.4 -generated images

PreTeXt makes it straightforward to embed code that produces images (such as TikZ) into your source files. The PreTeXt-CLI basically just dumps your code out to your file so that it compiles nicely. However, for HTML display, you will need SVG graphic files. This is where the pretext/pretext script comes in. Running the pretext/pretext script frequently requires patience, particularly on Windows, so settle in with an experienced user before attempting the steps in this section. See Chapter 48 for complete details.

Aside: The pretext script.

Our example here just illustrates using TikZ to make a simple figure (the Hasse diagram of a poset), but lots of other graphics packages can be used. One step required is to put the following three lines in the <docinfo> tag of your main file. <latex-image-preamble> is used to set up the preamble that should be used for making SVG images from your PreTeXt source. Macros that you wish to use more broadly should be put inside <macros> inside <docinfo>. 
<latex-image-preamble>
\usepackage{tikz}
</latex-image-preamble>
Listing 19.4.1. How to use <latex-image> to invoke TikZ
<!--********************************************************************
Copyright (C) 2019-2026  Robert A. Beezer

This file is part of PreTeXt.

PreTeXt is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 2 or version 3 of the
License (at your option).

PreTeXt is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with PreTeXt.  If not, see <http://www.gnu.org/licenses/>.
*****************************************************************-->

<figure xml:id="fig-tikz">
  <caption>A figure generated with TikZ in
  <latex /></caption>
  <image width="15%" xml:id="poset">

<latex-image >
\begin{tikzpicture}
\draw (0,0) -- (0,1);
\draw (1,0) -- (1,1) -- (1,2) -- (1,3);
\draw (0,0) -- (1,2);
\draw (0,1) -- (1,0);
\draw [fill] (0,0) circle [radius=0.1];
\draw [fill] (0,1) circle [radius=0.1];
\draw [fill] (1,0) circle [radius=0.1];
\draw [fill] (1,1) circle [radius=0.1];
\draw [fill] (1,2) circle [radius=0.1];
\draw [fill] (1,3) circle [radius=0.1];
\node [left] at (0,0) {$x$};
\node [left] at (0,1) {$b$};
\node [right] at (1,0) {$a$};
\node [right] at (1,1) {$y$};
\node [right] at (1,2) {$c$};
\node [right] at (1,3) {$d$};
\end{tikzpicture}
</latex-image>
  </image>

</figure>
The code in Listing 19.4.1 produces the following output:
Figure 19.4.2. A figure generated with TikZ in
Well, that’s not 100% true for HTML. If you just run pretext build web, your terminal will display a few warnings about not generating assets such as images. To generate the assets, we have to use the -g flag. To generate the assets before building, on the command line we run the following command (on a single line). (Omitting the web target will, by default, use the first target) in the project.ptx file.)
pretext build web -g

Aside
PrevTopNext