[ARCHIVED] Canvas, LaTeX and MathJAX

[adam_marshall]

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?

Adam

[crafte]

Hi  @adam_marshall ‌ - you might want to read through this thread: Best way to add LaTex equations.

[mho]

@crafte The link you provided is no longer available.

[Nancy_Webb_CCSF]

I've been looking into accessibility of equations in Canvas @mho , and I think this is the new link to that discussion:

Best way to add LaTex equations.

[mho]

Thank you, @Nancy_Webb_CCSF. Unfortunately, when I follow your link, I got the error message, "An invalid set of parameters has been specified in the url."

[Nancy_Webb_CCSF]

Sorry @mho - looks like there was an extraneous "s" at the end of the url.

Try this:  https://community.canvaslms.com/t5/Instructional-Designer/Best-way-to-add-LaTeX-equations/m-p/175131

[mho]

The link is no longer available.

[christopher_phi]

Hey Adam, 

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? 

[rgerritsen]

Hey Adam,

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.

[KOliveras]

@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!

[KOliveras]

@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_body = f.read();
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});

[rgerritsen]

@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.

[crafte]

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

[ys4]

I found the equation editor under Canvas very buggy and I wasted countless hours using it for quizzes.  I thought I found a workaround with mathml [converting from latex to mathml offline and then entering the output as html into the quiz..] only to discover that this will work only under Firefox..  It is very difficult to get any help because  canvas does not provide any technical assistance  -- they instead rely on the community to solve their problems. Too late for this semester but I plan on switching to something else next semester.  It is irresponsible to put an unreliable product out there and count on institutions to adopt it broadly while ignoring the burden the product puts on users. 

[o_lakkis]

Yep. My experience with Math on Canvas has been a pretty disappointing and frustrating one so far.

[phillip_mills · Accepted solution]

If you're following this thread you might be excited to know that Canvas now provides support for MathJax rendering of LaTeX equations, including inline and block mode equations entered using delimiters in things like page titles etc, though not in all things (e.g. the Course Chat)

This is a very big accessibility improvement that I'm very happy about!

[JohnFabricius]

Adding MathJAX to Canvas is a great improvement! However, MathJAX does not seem to work in "all Canvas text fields" as claimed in the Canvas Release 2021-02-20.

I am working to produce question banks for a Mathematics course at a Swedish university. Prior to February 20, I entered mathematical equations as LaTeX code through the Rich Content Editor (advanced view). Since Monday, February 22, equations are no longer displayed correctly. When viewing the raw HTML-code it seems that a lot of "garbage" had been inserted.

Eager to try the new MathJAX syntax I rewrote some of the questions in my bank. Unfortunately, this didn't help the problem. Either the equation didn't render at all, which suggest MathJAX is disabled in the question bank setting, or it produced new "garbage". It didn't help to import the questions to a quiz for preview, equations still did not render properly. Funny fact though, when I inserted LaTeX code in the titel of the question bank it rendered beautifully!

Question: Have the developers forgotten to add support for MathJAX in the question bank environment?

Kind regards,

John

[phillip_mills]

@JohnFabricius as of 10:02:44 pm GMT, Wednesday, 24 February 2021 it's no longer working for me anywhere except Canvas Beta. I think it's been turned off. That has happened before unfortunately, so I'd ask your account rep about it.

[James]

@JohnFabricius 

There are other threads here in the Community today with Instructure employees saying that the engineers turned of the MathJax support that was enabled last weekend.

[phillip_mills]

Thanks @James. I will take a look at that too. It's a bit annoying given this is the second time it has happened (turned on and off).

[James]

@phillip_mills 

The Feburary 2021 release notes had a note added that they were working on it. It seems that the problem is with formulas in classic quizzes. When they have it working, they will re-enable it for everyone. For the interim, they have thrown it behind a feature flag that a Canvas Admin could enable. 

I'm not sure if the problem is with the conversion of existing images into MathJax or if the problem is that it doesn't display inline LaTeX within quizzes. The documentation didn't go into detail.

Since I never created quizzes that used the inline LaTeX and no one else at our institution knew this was even a thing (when I asked last year if anyone wanted added to a subaccount where I enabled MathJax, no one was interested) , I could enabled that and I would be the only person affected. I switched all my classes back to my implementation of MathJax (which checked to see if Canvas' version was already loaded before running) so I'm okay, but it's tempting to turn it on. I think not knowing the exact problem is what is keeping me from doing that.

[phillip_mills]

Hi @James . Yep - unfortunately they had to pull the update as it broke the feature you mentioned. I'm waiting to see what happens too. It was turned on briefly on production. If you want to see how it works you can always look at the demo site.