2

I found this interesting site, that helps me understand derivatives, http://www.numberempire.com/derivatives.php , It seems it is written in php, and I am wondering , how is it possible to print mathematic characters on a web page?

Cœur
  • 37,241
  • 25
  • 195
  • 267
themhz
  • 8,335
  • 21
  • 84
  • 109

3 Answers3

4

You can use MathJAX. It requires JavaScript though.

There's some good examples here.

Basically you put LaTeX code in your page. Here's the integral from 0 to infinity of e^-x dx:

\[
 \int_0^\infty e^{-x}\,\mathrm{d}x
\]

And you get nice output. Click that link to see what this looks like rendered (and View Source to see how they did it).

Brendan Long
  • 53,280
  • 21
  • 146
  • 188
  • so I need to map each character of my keyboard to Images like a division / to an image that looks like a division and so on.. thank you very much – themhz Mar 23 '12 at 17:05
  • @themhz - No, that's not what you have to do at all. You just write LaTeX code (`\int` for integral for example), then include MathJAX on your page. – Brendan Long Mar 23 '12 at 17:07
  • I see, so after i put that code in my page a javascript library like latex will render it to images for me? – themhz Mar 23 '12 at 17:09
  • 1
    @themhz - It won't render images, it will generate the correct HTML/CSS to display what you wrote. The big difference between this and images is that you'll get normal browser text features: copy/paste, anti-aliasing, ability to control font, relative size and color with CSS, clean edges against any background.. – Brendan Long Mar 23 '12 at 17:12
  • so It actually creates an image on the page dynamically? is that what it basically does? Because an image really exists there if I can't right click on the page but I can save all the page. When i do this i can check that this is an image. – themhz Mar 23 '12 at 17:28
  • @themhz - MathJAX renders your math dynamically *as text* (with styling via HTML and CSS), not an image. If you save the page (at least in Firefox), it will save the page as you see it (including the generated HTML and CSS). – Brendan Long Mar 23 '12 at 17:52
3

They have a cgi script that outputs an image based on the query string requested. Here are some example requests:

http://www.numberempire.com/cgi-bin/render2.cgi?x
http://www.numberempire.com/cgi-bin/render2.cgi?y
http://www.numberempire.com/cgi-bin/render2.cgi?x^2y/2

http://www.numberempire.com/cgi-bin/render2.cgi?\nocache \LARGE \frac{\partial^2 f}{\partial x^2} %3D {{\left(b^2\%2Cx^2-2\%2Cb\%2Cx%2B2\right)\%2Ce^{b\%2Cx}}\over{3\%2Cx^3}}

And here is a free Python script which converts LaTeX to GIFS, which would allow you to do the same thing: http://www.wag.caltech.edu/home/rpm/projects/tex2gif/

Paul
  • 139,544
  • 27
  • 275
  • 264
2

The Math StackExchange site uses MathJax

Your need to add this to your page to include the necessary javascript.

<script type="text/javascript"
  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>

You can use math symbols on your page by using letex. Here is a simple sample page from their docs.

<!DOCTYPE html>
<html>
<head>
<title>MathJax AsciiMath Test Page</title>
<script type="text/javascript"
  src="../MathJax.js?config=AM_HTMLorMML-full"></script>
</head>
<body>

<p>When `a != 0`, there are two solutions to `ax^2 + bx + c = 0` and
they are</p>
<p style="text-align:center">
  `x = (-b +- sqrt(b^2-4ac))/(2a) .`
</p>

</body>
</html>

More details on the getting started page.

Chad DeShon
  • 4,732
  • 6
  • 28
  • 29
  • Note from the future: cdn.mathjax.org is nearing its end-of-life, check https://www.mathjax.org/cdn-shutting-down for migration tips (and perhaps update your post for future readers). – Peter Krautzberger Apr 21 '17 at 07:47