R / shinyjs: the graph appears outside the window width after using the show / hide sidebar function

since after a couple of days I try to find a build solution that does not appear correctly (outside the window width) in a brilliant application using the show / hide sidebar function.

Here is a sample code:

library(shiny)
library(shinydashboard)
library(ggplot2)
library(shinyjs)

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    useShinyjs(),
    extendShinyjs(text = 'shinyjs.hideSidebar = function(params) { $("body").addClass("sidebar-collapse") }'),
    extendShinyjs(text='shinyjs.showSidebar = function(params) { $("body").removeClass("sidebar-collapse") }'),
    fluidRow(tabsetPanel(id='tabs',
                         tabPanel(value=1,title="Plot1",
                                  fluidRow(
                                    column(12,
                                  plotOutput('plot1', height=800)))),
                         tabPanel(value=2, title="Plot2",
                                  fluidRow(
                                    column(12,
                                  plotOutput('plot2', height=800))))
             )
      )))
  )
)

server <- function(input, output, session) { 
  output$plot1 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })
  output$plot2 <- renderPlot({
    out <- ggplot(data.frame(X1=rnorm(1000)),aes(X1))+
      geom_density(fill='light blue')+
      theme_minimal()
    print(out)
  })

  observe({
    if (input$tabs == 1) {
      js$hideSidebar()
    }
    else {
      js$showSidebar()
    }
  })
}

shinyApp(ui, server)

As we see in this code example, I would like the sidebar to appear when the user opens the second tab (the sidebar crashed when input$tabs == 1). It works very well, except when I click to see tab2, then go back to tab1 and again to tab2 , the graph will change and the x axis will be cut:

enter image description here

+4
2

"" - , / , , /:

extendShinyjs(text = 'shinyjs.hideSidebar = function(params) { $("body").addClass("sidebar-collapse"); 
              $(window).trigger("resize"); }'),
extendShinyjs(text='shinyjs.showSidebar = function(params) { $("body").removeClass("sidebar-collapse"); 
              $(window).trigger("resize"); }')
+2

, plotOutput() (, width=800). ( ), .

0

Source: https://habr.com/ru/post/1667621/


All Articles