CODEWITHSUNDEEP
shinyshinydashboard
M.Qasim
M.Qasim

Reputation: 1878

How to add tooltips to html widgets in shiny dashboard

I am struggling to add tooltips to html widgets in Rshiny. bs_embed_tooltip from library(flexdashboard) does the job for some shiny widgets but returns the following error when it is applied to an html widget:

Error in .tag_validate(.) : 
  tag is not a shiny.tag - tag must be generated using htmltools or shiny

Here is my minimal working example (modifying example code from shinydashboard):

## app.R ##
library(shinydashboard)
library(flexdashboard)
library(bsplus) # For shiny tooltips

ui <- dashboardPage(
  dashboardHeader(title = "Basic dashboard"),
  dashboardSidebar(),
  dashboardBody(
    # Boxes need to be put in a row (or column)
    fluidRow(
      box(plotOutput("plot1", height = 250) %>%
            bs_embed_tooltip("This is the output chart.", placement = 'bottom')
      ),

      box(title = "Controls",
          sliderInput("slider", "Number of observations:", 1, 100, 50) %>%
            bs_embed_tooltip("Use this slider to select the number of observations.", placement = 'bottom')
      ),
      box(title = "Guage",
          gaugeOutput("guage_value") # %>% bs_embed_tooltip("This gauge shows the input value from the slider.", placement = 'bottom')
      )
    )
  )
)

server <- function(input, output) {
  set.seed(122)
  histdata <- rnorm(500)

  output$plot1 <- renderPlot({
    data <- histdata[seq_len(input$slider)]
    hist(data)
  })

  output$guage_value <- renderGauge({

    gauge(input$slider, min = 0, max = 100, symbol = '', gaugeSectors(
      danger = c(0, 30), warning = c(31, 70), success = c(71, 100) ))

  })
}

shinyApp(ui, server)

Your help to get around the code in the comment would be much appreciated.

Upvotes: 1

Views: 1198

Answers (1)

SeGa
SeGa

Reputation: 9809

Try with this new box for the gauge-box:

  box(title = "Guage",
      gaugeOutput("guage_value"),
      bsTooltip(id = "guage_value", title = "This gauge shows the input value from the slider.", placement = "bottom")
  )

Upvotes: 1

Related Questions