Manipulating height attribute of renderPlotly object?

Question

I want to include multiple plots of varying heights within a single shiny dashboard tab.

Many existing answers cover setting the height parameter in ggplotly. Using this parameter does change how a figure will render. But, it doesn't fix my problem. Objects around it render as if the adjusted figure still has its original height. For example, if the first figure is lengthened, the second figure will appear over top of it. Or, if the first figure is shortened, there will be a large empty space before the next figure.

Alexander Leow provides one solution to my problem in his buried answer to the following question: Shiny plotlyOutput() not responding to height and width sizes

Unfortunately, his answer seems unnecessarily complicated by the multiple plot list structure.

I tried to adapt his solution for a single plot but I was unsuccessful. The following code produces an error when running in an app: "object type closure is not subsettable"

library(plotly)
library(shiny)
library(shinydashboard)

ui <- dashboardPage(dashboardHeader(title = "Test"),
                    dashboardSidebar( 
                      menuItem("Test", tabName = "test")
                      ),
                    dashboardBody(
                      tabItems(
                        tabItem(tabName = "test",
                                fluidRow(
                                  column(12, uiOutput('plot'))
                                  )
                                )
                        )
                      )
                    )



server <-  function(input, output) {
  output$plot <- renderUI({
    plot_output_object <- renderPlotly({
      p <- ggplot() +
        geom_point(aes(x=1,y=2))
      ggplotly(p)
    })
    attr(plot_output_object,'outputArgs') <- list(height="200px")
    return(plot_output_object)
  })
}


shinyApp(ui = ui, server = server)

The following example demonstrates how the ggplotly height parameter does not solve my issue. There is a large gap between the first and second plots.


library(shiny)
library(shinydashboard)
library(plotly)

ui <- dashboardPage(dashboardHeader(title = "Test"),
                    dashboardSidebar( 
                      menuItem("Test", tabName = "test")
                    ),
                    dashboardBody(
                      tabItems(
                        tabItem(tabName = "test",
                                fluidRow(
                                  column(12, plotlyOutput('plot'))
                                ),
                                fluidRow(
                                  column(12, plotlyOutput('plot2'))
                                )
                        )
                      )
                    )
)

server <-  function(input, output, session) {
  output$plot <- renderPlotly({
    p <- ggplot() + geom_point(aes(x = 1, y = 2))
    ggplotly(p, height = 200)
  })
  output$plot2 <- renderPlotly({
    p2 <- ggplot() + geom_point(aes(x = 1, y = 2))
    ggplotly(p2)
  })
}

shinyApp(ui = ui, server = server)

Could you include a fully reproducible example? – SeGa May 02 '19 at 09:40 — SeGa, May 02 '19 at 09:40
Post edited to add simple, fully reproducible example. – akorn May 02 '19 at 17:23 — akorn, May 02 '19 at 17:23

ismirsehregal · Accepted Answer · 2019-05-03T16:18:57.143

ggplotly has a height argument. The following should do the job:

library(shiny)
library(shinydashboard)
library(plotly)

ui <- dashboardPage(dashboardHeader(title = "Test"),
                    dashboardSidebar( 
                      menuItem("Test", tabName = "test")
                    ),
                    dashboardBody(
                      tabItems(
                        tabItem(tabName = "test",
                                fluidRow(
                                  column(12, plotlyOutput('plot', height = "200px"))
                                ),
                                fluidRow(
                                  column(12, plotlyOutput('plot2'))
                                )
                        )
                      )
                    )
)

server <-  function(input, output, session) {
  output$plot <- renderPlotly({
    p <- ggplot() + geom_point(aes(x = 1, y = 2))
    ggplotly(p, height = 200)
  })
  output$plot2 <- renderPlotly({
    p2 <- ggplot() + geom_point(aes(x = 1, y = 2))
    ggplotly(p2)
  })
}

shinyApp(ui = ui, server = server)

Thanks for this suggestion. Unfortunately, this does not solve my issue. I updated the question to include an example of the remaining issue after using your suggestion. — akorn, May 03 '19 at 15:57
Ah, a second plot. `plotlyOutput` also has a `height` argument. Please see my edit. — ismirsehregal, May 03 '19 at 16:19
Wow, this is so simple. Not sure why I had such a hard time finding this solution. Thanks! — akorn, May 03 '19 at 16:46

Manipulating height attribute of renderPlotly object?

1 Answers1