Forum Discussion

Nathan_Hilliard's avatar
Nathan_Hilliard
Community Member
3 months ago

MathJax for Mathematical Formulas (Latex)

I know Sam Hill posted about MathJax a few days ago, but since I was already working on this, I thought I might as well add to the options.

This is an approach to incorporating MathJax into Storyline slides. It uses MathJax version 3. I am not overly familiar with MathJax or Latex, so I'm sure the implementation could be improved. Feel free to do so. I offer this as a starting point, and as an aid for those trying to figure out how to get itworking inside Storyline.

Demo: https://360.articulate.com/review/content/1b34be37-b259-49a3-9f11-d9891e4a4dba/review

This loads MathJax via a CDN script. It includes a basic MathJax configuration script that specifies the font location and loads the color module (for color control). View the MathJax documentation for many more options.

For this implementation, add textboxes on your slide where you want to display formulas. Use the accessibility tags as identifiers. Create a list of identifiers (comma seperated, in a SL vriable) to tell the script what areas to process. I chose to target specific textboxes over letting MathJax process the whole slide to maintain better control. You can update the formula instructions and have MathJax update the display as needed. Adjust the size of the font in the textbox to adjust the size of the displayed equation (some trial and error required).

To ensure things work, just enter one line of text into each textbox (for the identifier tag), with no formatting. The text portion of the SVG will be removed. The script just expects one text line. This is an area for potential improvement (maybe just hide it instead of removing it, and deal with additional entries in the SVG).

Try entering your own Latex instructions into the demo to see the updated results.

You can adjust the processing approach to suit your needs.

 

No RepliesBe the first to reply