News from GitHub's changelog (May 19, 2022):

You can now use LaTeX style syntax to render math expressions within Markdown inline (using $ delimiters) or in blocks (using $$ delimiters).

You can read the official changelog post here and read the tutorial here.

latex-to-github-app

This is a small app for converting LaTeX code to a format readable by GitHub's Markdown using source URLs. It is written in Python 3.

It was inspired by the solutions provided by Alexander Rodin (username: a-rodin) at:

https://gist.github.com/a-rodin/fef3f543412d6e1ec5b6cf55bf197d7b

Please, remember to read the Notes.

Required packages
The GUI
GUI explanation
Example
Minimalistic Jupyter notebook
Notes
To do

Required packages

The required Python packages are:

tkinter
urllib
PIL (to import Image and ImageTk)
io (to import BytesIO)
cairosvg

The GUI

The GUI looks like this:


Windows 10	Ubuntu 20.04 LTS

GUI explanation

■ You can write your LaTeX formula in the frame under the label "Write yout LaTeX code:". Pressing the "Convert LaTeX code" left button under the LaTeX input frame a HTML code is generated. This code can be pasted into a GitHub README.md file so the desired formula can be generated. It is asumed that the input is already in math mode. You can also start writing in the LaTeX frame as soon as the app is opened.

■ The frame under the "The HTML result is:" label is where the resulting HTML code will be shown. The code will have the following form:

<img src="https://render.githubusercontent.com/render/math?math=--Formatted formula here--">

■ The frame under the "The GitHub URL result is:" label will show the URL for GitHub to render the math formula. You can paste this URL in the adress bar of your web browser to view the resulting formula. This URL is already inside the HTML code and has the following aspect:

https://render.githubusercontent.com/render/math?math=--Formatted formula here--

■ In this app you can also view the result from the URL if internet connection is available. Keeping the "View image" checkbutton below the input frame checked, the formula can ve viewed on the "Image:" canvas on the lower right.

■ After having obtained results like in the animation above, if you want to write a different LaTeX code you can just delete the old LaTeX code and write again. Don't worry about the output, it will be overwritten.

Example

In the following image you can see an example of input and output:

Then, you can copy and paste the resulting HTML code, for example, in your README.md file like the following if you want to obtain a centered equation:

<p align="center">
<img src="https://render.githubusercontent.com/render/math?math=%5Cmathbf%7BR_z%7D(%5Ctheta)%0A%3D%0A%5Cbegin%7Bpmatrix%7D%0A%5Ccos%5Ctheta%20%26%20-%5Csin%5Ctheta%20%26%200%20%5C%5C%5B2ex%5D%0A%5Csin%5Ctheta%20%26%20%20%5Ccos%5Ctheta%20%26%200%20%5C%5C%5B2ex%5D%0A0%20%20%20%20%20%20%20%20%20%20%26%20%200%20%20%20%20%20%20%20%20%20%20%26%201%0A%5Cend%7Bpmatrix%7D%0A">
</p>

The result of the previous HTML code will be:

$\mathbf{R_z}(\theta) = \begin{pmatrix} \cos\theta & -\sin\theta & 0 \\[2ex] \sin\theta & \cos\theta & 0 \\[2ex] 0 & 0 & 1 \end{pmatrix}$

Minimalistic Jupyter notebook

In this repository there is also included a minimalistic Jupyter notebook with the essential functionality of the code: translating from LaTeX to HTML readable by the GitHub math renderer. This notebook only requires the urllib package. The code is the following:

import urllib

# Write your LaTeX code here.
string = \
r"""
\begin{cases}
a & = b \\[3ex]
a & = b
\end{cases}
"""[1:-1] # Delete initial and final \n line jumps.

encoded_string = urllib.parse.quote(str(string).encode("utf-8"), safe="~()*!.\"")
github_url = "https://render.githubusercontent.com/render/math?math=" + encoded_string
html_result = '<img src="' + github_url + '">'

print("GitHub URL:\n\n", github_url, "\n\nHTML result:\n\n", html_result)

You can try Jupyter in your browser without installing anything at https://jupyter.org/try. There, you can create a new notebook and run the code snippet above.

Notes

This small app was developed in Windows 10 using the Spyder IDE. It has also been tested on Ubuntu 20.04 LTS.

At the current state of development you will need to install the needed packages and run the latex-to-github-app.py script if you want to use the app.

To do:

Make a reset button.
Make a mouse right click menu for copying and pasting.
Test in Ubuntu.
Make an executable file app.

artmenlope / latex-to-github-app