ACS Notes: Displaying Math on the Web -- Samples and Tools
Author: Abby Fox
Description: Sample documents containing mathematical equations created with tools on Athena.
Keywords: equations, math

# Displaying Math on the Web -- Samples and Tools

The samples below are intended as a simple illustration of various options for displaying equations on the web; all were generated using tools available on Athena.

Displaying Math on the Web: Samples and Tools | Comparison of Approaches | Further Information

## Contents

- LaTeX originals
- HTML versions created with:
  - latex2html
  - TtH
  - WebEQ
- PDF versions
- MathML versions

### LaTeX originals

The latex2html and TtH samples below were converted from these originals:

sample.tex sample2e.tex equations.tex equations_eq.tex equations_noaa.tex | standard latex sample standard latex2e sample latex sampler of equations latex sampler of equations (equation env.) latex2e of above with \htmlimage{no_antialias} | (default Athena latex --> sample.dvi) (newtex locker's latex2e --> sample2e.dvi) (default Athena latex --> equations.dvi) (default Athena latex --> equations_eq.dvi) (newtex locker's latex2e --> equations_noaa.dvi)

Note: at this writing, latex 2.09 is the default Athena version; latex2e is available from the newtex locker. With the Athena 8.3 summer 1999 release, latex2e will become the default.

### HTML versions (samples at left, notes on tools at right)

HTML from latex2html | By default, latex2html creates GIF images of most equations (as well as special accents, external PostScript files, and any LaTeX environments it cannot directly translate into HTML). In the `equations*.html` files on the left, all but the first equation are GIF images, whereas the `sample*.html` files consist solely of HTML text.
Default settings: sample.html sample2e.html equations.html equations_eq.html Options (html.sty): equations_noaa.html Options (command-line): sample.html sample2e.html | General syntax
         athena% add infoagents
         athena% latex2html filename.tex
- Options to override default settings There are numerous command-line options, as well as latex2html-provided styles that can be used to customize the ouput. At left: `equations_noaa.html` includes a non-antialiased version of each equation, created by adding `\htmlimage{no_antialias}` commands to the .tex file. the second pair of `sample*.html` files were generated with the following command-line options:
      athena% latex2html -split 0 -info 0 -no_navigation filename.tex
  where the flags are as follows:
      -split 0         generate a single html file
      -info 0          omit "About this document ..." info.
      -no_navigation   omit navigation buttons
2. For more information see: Mathematics section of the latex2html manual Mathematics with latex2html Command-Line Options section of the latex2html manual or type: `latex2html -h` Notes Equation images are generated from PostScript via DVIPS; hence any settings in your `~/.dvipsrc` file may affect the final appearance (for example, the BaKoMa font substitutions recommended above for PDF output seem to produce lower quality images under latex2html). Long afs paths may cause errors such as the following. To avoid this, copy source files to the hard drive (/tmp) and run latex2html there, then move the files over to the locker.
       <tex.pro>[7]
       Unrecoverable error: limitcheck in .putdeviceprops
       (1488)op_array(486)0x14dd88:Execution stack at 0x10f244:
       0x118118: 0x0f oper --F---e-- 0x0000 0x0003c340 = %interp_exit
       0x118120: 0x03 file --G-rxe-- 0x0001 0x0014e2e0
       0x118128: 0x05 mpry --G-rxe-- 0x0002 0x0014eecc
       0x118130: 0x05 mpry --G-rxe-- 0x0039 0x0014f73e
       Dictionary stack at 0x10f16c:
       0x118948: 0x02 dict --Gwrx--- 0x0000 0x00118ab0
       0x118950: 0x02 dict --Gwrx--- 0x0004 0x001637e0
       0x118958: 0x02 dict --Lwrx--- 0x0000 0x0011d9c0
       0x118960: 0x02 dict --Gwrx--- 0x0000 0x00118ab0
       Error while converting image: No such file or directory
3. By default, latex2html puts its output in a directory named with the prefix of the tex file (e.g., the dir. `filename` if the tex file is `filename.tex`). The output in the `filename` directory will include the files:
   `filename.html` or `index.html` | base page
   `filename.css` | style sheet
   `img1.gif, img2.gif,` etc. | images of equations, if any
   `node1.html, node2.html,` etc. | subpages, if any
Other files can be deleted, once you have taken a look at the html page(s) to determine which are actually necessary. (One way to do this is to generate the files in /tmp, move just the html, image, and css files to their final location, and check in a browser to see if things looks ok and the links work.)

