Search code examples
rhighchartsshinyrcharts

Shiny: Increase highchart size on button click


I want to increase the size of highchart on clicking the zoom button. I tried using the code below to increase the size but so far I have not been able to achieve what I want to do. I actually wanted the highchart to expand and occupy the full page on clicking the zoom button. I have written the following code so far but it does not seem to work. Can anyone tell me what I am doing wrong?

require(shiny)
require(rCharts)

ui <- fluidPage(


  tags$script('Shiny.addCustomMessageHandler("ZoomPlot", function(variableName){
              document.getElementById(variableName).style.height = "1000px";
              });
              '),

  headerPanel("Test app"),
  actionButton("test", "Zoom"),

  div(class = "chart-container",  showOutput("viz", "highcharts"))
)



server <- shinyServer(function(input, output, session) {
  output$viz <- renderChart2({
    a <- highchartPlot(Sepal.Length ~ Sepal.Width, data=iris)
    a
  })

  observeEvent(input$test,{
    session$sendCustomMessage(type = 'ZoomPlot', message = "viz")
  })
})

shinyApp(ui, server)

Solution

  • You can do it using only server side like

    server <- shinyServer(function(input, output, session) {
      hh=reactive({
        if(input$test>0 ) {1000}else{400}
       })
      output$viz <- renderChart2({
        a <- highchartPlot(Sepal.Length ~ Sepal.Width, data=iris)
        a$set(height = hh()
              )
        a
      })
    
    })