Jump to content

Help with Javascript code for displaying equations


Recommended Posts

I know nothing about JavaScript except how to use it in my html and a little bit about changing the variables. I have some Javascript on my math webpage that converts LaTex code to an image tag, which is sent to codecogs and it renders the image of the equations and is downloaded, allowing anyone to see equations without any plugin.

There are two things i wanted modified in this script (it's a freeware under GNU license). first, the latex code allows 3 colors. i wanted an easy way to specify colors in the <span> tag.

for example, to make this equation red: <span>$\frac{a}{b}$</span>, i would have to write <span>${\color{red}\frac{a}{b}}$. Instead, I would like <span class="red">$\frac{a}{b}$</span> (or id="red" or whatever works), so that I can use CSS.

And two, the renderer allows higher dpi for images rendered. See the codebox below where it says 100dpi. I can specify 120, 150 dpi for better quality images. Specifying higher dpi obviously gives higher quality image and a bigger image. I want to be able to specify higher quality and adjust the size of the image. Is there a way I can do that with variables and again in the <span> tag? Like for example: <span class="red" id="150dpi" height="50px">$\frac{a}{b}$</span>?

Thanks in advance.

function renderlatex() {
var eqn = window.document.getElementsByTagName("span");
for (var i=0; i<eqn.length; i++) {
html=eqn[i].innerHTML;
html=html.replace(/(^\$|[^\\]\$)(.*?[^\\])\$/g," <img align=\"absmiddle\" src=\"http://latex.codecogs.com/png.latex?\\100dpi $2\" alt=\"$2\" title=\"$2\" border=\"0\" class=\"latex\" /> ");
// html=html.replace(/(^\\|[^\\]\\)\[(.*?[^\\])\\\]/g," <div class=\"latex\"><img src=\"http://latex.codecogs.com/png.latex?$2\" alt=\"$2\" title=\"$2\" border=\"0\" /></div> ");
html=html.replace(/(^\\|[^\\]\\)\[(.*?[^\\])\\\]/g," <br/><img src=\"http://latex.codecogs.com/png.latex?\\100dpi $2\" alt=\"$2\" title=\"$2\" border=\"0\" /><br/> ");
html=html.replace(/\\\$/g,"\$");
html=html.replace(/\\\\(\[|\])/g,"$1");
eqn[i].innerHTML = html;
}
}

renderlatex();

Link to comment
Share on other sites


Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...