cancel
Showing results for
Did you mean:
Surveyor

## Canvas, LaTeX and MathJAX

We are servicing complaints from a number of departments about the inaccessibility of any LaTeX equations entered into the Canvas HTML page editor (and similar). The LaTeX is rendered as an inaccessible image. These departments are refusing to use Canvas because of this.

I wondered if anybody else has similar issues and, if so, would they join me in lobbying Instructure to add MathJax to Canvas so the LaTeX output would be accessible?

Tags (2)
12 Replies

Explorer

I just heard from someone in the other accessibility space about the accessibility of math equations and he shared some input on the accessibility of the Canvas LaTex equations in Canvas.  I'm not an expert on this stuff, but looking at the code and from what what was said, there are a couple of things present in the code to make them more accessible:

<img class="equation_image" title="\sqrt[1]{5}" src="https://usu.instructure.com/equation_images/%255Csqrt%255B1%255D%257B5%257D" alt="LaTeX: \sqrt[1]{5}" data-equation-content="\sqrt[1]{5}" style="max-width: 24px;"><span class="hidden-readable"><math xmlns="http://www.w3.org/1998/Math/MathML">  <mroot>    <mn>5</mn>    <mn>1</mn>  </mroot></math></span>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

While an equation is displayed as at image, the alt text includes the LaTeX code and there is also MathML available. That said there is probably still a case to be made for adding MathJax. I seem to remember a conversation from a year or two ago where there was some concern about loading another JS library and browser support, I don't know how much of an issue it still is. I did find a couple previous ideas posted to the community:

1. https://community.canvaslms.com/ideas/6922 (2016)
2. https://community.canvaslms.com/ideas/8106 (from 2017 - lots of discussion and code samples here)
3. https://community.canvaslms.com/ideas/12274-make-math-equation-editor-accessible (2018)

Perhaps it is time to make another run at it? Interestingly, I found this security update around a vulnerability in MathJax in Canvas - no idea what that is about?

Surveyor

I ran into similar problems while creating pages in Canvas. In particular the lack of MathJax support is a bit frustrating. But I have made a workaround that let's you convert LaTeX articles to plain HTML (Using MathML) that can be read by the Canvas HTML editor.

It supports equations, equation numbers and referencing the equations. It also supports code highlighting and some other stuff. If you want to check it out you can do so here GitHub.

Tags (3)
Surveyor II

@rgerritsen I just wanted to let you know that I ended up playing around with this respository - it's awesome.  After a little bit of manipulation, I encorporated it into my VSCode workflow to simultaneously generate my standard latex .pdf files for offline viewing as well as the html for canvas.  It has significantly improved my workflow.  I just wanted to post this comment to let you (and others) know just how wonderful this tool really is.  ESPECIALLY IN TERMS OF SYNTAX HIGHLIGHTING!  Thank you so much for sharing this!

Surveyor II

@rgerritsen Just following up on this.  Maybe you already know about this, but perhaps others that are finding this thread don't.  I'm a bit late to the game and just discovered a python wrapper for the Canvas API (https://github.com/ucfopen/canvasapi) thanks to a colleague.  In short, this means that I can incorporate a few additional lines of python code to automatically read the .html file generated from your script and then post immediately to canvas.

In fact, I tend to use VSCode as my latex editor so I just built a separate build command that generate the pdf, textToHtml output.html file, and then automatically either update or post to canvas using the following (example template) from the python canvas api.

from canvasapi import Canvas
API_URL = "https://<institutuion>.instructure.com"
API_KEY = "<token goes here>"
canvas = Canvas(API_URL, API_KEY)
course = canvas.get_course('<course ID>')

file_name = "output.html"
f = open("./"+file_name);
page_name = file_name[0:-5];

try:
page = course.get_page(page_name)
except:
page = course.create_page({'title': page_name});

page.edit(wiki_page={'body': page_body});

Surveyor

@KOliveras Cool, I didn't know about the canvas API. I will check it out and thanks for sharing this, this will speed up my workflow considerably.

Also thanks for the kind words about the repository earlier and letting me know it was useful.

Surveyor II

@crafte The link you provided is no longer available.

@mho here is a new link for the same page: Best way to add LaTeX