R блестящий: выравнивание входов / выходов по горизонтали внутри столбцов

#r #shiny

#r #блестящий

Вопрос:

Я хотел бы выровнять входы / выходы по горизонтали внутри столбцов. Я могу сделать это, разделив идентификаторы, но я бы предпочел способ, который динамически разбивает один идентификатор ввода / вывода на разнесенные столбцы.

Вот мой код:

 library(shinythemes)
library(shiny)
rm(list = ls())

ui <-  navbarPage('Example',id = "inTabset",
                  tabPanel(title = "Example_1", value = "Example_1",
                           fluidPage(
                               tags$b( h4("Example_1", align = "left")),
                             theme = shinytheme("paper"),
                             fluidRow(
                               column(6,checkboxGroupInput("checkGroup", label ="", 
                                                           choices = c(1,2,3,4,5,6,7,8),
                                                           selected = c(1,4,7)) )
                              ),
                             br()
                           ),
                           hr(),
                           verbatimTextOutput("example1")
                  ),
                  
               tabPanel(title = "Example_2", value = "Example_2", 
                                         fluidPage( 
                                           tags$b( h4("Example_2", align = "left")),
                                           br(),
                                           fluidRow(   
                                             column(4, uiOutput("VarsInput")),
                                           fluidRow(verbatimTextOutput("dataInfo")),
                                           br(),
                                           hr())    
                                )
))

server <- function(input, output, session) {
  
  output$example1 = renderPrint(input$checkGroup)
  ### output$example2 = ????
  ### i.e what data (a,b,c,d,e or f) has been chosen from the selectInput below? 
  
  
  K <- reactive({
    length(input$checkGroup)
  })
  
  output$VarsInput <- renderUI({
    NoV = K()
    C = sapply(1:(ceiling(NoV)), function(i){paste0(input$checkGroup[i])})
    
    output = tagList()
    for(i in seq_along(1:ceiling(NoV))){
      output[[i]] = tagList()
      output[[i]][[1]] = selectInput(C[i], C[i], c("",c("a","b","c","d","e","f")))
      }
    output
  })
}

shinyApp(ui, server)
 

В качестве примера, первый ввод выглядит так:
одиночный столбец

Я мог бы, конечно, разделить это на 2 (со следующим кодом), чтобы это выглядело как на следующем рисунке. Однако это влечет за собой создание отдельного идентификатора, чего я хочу избежать.

2 столбца

 library(shinythemes)
library(shiny)
rm(list = ls())

ui <-  navbarPage('Example',id = "inTabset",
                  tabPanel(title = "Example_1", value = "Example_1",
                           fluidPage(
                               tags$b( h4("Example_1", align = "left")),
                             theme = shinytheme("paper"),
                             fluidRow(
                               column(6,checkboxGroupInput("checkGroup1", label ="", 
                                                           choices = c(1,2,3,4),
                                                           selected = c(1,4)) ),
                               column(6,checkboxGroupInput("checkGroup2", label ="", 
                                                           choices = c(5,6,7,8),
                                                           selected = c(7)) )
                              ),
                             br()
                           ),
                           hr(),
                           verbatimTextOutput("example1")
                  ))

server <- function(input, output, session) {
  
  output$example1 = renderPrint(input$checkGroup1)
  
  output$example2 = renderPrint(input$checkGroup2)
 

 
}

shinyApp(ui, server)
 

Большое спасибо.

Комментарии:

1. Установите inline = TRUE в своем checkboxGroupInput

2. Спасибо за вашу помощь. Однако это не позволяет достичь пользовательского интерфейса, который я собираюсь просто разделить на 2 столбца.

3. @Graham С помощью вашего второго варианта вы могли бы довольно легко объединить результаты обоих входов в reactive выражение. Есть ли другие причины, по которым вы хотите избежать второго inputId ?

4. Спасибо, @Ben. Да, это все еще вариант. Мне просто интересно, есть ли способ сделать это без ручного разделения содержимого на столбцы, особенно если требуется несколько столбцов.

Ответ №1:

Использование inline=TRUE with width="100px" будет определять ширину, которую вы хотите отобразить. Затем используйте

 tags$head(
    tags$style(
      ".checkbox-inline{margin-left:10px;"
    )
  )
 

для отступа первой строки. Попробуйте это

 library(shinythemes)
library(shiny)
rm(list = ls())

ui <-  navbarPage('Example',id = "inTabset",

                  tabPanel(title = "Example_1", value = "Example_1",
                           fluidPage(
                             tags$b( h4("Example_1", align = "left")),
                             theme = shinytheme("paper"),
                             fluidRow(
                               column(6,checkboxGroupInput("checkGroup", label ="", width="100px", inline=TRUE,
                                                           choices = c(1,2,3,4,5,6,7,8),
                                                           selected = c(1,4,7)) )
                             ),
                             br()
                           ),
                           hr(),
                           verbatimTextOutput("example1")
                  ),
                  tags$head(
                    tags$style(
                      ".checkbox-inline{margin-left:10px;"
                    )
                  ),
                  tabPanel(title = "Example_2", value = "Example_2", 
                           fluidPage( 
                             tags$b( h4("Example_2", align = "left")),
                             br(),
                             fluidRow(   
                               column(4, uiOutput("VarsInput")),
                               fluidRow(verbatimTextOutput("dataInfo")),
                               br(),
                               hr())    
                           )
                  ))

server <- function(input, output, session) {
  
  output$example1 = renderPrint(input$checkGroup)
  ### output$example2 = ????
  ### i.e what data (a,b,c,d,e or f) has been chosen from the selectInput below? 
  
  
  K <- reactive({
    length(input$checkGroup)
  })
  
  output$VarsInput <- renderUI({
    NoV = K()
    C = sapply(1:(ceiling(NoV)), function(i){paste0(input$checkGroup[i])})
    
    output = tagList()
    for(i in seq_along(1:ceiling(NoV))){
      output[[i]] = tagList()
      output[[i]][[1]] = selectInput(C[i], C[i], c("",c("a","b","c","d","e","f")))
    }
    output
  })
}

shinyApp(ui, server)
 

вывод

Комментарии:

1. Спасибо за вашу помощь, @YBS. Как бы мне увеличить разрыв между столбцами, чтобы он выглядел как мой пример с двумя столбцами?

2. Извините, я этого не пробовал. Это может потребовать настройки javascript, а я не очень хорошо знаком с js. Кроме того, вы можете обновить checkboxGroupInput() как свою собственную функцию с немного другим именем и использовать ее.