A hack for showing LaTeX formulas in GitHub markdown.md

Problem

A lot of GitHub projects need to have pretty math formulas in READMEs, wikis or other markdown pages. The desired approach would be to just write inline LaTeX-style formulas like this:

$e^{i \pi} = -1$

Unfortunately, GitHub does not support inline formulas. The issue is tracked here.

Investigation

However, it does support them in Jupyter notebooks, scroll below to see an example. One might question how does it work in notebooks. It turns out that instead of relying on MathJax as nbviewer does, GitHub's notebooks renderer converts inline math to images with source URLs that look like this:

https://render.githubusercontent.com/render/math?math=e%5E%7Bi%20%5Cpi%7D%20%3D%20-1&mode=inline

Inspecting the URL, it is possible to notice that:

1. The &mode=inline part is not required, the URL still returns the same image without it:

   https://render.githubusercontent.com/render/math?math=e%5E%7Bi%20%5Cpi%7D%20%3D%20-1.

2. Modern browsers encode URLs automatically, thus this link would work as well:

   https://render.githubusercontent.com/render/math?math=e^{i \pi} = -1.

Solution

So the solution would be to insert this code in Markdown files:

<img src="https://render.githubusercontent.com/render/math?math=e^{i \pi} = -1">

and such an image would be rendered as .

This is more clumsy than just $e^{i \pi} = -1$, but it is still possible to write the formula by hand directly to the Markdown file this way.

Note that this syntax for image insertion would not work because the URL contains spaces:

![formula](https://render.githubusercontent.com/render/math?math=e^{i \pi} = -1)

Addition from 2019-10-30

I made a small app that allows to generate Markdown code from LaTeX using the method described above automatically.

jk13o3lll: This link is currently not available. I have add some scripts in the comment.

New example

jk13o3lll: Size is also adjustable.

\Huge e^{i \pi} = -1

becomes

<img src="https://render.githubusercontent.com/render/math?math=%5CHuge%20e%5E%7Bi%20%5Cpi%7D%20%3D%20-1">

Result

notebook.ipynb

To convert latex equation to corresponding URL, you can use following script.
The easiest way is to run this script in JSFiddle
Here is an available link: https://jsfiddle.net/509jbk6f/

html

<label for="input">Latex equation: </label>
<input type="textbox" name="input">
<br><br>

<button onClick="toGithubRenderURL()">Encode to github render URL</button>
<br><br>

<label for="output">The URL is: </label>
<input type="textbox" name="output">

css

input {
    width: 95%;
}

javascript

function toGithubRenderURL() {
    var input = document.getElementsByName('input')[0].value;
    var output = '<img src="https://render.githubusercontent.com/render/math?math=' + encodeURIComponent(input) + '">';
    document.getElementsByName('output')[0].value= output;
}

You also can use this embedded script to run this function.

<script async src="//jsfiddle.net/509jbk6f/embed/result/"></script>

or this

<iframe width="100%" height="300" src="//jsfiddle.net/509jbk6f/embedded/result/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>