Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
508 views
in Technique[技术] by (71.8m points)

r - Prevent selectInput from wrapping text

In a shiny app, is there a way to prevent the text of the dropdown in selectInput() from wrapping, as in the screenshot below? Each option is a long text string. I'd like the dropdown to show each long string on one line, without making a huge sidebar.

enter image description here

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Taking inspiration from here and here you can add some custom css to the drowpdown

Here's a working example

library(shiny)

server <- function(input, output) {
    output$distPlot <- renderPlot({
        hist(rnorm(input$obs), col = 'darkgray', border = 'white')
    })
}

ui <- fluidPage(
    sidebarLayout(
        sidebarPanel(
            sliderInput("obs", "Number of observations:", min = 10, max = 500, value = 100),
            selectizeInput(inputId = "si",
                            label =  "select", 
                            choices = c("the quick brown fox jumped over the lazy dog the quick brown fox jumped over the lazy dog"), 
                            selected = NULL),

            ## Custom css               
            tags$head(
                tags$style(HTML('
                                .selectize-input {
                                    white-space: nowrap;
                                }
                                .selectize-dropdown {
                                    width: 660px !important;
                                }'
                                )
                        )
            )

        ),
        mainPanel(plotOutput("distPlot"))
    )
)

shinyApp(ui = ui, server = server)

enter image description here


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...