siv rj
siv rj

Reputation: 1511

how to display mathematical symbols in my html page

Hi i am using Rails, Ckeditor. In ckeditor mathematical symbols like summation, pi, are displaying properly. I am saving them to database. While displaying them, proper format is not displaying.

I need some solution. Thank you.

In editor it viewed like this:

x=−b±√2a  ​ 

But i got this format when it saved.

\(x = {-b \pm \sqrt{2a}\)

I need to display in below format in html page.

 x=−b±√2a  ​ 

Solution is:

<head>
 <script type="text/x-mathjax-config">
   MathJax.Hub.Config({tex2jax: {inlineMath: [['\\(','\\)']]}});
 </script>
 <script type="text/javascript"
   src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
 </script>
 </head>

 <body>
    \(x = -b \pm \sqrt{2a}\)
 </body>

Upvotes: 0

Views: 2656

Answers (2)

hjing
hjing

Reputation: 4982

It look like Ckeditor is saving mathematical symbols in LaTeX. You can use mathjax-rails to render LaTeX for the web.

A barebones usage of Mathjax would be this:

<!DOCTYPE html>
<html>
  <head>
    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({tex2jax: {inlineMath: [['\\(','\\)']]}});
    </script>
    <script type="text/javascript"
      src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
    </script>
  </head>
  <body>
    \(x = -b \pm \sqrt{2a}\)
  </body>
</html>

See this plnkr to view the output.

Upvotes: 1

Vedant Terkar
Vedant Terkar

Reputation: 4682

Just Use:

document.write("x=-b&plusmn;&radic;2a");

or

div.innerHTML="x=-b&plusmn;&radic;2a";

Working:

Fiddle

&plusmn; is unicode symbol for:± and &radic; is for .

Hope it'll help you.

References:

http://www.javascripter.net/faq/mathsymbols.htm

Upvotes: 0

Related Questions