Equation wrapping with Shiny Dashboard

Question

I just posted a question regarding equation wrapping with shinydashboard here. The answer presented worked, but my actual example is more complicated and includes tabItems. Unfortunately, including the MathJax config at the beginning of the dashboardBody does not wrap the equation when the box is in a tabItem. MWE:

library(shinydashboard)
library(shiny)

# UI
ui <- dashboardPage(

    dashboardHeader(),

    dashboardSidebar(
        menuItem( "TEST", tabName = "test", selected = T)
    ),

    dashboardBody(
        tags$head(tags$script(type = "text/x-mathjax-config", 'MathJax.Hub.Config({
                              "HTML-CSS": { linebreaks: { automatic: true } },
                                     SVG: { linebreaks: { automatic: true } }
                              });')),

        tabItems(


            tabItem(tabName = "test",



                    fluidRow(


                        column(width = 6,
                               box("Long Equation", width = 12,

                                   h3(withMathJax("$$ \\alpha  + \\beta + \\gamma + \\delta + \\alpha  + \\beta + \\gamma + \\delta + \\alpha  + \\beta + \\gamma + \\delta + $$")))

                        )  
                    )


                    )
        )


    )
)

# Server
server <- function(input, output) {

}

# Run the application 
shinyApp(ui = ui, server = server)

The preceding code yields:

I have tried placing the MathJax config at the beginning of tabItems and tabItem to no avail. Can anyone explain where to place the MathJax config? A brief explanation of MathJax config more generally would be quite helpful.

fra fra · Accepted Answer · 2019-08-23T09:15:26

You set the width of the column to 6 (width=6), but for the box you have a width of 12 (width=12). If you fix that it works

In addition, if you need to keep the column of that width, you can set style = 'overflow-x: scroll to add a scrolling bar.

Equation wrapping with Shiny Dashboard

1 Answers