• View
• Edit
• History
• Attach
• Print
• Backlinks

JsMath

Questions answered by this recipe

• How can I include mathematical formulas in my webpage, using TeX/LaTeX notation.
• Can I use both $ $ and $$ $$ LaTeX environments, so that I can have equations automatically centered when needed. For example: \sqrt{n}, \int_a^b f(x) dx, \displaystyle \int_a^b f(x) dx and
  \sqrt{n}, \int_a^b f(x) dx

Notice that you can double click on images to see the LaTeX code.

• Can I get mathematical formulas to change size as the text changes size? (Yes. You can either install the TeX fonts, adjust the options in the jsMath control panel, or reload your page once you get to the desired size, and the images will download correctly.)
• Is there a way to print crisp clean mathematics directly from the webpage?

Description

Embed scalable mathematics in webpages with high print quality.

Notes

You can download jsMath from the author's website at http://www.math.union.edu/locate/jsMath. It is a javascript method of embedding mathematics into webpages. Users can either view mathematics output using precompiled images on the server, or users can download and install TeX fonts on their computer which speed up the view experience and increase the quality printing.

1. Download jsMath.phpΔ and put it in the cookbook/ directory
2. Download and install the latest jsMath archive from Sourceforge into your PmWiki's pub/ directory, as pub/jsMath/ . Or, you can install jsMath wherever you wish, and edit config.php to set $JsMathUrl to the url of the jsMath directory.
3. Download and install the appropriate fonts from the author's website here
4. Add the following line to a local customization file:

    include_once('cookbook/jsMath.php');

That's it! The script adds {$$ ... $$} and {$...$} markups that display LaTeX-style math equations, the first form centers the equation, while the second generates the equation "inline".

• You will find your experience to be better if you actually download

and install the jsMath fonts, but the site can be viewed just the same without.

• The math graphic for the GUI toolbar is available at .

Using jsMath without ~80 MB of fonts

You can force jsMath to work without with font files. This only works if users are willing to download the font files to their computers. I modified the jsmath.php file as follows (not sure if some of this is redundant):

 $HTMLHeaderFmt['jsMath'] = '
    <script> jsMath = {Controls: {cookie: {scale: 120}}} </script>
    <script src="$JSMathUrl/plugins/noImageFonts.js"></script>
    <script src="$JSMathUrl/plugins/autoload.js"></script>
 ';
 $HTMLFooterFmt['jsMath'] = '
    <script src="$JSMathUrl/plugins/noImageFonts.js"></script>
    <script>
        jsMath.Autoload.Check();
        jsMath.Process(document);
    </script>
 ';

Release Notes

Comments

See Discussion at JsMath-Talk

Disable message "No jsMath TeX fonts found"

I'm not sure what the newest developments of this recipe are, but I didn't care about font quality as long as one could read the formula on the screen. So I simply disabled the red message box above by adding the following line to config.php before (!) the include_once statement of this recipe (my reference):

$HTMLStylesFmt[] = "#jsMath_Warning {display: none}";

Frank, 14-Dec-2008

See Also

Contributors

Ben Woodruff