Home

If you're new to Python
and VPython: Introduction

A VPython tutorial

Pictures of 3D objects

What's new

Classic VPython web site
VPython license
Python web site

 

Math displays using LaTeX - GlowScript VPython only

In GlowScript VPython (but not currently in VPython 7) you can display complex mathematical expressions expressed in the widely used math editing format, LaTeX. Here is an example. The LaTeX capability is provided by MathJax, which is imported by GlowScript. For example, consider this mathematical display:

           equation

You can display this in the caption of an existing GlowScript canvas with the following statements:

box()
scene.caption = "Final kinetic energy = \\( \\dfrac {1} {2}mv_i^{2}+\\int _{i}^{f}\\vec{F}\\circ d \\vec{r} \\)"

MathJax.Hub.Queue(["Typeset",MathJax.Hub])

In the first statement, note that all LaTeX backslashes must be replaced by double backslashes: \ -> \\. For a backslash to appear on the web page (where it will be processed by MathJax) a JavaScript string must use two backslashes, since in a string a single backslash can have special meaning (for example \n represents a carriage return). When you write or paste in a LaTeX description, make sure you double all the backslashes. Unfortunately, there doesn't seem to be any way to write a JavaScript function to double the backslashes for you.

A common way to place a LaTeX math expression within a sentence is to place the expression between dollar signs: $ ..... $. However, with MathJax you must use the format \\( ..... \\) instead. If you want the expression to be centered in the window, use the standard LaTeX format $$ ..... $$.

The second program statement shown above tells MathJax to typeset the LaTeX description and display the mathematics correctly. In fact, this statement will typeset all of the LaTeX expressions currently placed on the web page.

You can also typeset a specific element. For example, suppose you've placed an expression in the title:

scene.title = "\\(\\dfrac {5} {7} \\)"

You can typeset this element, and all other existing LaTeX elements in the usual way -- MathJax.Hub.Queue(["Typeset",MathJax.Hub]). However, suppose that later you change the expression from representing 5/7 to representing 3y/4x. You can change the title like this::

scene.title = "\\(\\dfrac {3y} {4x} \\)"

Then you can typeset just this one element, without re-typesetting other formulas on the web page, with this statement:

MathJax.Hub.Queue(["Typeset",MathJax.Hub,scene.title])

Easy creation of LaTeX expressions

There is a a remarkable tool for creating LaTeX expressions from handwriting (choose "Web Equation". Using the mouse, you simply write the mathematics as you would normally do by hand, and the tool produces the corresponding LaTeX, which you can paste into your program. Remember that you must double all of the backslashes.

Summary

You can use LaTeX to display complex mathematics on the web page. Make all backslashes double: \ -> \\. Within a sentence, use \\( ..... \\). For a centered formula, use $$ ..... $$.

After the LaTeX has been sent to the web page, typeset all of the math with MathJax.Hub.Queue(["Typeset",MathJax.Hub]). You can typeset a specific web page element with MathJax.Hub.Queue(["Typeset",MathJax.Hub, anchor_point]), where anchor_point can for example be scene.title or scene.caption, or a jquery id.

Additional capabilities of MathJax are documented at MathJax.

.