Search code examples
rshiny-servershinydashboard

Shiny server redraw google chart on browser resize


I have a Shiny server using Shiny Dashboard. I have a Google chart (AnnotationChart) that doesn't resize automatically on browser window resize. I can listen for the resize event and react to it (in javascript), but I don't know how to get the chart object to redraw using the data and options that belong to it - I just want it to redraw at 90% of the width/height of its container.

I feel this should be simpler than I'm finding it. If I resize the browser window then change a reactive element (like alter an input control), Shiny will redraw the chart, as well as everything that should be redrawn, at the new correct width (i.e. resize it to 90% of its container). It feels like if I could fire that redraw event (what ever it is) from javascript, or simulate a change to an input element, that might get me somewhere.

Essentially, the question can be boiled down to:

In Shiny, how can I force a redraw of charts that don't automatically resize on a browser resize?

Cheers,

Andy.


Solution

  • I've had and solved this problem using the googleVis R package, I'm guessing you can use the same method as me although I'm not sure exactly how everything you have fits together since you're more on the JavaScript side.

    In any R function you can establish a dependency on the state of the graphs in the browser window using the session$clientData variable. So in my case I'm using renderGvis and so I simply call session$clientData$output_trend_width (which is a different graph, but obviously they all change at the same time) within the function, so whenever it changes, the plot is redrawn at the right size. In my case, I'm only bothered about width, but you could obviously call height too if that's important in your case.

    output$gauge <- renderGvis({
    
    # dependence on size of plots to detect a resize
    
    session$clientData$output_trend_width
    
    df <- data.frame(Label = "Bounce %", Value = 25)
    
    gvisGauge(df,
              options = list(min = 0, max = 100, greenFrom = 0,
                             greenTo = 50, yellowFrom = 50, yellowTo = 70,
                             redFrom = 70, redTo = 100))
    
    })
    

    Hope that helps?