Adding a tooltip to a gauge in flexdashboard

Hey everyone! :wave:

This is my first question in this community, so please forgive me if it isn't asked in the correct way. I would love to learn how to add a tooltip to a gauge in a shiny dashboard I'm building.

For context, I'm working on a diversity dashboard for my team, and we have a couple gauges that show the proportion of the team that is LGBTQIA and neurodivergent.

I'd love to add a tooltip to be able to provide more information about what each term means. Here is the code for the gauges.

Thanks so much! I'm a big fan of this community - keep doing what you're doing! :hugs:

Row
-----------------------------------------------------------------------

### LGBTQIA

```{r}
selected_data <- reactive({
  
  if (input$role_type == "All Roles") {
    
    df
    
  } else {
    
    filter(df, role_type == input$role_type)
    
  }
})

renderGauge({
  
  # calculate percent LGBTQIA
  rate <- sum(selected_data()$lgbtqia == "Yes") / nrow(selected_data())
  rate <- coalesce(round(rate * 100, 1), 0)
  
  # build gauge
  gauge(rate, min = 0, max = 100, symbol = '%', gaugeSectors(success = c(0, 100)),
        href = 'https://lgbtqia.ucdavis.edu/educated/glossary.html')
})
```

### Neurodivergent

```{r}
selected_data <- reactive({
  
  if (input$role_type == "All Roles") {
    
    df
    
  } else {
    
    filter(df, role_type == input$role_type)
    
  }
})

renderGauge({
  
  # calculate percent LGBTQIA
  rate <- sum(selected_data()$neurodivergent == "Yes") / nrow(selected_data())
  rate <- coalesce(round(rate * 100, 1), 0)
  
  # build gauge
  gauge(rate, min = 0, max = 100, symbol = '%', gaugeSectors(success = c(0, 100)))  
})
```
1 Like

But you might consider something like modalDialog

The simplest way to add a tooltip is to surround your gauge with a div tag to add a title. You might also use the shinyBS (Bootstrap Components for Shiny)

Both are discussed on stackoverflow.


Also, the RLumShiny package has been maintained more recently than shinyBS and includes access to bootstraps tooltip and popover functionality.

3 Likes

I'd also recommend exploring the bsplus package maintained by @ijlyttle which has helped my applications immensely with tooltips, collapsible elements, and popovers.

https://ijlyttle.github.io/bsplus/articles/overview.html

4 Likes

This is great, thanks so much @EconomiCurtis!

This looks super useful. Thanks @rpodcast!