The little code below generates a graphic, but notice from the image that the image is being generated at the bottom, however I would like this image to be plotted on the right side. I have inserted an image of how the image is being generated so far and also another image of the position I would like the image to be generated. Thanks in advance for your help!

library(shiny)
library(shinythemes)
library(dplyr)

function.test<-function(){
  
df1 <- structure(
  list(date1= c("2021-06-28","2021-06-28","2021-06-28"),
       date2 = c("2021-07-01","2021-07-02","2021-07-04"),
       Category = c("ABC","ABC","ABC"),
       Week= c("Wednesday","Wednesday","Wednesday"),
       DR1 = c(4,1,0),
       DR01 = c(4,1,0), DR02= c(4,2,0),DR03= c(9,5,0),
       DR04 = c(5,4,0),DR05 = c(5,4,0),DR06 = c(5,4,0),DR07 = c(5,4,0),DR08 = c(5,4,0)),
  class = "data.frame", row.names = c(NA, -3L))



return(df1)
}


ui <- fluidPage(
  
  ui <- shiny::navbarPage(theme = shinytheme("flatly"), collapsible = TRUE,
                          br(),
                          
                          tabPanel("",
                                   sidebarLayout(
                                     sidebarPanel(
                                       
                                       uiOutput("date"),
                                       uiOutput("mycode"),
                                     ),
                                     fluidRow(
                                       column(12,
                                              sidebarPanel(
                                                
                                                conditionalPanel(
                                                  condition = "output.mycode",
                                                  uiOutput('daterange'),
                                                  actionButton("reset", "Reset")
                                                  
                                                  
                                                )))), ),
                                   
                                   fluidRow(
                                     column(10,
                                            
                                            mainPanel(
                                              tabsetPanel(
                                                tabPanel("Output", plotOutput("graph",width = "100%", height = "600")
                                                )
                                              ),
                                            ))
                                   ))))


server <- function(input, output,session) {
  
  data <- reactive(function.test())
  
  output$date <- renderUI({
    req(data())
    all_dates <- seq(as.Date('2021-01-01'), as.Date('2021-01-15'), by = "day")
    disabled <- as.Date(setdiff(all_dates, as.Date(data()$date2)), origin = "1970-01-01")
    dateInput(input = "date2",
              label = h4("Data"),
              min = min(data()$date2),
              max = max(data()$date2),
              value = NA,
              format = "dd-mm-yyyy",
              datesdisabled = disabled)
    
  })
  
  output$mycode <- renderUI({
    req(input$date2)
    df1 <- data()
    df2 <- df1[as.Date(df1$date2) %in% input$date2,]
    selectInput("code", label = h4("Category"),choices=unique(df2$Category))
  })
  
  output$graph <- renderPlot({
    req(input$date2,input$code)
    f1(data(),as.character(input$date2),as.character(input$code))
  })
  
  my <- reactiveValues(plot=NULL)
  output$graph <- renderPlot({
    if (!is.null(input$date2) & !is.null(input$code)) {
      my$plot <- plot(cars) 
    }else {
      my$plot <- NULL
    }
    my$plot
  })
  
  observeEvent(input$reset, {
    req(input$date2)
    df1 <- data()
    my$plot <- NULL
    updateDateInput(session, 'date2', value = NA)
    updateSelectInput(session, 'code', h4("Category"),choices= unique(df1$Category), selected=character(0))
  })
  
}


shinyApp(ui = ui, server = server)

How are you at the moment:

How I would like it to be:

CodePudding user response：

You should use only one sidebarPanel() in your sidebarLayout(), and it must be at the same level than the mainPanel(), see the docs, as follows (no need to insert some fluidRow() either):

sidebarLayout(
    sidebarPanel(
      # menus, widgets
    ),

    mainPanel(
      # plot
    )
  )

Full code from your example:

sidebarLayout(
 sidebarPanel(
   
   uiOutput("date"),
   uiOutput("mycode"),
              conditionalPanel(
                condition = "output.mycode",
                uiOutput('daterange'),
                actionButton("reset", "Reset")               
              )),

        mainPanel(
          tabsetPanel(
            tabPanel("Output", plotOutput("graph",width = "100%", height = "600")
            )
          )
)))

EDIT: Since a sidebarPanel() is meant to be used as a single column, if you want separate panels on the left you can use several wellPanel() in a fluidPage() layout:

fluidPage(
 fluidRow(
   column(4, "sidebar",
   wellPanel(
   uiOutput("date"),
   uiOutput("mycode")
   ),
   wellPanel(
   conditionalPanel(
     condition = "output.mycode",
     uiOutput('daterange'),
     actionButton("reset", "Reset")               
   )
   )
   ),
 
 column(8, "main",
   tabsetPanel(
     tabPanel("Output", plotOutput("graph",width = "100%", height = "600")
     )
   )
 ))
)
))