# Write in-line equations in your Shiny application with MathJax

December 30, 2015
By

Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.

I’ve been working on a Shiny app and wanted to display some math equations. It’s possible to use LaTeX to show math using MathJax, as shown in this example from the makers of Shiny. However, by default, MathJax does not allow in-line equations, because the dollar sign is used so frequently. But I needed to use in-line math in my application. Fortunately, the folks who make MathJax show how to enable the in-line equation mode, and the Shiny documentation shows how to write raw HTML. Here’s how to do it.

R

Here I replicated the code from the official Shiny example linked above. The magic code is inserted into ui.R, just below withMathJax().
## ui.R

library(shiny)shinyUI(fluidPage(  title = 'MathJax Examples with in-line equations',  withMathJax(),  # section below allows in-line LaTeX via $in mathjax. tags$div(HTML("<br />                MathJax.Hub.Config({<br />                tex2jax: {inlineMath: [['$','$'], ['$$','$$']]}<br />                });<br />                                ")),  helpText('An irrational number $\sqrt{2}$           and a fraction $1-\frac{1}{2}$'),  helpText('and a fact about $\pi$:$\frac2\pi = \frac{\sqrt2}2 \cdot \frac{\sqrt{2+\sqrt2}}2 \cdot \frac{\sqrt{2+\sqrt{2+\sqrt2}}}2 \cdots$'),  uiOutput('ex1'),  uiOutput('ex2'),  uiOutput('ex3'),  uiOutput('ex4'),  checkboxInput('ex5_visible', 'Show Example 5', FALSE),  uiOutput('ex5')))## server.Rlibrary(shiny)shinyServer(function(input, output, session) {  output$ex1 <- renderUI({ withMathJax(helpText('Dynamic output 1:$\alpha^2$')) }) output$ex2 <- renderUI({    withMathJax(      helpText('and output 2 $3^2+4^2=5^2$'),      helpText('and output 3 $\sin^2(\theta)+\cos^2(\theta)=1$')    )  })  output$ex3 <- renderUI({ withMathJax( helpText('The busy Cauchy distribution$\frac{1}{\pi\gamma\,\left[1 +               \left(\frac{x-x_0}{\gamma}\right)^2\right]}\!$')) }) output$ex4 <- renderUI({    invalidateLater(5000, session)    x <- round(rcauchy(1), 3)    withMathJax(sprintf("If $X$ is a Cauchy random variable, then                        $P(X \leq %.03f ) = %.03f$", x, pcauchy(x)))  })  output$ex5 <- renderUI({ if (!input$ex5_visible) return()    withMathJax(      helpText('You do not see me initially: $e^{i \pi} + 1 = 0$')    )  })  })

Give it a try (or check out the Shiny app at https://r.amherst.edu/apps/nhorton/mathjax/)! One caveat is that the other means of in-line display, as shown in the official example, doesn’t work when the MathJax HTML is inserted as above.

R-bloggers.com offers daily e-mail updates about R news and tutorials about learning R and many other topics. Click here if you're looking to post or find an R/data-science job.
Want to share your content on R-bloggers? click here if you have a blog, or here if you don't.