Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to display mathematical typesetting (MathJax, LaTeX, etc.) in Qt using PyQt5?

I am fairly new to Qt and PyQt5 and would like to display mathematical typesetting in a GUI window. Specifically, I would like it to be able to update dynamically. I can't seem to find any helpful information on how to do this with PyQt5.

I've thoroughly researched how to do this

One seemingly relevant answer is found here, but no solution is given and it doesn't actually address the issue of showing the typeset math in a GUI.

Another seemingly relevant answer is found here, but uses PySide (and python 2.7) and gives an absurdly and unecessarily complicated and outdated answer.

like image 789
clockelliptic Avatar asked Jun 25 '19 19:06

clockelliptic


1 Answers

I figured out how to do this in a manner that is quite easy and simple. The example given below requires internet connectivity to access the MathJax JS module.

  1. First, import QApplication and QWebEngineView.

    import sys
    from PyQt5.QtWidgets import QApplication
    from PyQt5.QtWebEngineWidgets import QWebEngineView
    
  2. Then, write a multi-line string containing HTML code. The code should import the MathJax javascript module. Then, write your mathematical equation...

    pageSource = """
                 <html><head>
                 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML">                     
                 </script></head>
                 <body>
                 <p><mathjax style="font-size:2.3em">$$u = \int_{-\infty}^{\infty}(awesome)\cdot du$$</mathjax></p>
                 </body></html>
                 """
    
  3. Finally, instantiate a QApplication, instantiate a QWebEngineView, and set the WebEngineView to show your newly written HTML code:

    app = QApplication(sys.argv)
    webView = QWebEngineView()
    webView.setHtml(pageSource)
    
  4. Don't forget to call show on your WebEngineView.

    webView.show()
    sys.exit(app.exec_())
    

If you want to create an app that does not require internet connectivity to run the MathJax JS file, simply copy the JS module and save it as a string in your code.

like image 68
clockelliptic Avatar answered Oct 21 '22 15:10

clockelliptic