Início / user-13333279

YBS's questions

Martin Hope
YBS
Asked: 2025-04-05 20:44:05 +0800 CST
  • 7

colourpicker-panelestá parcialmente oculto em a rank_list(), mas o mesmo não é verdade em a tagList(). Existe uma maneira de implementar a propriedade CSS overflow: visibleou alterar z-index?

library(shiny)
library(sortable)
library(colourpicker)

mycolors <- c("#0A954F", "#e0677b", "#244457","#01B0F0")

labels <- list(
  htmltools::tags$div(
    div(id = "my_col1", colourInput("col1", label=NULL, mycolors[1], palette = "square", width = "90px", allowTransparent = TRUE), style = "margin-bottom: 5px;" ), style="z-index:1;"
  ),
  tags$div(
    colourInput("col2", label=NULL, mycolors[2], palette = "square", width = "90px", allowTransparent = TRUE), style = "z-index:2;"
  ),
  tags$div(
    colourInput("col3", label=NULL, mycolors[3], palette = "square", width = "90px", allowTransparent = TRUE), style = "z-index:3;"
  )
)

ui = fluidPage(
  tags$head(tags$style(HTML('.colourpicker-focus>.colourpicker-input-container>.colourpicker-panel>div { overflow:visible; }'))),
  sidebarLayout(
    sidebarPanel(
      uiOutput("color_list"),
      uiOutput("color_list2")
    ),
    mainPanel(
      plotOutput("plot")
    )
  )
    
  )
server = function(input, output) {
  output$color_list <- renderUI({
    rank_list_basic <- rank_list(
      text = "Drag the items in any desired order",
      labels = labels,
      input_id = "rank_list_basic"
    )
  })
  
  output$color_list2 <- renderUI({
    tagList(
      colourInput("col1b", "", mycolors[1], palette = "square", width = "90px", allowTransparent = TRUE),
      colourInput("col2b", "", mycolors[2], palette = "square", width = "90px", allowTransparent = TRUE),
      colourInput("col3b", "", mycolors[3], palette = "square", width = "90px", allowTransparent = TRUE)
    )
  })
  
  output$plot <- renderPlot({
    set.seed(1)
    plot(rnorm(50), bg = input$col1, col = input$col1, pch = 21)
  })
  
  
}

shinyApp(ui, server)

saída