HTML from TtH | Unlike latex2html, TtH does not use images to display equations; instead, it translates all equations into HTML, relying on symbol fonts supported by common browsers to display equations. It may be necessary to configure your browser to display these fonts correctly; a test page with instructions is provided to check your settings. (TtHMML, a TeX-to-MathML translator from the TtH author, is now in testing.)
Default settings sample.html sample2e.html Using options: sample.html sample2e.html equations.html equations_eq.html | General syntax
         athena% add tth
         athena% l2h filename      (omit the extension .tex)
Options used in samples
         athena% l2h filename -i
The `-i` flag specifies that italics should be used in equations, as in TeX. For more information, see the TtH manual and Athena-specific notes in `/mit/tth/README.athena`.

HTML with WebEQ | WebEQ is designed to produce web-ready equations for inclusion in HTML files. It supports the emerging MathML specification, and can output equations as JPEG images, Java applets, and/or MathML code. (MathML is a markup language which cannot yet be rendered directly by commercial web browsers, but can be used by other conversion tools; for the experimental browser Amaya and other information see the Further Information page).
Sample files with notes: HTML + images HTML + applets | Note:The sample pages were generated with WebEQ 2.2, the default Athena version at this writing. (WebEQ 2.3.1 has recently been added to Athena but is not yet the default; examples illustrating new features will be added to this page as time permits.) General information about WebEQ follows; the sample pages include specific notes on how each equation was created. WebEQ includes two tools for creating equations: WebEQ Equation Editor is a WYSIWYG, graphical editor for creating simple equations. Equations can be entered by hand, or imported from MathML. WebEQ Wizard is a more powerful command-line editor and file converter. Equations can be entered by hand in either WebTeX (a TeX-like syntax) or MathML, and HTML files containing either format can be converted directly to HTML with images or applets for the equations. The WebEQ documentation includes information on WebTeX and MathML, in addition to WebEQ samples and general information. Running WebEQ on Athena To get started, type:
       athena% setup webeq
- This will launch an xterm labelled "webeq" in which to type the various commands listed below. Using the Equation Editor online documentation to start the Editor:
         athena% webeq_editor &
- Using the Wizard online documentation starting the GUI Wizard:
         athena% webeq_wizard &
- using Wizard from the command line:
         athena% webeq_wizard_command -eq 'equation'

      or athena% webeq_wizard_command -o output.html source.html
  For additional options, type:
         athena% webeq_wizard_command
Notes on applets WebEQ applets run by passing WebTeX or MathML code to `webeq.Main`. In order for the browser to find the necessary files, you should specify
       codebase="http://web.mit.edu/webeq/currenthome/classes/"
in the HTML's applet tag, e.g.:
       <APPLET CODEBASE="http://web.mit.edu/webeq/currenthome/classes/"
       CODE="webeq.Main" WIDTH=131 HEIGHT=48 align=middle>
This value can be set as an option in the Wizard (go to the Options menu, select Show, type the above URL into the Codebase dir. in the Options window; then go back to the Wizard window and select Options-->Save). If running from the command-line, use the `-codebase` flag.

### PDF versions

PDF |
1. sample.pdf sample2e.pdf equations.pdf equations_eq.pdf | Steps in the PDF conversion process: If you are starting with a LaTeX file, put the following line in your ~/.dvipsrc file:
       p +/afs/athena.mit.edu/contrib/tex-contrib/BaKoMa/fontmap.map
   and then create a PostScript file from your original:
       athena% dvips -f < filename.tex > filename.ps
2. (The above customization instructs DVIPS to use scalable BaKoMa fonts rather than bitmaps for common mathematical fonts; otherwise, PDF produced from DVIPS output tends to be poor quality for on screen viewing. For details, see optimizing TeX/LaTeX originals for PDF conversion in the ACS PDF FAQ.) Use Acrobat Distiller to generate PDF from the PS file.
       athena% add acro
       athena% distill filename.ps
For more details, see the ACS PDF FAQ.

### MathML versions

MathML | These samples are HTML pages containing MathML for the equations. To view the equations as intended, you will need to open them in a program that is able to render or convert MathML. (See Further Information.)
from Amaya from WebEQ from TtHMML | The first two samples were generated from the editor/palette features in Amaya and WebEQ respectively; the third was created from the sample latex file `equations_eq.tex` using the experimental TtHMML translator.

Displaying Math on the Web: Samples and Tools | Comparison of Approaches | Further Information

| Academic Computing | Contact us

Last modified: Thu May 27 11:07:09 1999