Gauge background not updating correctly if 0 on first paint

[MarkEdmondson1234]

Hello, I'm trying to use a flexdashboard::gauge in a Shiny HTML template, but it renders a little differently, am I missing some library or extra file perhaps?

In the RStudio viewer it looks like this:

..but in the template it looks like this:

The difference seems to be the grey background rendering, the HTML for those bits out of the HTML source are:

RStudio Viewer:

<path fill="#edebeb" stroke="none" d="M53.125,96.5625L25,96.5625A75,75,0,0,1,175,96.5625L146.875,96.5625A46.875,46.875,0,0,0,53.125,96.5625Z" filter="url(#inner-shadow-htmlwidget-4600)" style=""></path>

HTML Template (Firefox):

<path filter="url(#inner-shadow-gauge1)" d="M53.125,96.5625L25,96.5625A46.875,46.875,0,0,0,53.125,96.5625Z" stroke="none" fill="#edebeb" style=""></path>

The HTML template has a lot shorter d element.

[MarkEdmondson1234]

Ok I've narrowed it down to it being because the first render of the gauge has no data, so it is technically correct to be 0, but the background grey bar does not update when you change to a different data source.

My example app you switch between accounts to download data, and it so happens the default initial account I was testing with has no data. Switching to a login which has some data in the initial load, subsequent displays are ok.

[jjallaire]

This might be a bug in JustGage but we could probably work around it. Could you provide a minimum reproducible example so we can investigate further?

[sdhaus]

I am having a similar problem, where once I authenticate the GA API, all color is removed from my gauges.

Below is a minimum reproducible example:

library(shiny)
library(shinydashboard)
library(googleAnalyticsR)
library(googleAuthR)
library(flexdashboard)

ui <- shinyUI(dashboardPage(

  dashboardHeader(title = "Test"),
  dashboardSidebar(
    sidebarMenu(
      menuItem("Test", tabName = "Test", icon = icon("dashboard"))
    )
  ),
  dashboardBody(
    tabItems(
      tabItem(tabName = "Test",
              fluidRow(

                titlePanel("Test"),
                sidebarPanel(
                  helpText("Start by logging in to your Google Analytics account."),
                  googleAuthUI("login"),
                  br()
                ),
                mainPanel(
                  column( width = 4,
                          flexdashboard::gaugeOutput("outputBox1")
                  ),column( width = 4,
                            flexdashboard::gaugeOutput("outputBox2")
                  ),column( width = 4,
                            flexdashboard::gaugeOutput("outputBox3")
                  )
                )
              ))
      ))))

server <- shinyServer(function(input, output, session) {

  token <- callModule(googleAuth, "login")

  output$outputBox1 <- renderGauge({ 
    flexdashboard::gauge(15.8513963, min = 0, max = 100, symbol = '%', gaugeSectors(
      success = c(71, 100), warning = c(39, 50), danger = c(0, 39)
    ))
  })
  output$outputBox2 <- renderGauge({ 
    flexdashboard::gauge(80.1935234, min = 0, max = 100, symbol = '%', gaugeSectors(
      success = c(71, 100), warning = c(39, 50), danger = c(0, 39)
    ))
  }) 
  output$outputBox3 <- renderGauge({ 
    flexdashboard::gauge(5.869565, min = 0, max = 100, symbol = '%', gaugeSectors(
      success = c(71, 100), warning = c(39, 50), danger = c(0, 39)
    ))

  }) 
})

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

[cpsievert]

We just updated JustGage. Please try using the development to see if that fixes it (and if not, please file a new issue with a reproducible example)

remotes::install_github("rstudio/flexdashboard")