9

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.

clockelliptic
  • 455
  • 4
  • 14
  • [displaying-latex-in-pyqt-pyside-qtablewidget](https://stackoverflow.com/questions/32035251/displaying-latex-in-pyqt-pyside-qtablewidget) – Patrick Artner Jun 25 '19 at 19:47
  • @PatrickArtner, I don't see how either of those address the question I am asking. The first post doesn't have an accepted answer and doesn't give a relevant solution. The second answer is for a different version of Python, an outdated version of QT, and gives an absurdly and unnecessarily complicated solution. – clockelliptic Jun 25 '19 at 19:59
  • Yeah. But beside _saying_ "I've thoroughly researched how to do this" you did not show any of your search results. So I thought I spend 1 minute of googling and give you some tips to look at. The first question has no _accepted_ answer - but an answer you can follow up upon. The 2.7 solution could be adapted to use 3.x as well... – Patrick Artner Jun 25 '19 at 20:02

1 Answers1

11

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.

clockelliptic
  • 455
  • 4
  • 14