Coding new integral sign in mathjax for html file

In summary, the infinity sign can be implemented in HTML using Latex, but it requires the graphicx library and rotatebox function.
  • #1
aheight
321
109
I am creating a website and wish to include a new integral sign that has an infinity sign over it but aligned with the same tilt angle as the integral. I'm using Mathjax to render the math code. I can code this in Latex outside an HTML file and it works perfectly but does require the graphicx library and rotatebox function:

Is there a way I can implement this in my HTML file?+
Code:
latex
\def\Xint#1{\mathchoice%
{\XXint\displaystyle\textstyle{#1}}% 
{\XXint\textstyle\scriptstyle{#1}}% 
{\XXint\scriptstyle\scriptscriptstyle{#1}}% 
{\XXint\scriptscriptstyle\scriptscriptstyle{#1}}% 
\!\int}%
\def\XXint#1#2#3{{\setbox0=\hbox{$#1{#2#3}{\int}$}
\vcenter{\hbox{$#2#3$}}\kern-.5\wd0}}
\newcommand{\Rinfty}{\rotatebox{77}{$\infty$}\hspace{-0.05em}}

I then just write \mathop{\Xint{\Rinfty}}
 
Technology news on Phys.org
  • #2
Will this work?

##\int_0^{\infty}##
The above renders here at PF (also using MathJax) as ##\int_0^{\infty}##
 
  • #3
I want the infinity sign to look like part of the integral sign. I can code it up in TexnicCenter and save it as a PDF file or bmp file and post it here to show what i want if you could explain to me how to save it here.
 
  • #4
You can upload an image by using the UPLOAD button that appears at the lower right corner of the text entry pane. You can specify that the image should be a thumbnail (small image) or a full-size image inline with whatever text you write.
 
  • #5
Ok. Here's a pdf file that was generated with the latex code above. Note also if I try and back-space an "8" into the integral using latex commands, the 8 won't be tilted at the same angle as the slant of the integral sign and will look funny.
 

Attachments

  • mynewintegralsign.pdf
    42.9 KB · Views: 240
Last edited:
  • #6
Got it close enough for now Mark and it works with mathjax (the 8 in the mathit font is slightly tilted):

$$
\newcommand{\bint}{\large\mathit{8}\hspace{-10.5pt}\int}
$$

$$\bint f(z) dz
$$
 

FAQ: Coding new integral sign in mathjax for html file

What is MathJax and why is it important for coding new integral sign in HTML?

MathJax is an open-source JavaScript library that allows for the display of mathematical equations and symbols on web pages. It is important for coding new integral signs in HTML because it provides a simple and consistent way to display mathematical notations across different web browsers.

How do I add the MathJax library to my HTML file?

To add the MathJax library to your HTML file, you can use the following code:
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-MML-AM_CHTML"></script>
This will load the MathJax library from a content delivery network (CDN) and configure it to display TeX, MathML, and AsciiMath notation.

How do I code a new integral sign using MathJax in HTML?

To code a new integral sign using MathJax in HTML, you can use the following code:
<script type="text/javascript">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX","output/HTML-CSS"],
tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]},
});
</script>
This will allow you to use TeX notation to display an integral sign, such as "\int".

Are there any other ways to display the integral sign in HTML besides using MathJax?

Yes, there are other ways to display the integral sign in HTML. Some options include using Unicode characters, such as "∫" for the integral symbol, or using CSS to create a custom image of the integral sign. However, using MathJax is the most recommended method as it ensures a consistent display across different web browsers.

Can I customize the appearance of the integral sign when using MathJax in HTML?

Yes, you can customize the appearance of the integral sign when using MathJax in HTML. MathJax allows for the use of different fonts, sizes, and styles for displaying mathematical notation. You can also use CSS to further customize the appearance of the integral sign. Additionally, MathJax has a large collection of extensions that allow for more advanced customization options.

Back
Top