Javascript 选择带有图像/图标的输入

我想知道是否有可能在shiny中创建类似“selectIcon”的东西。我想要一个只有图标或颜色的选择器

selectizeInput('colours', '',
               choices = c("blue", "red"),
               selected = "blue")

但除了“蓝色”和“红色”这两个词，我想显示彩色方块。对于所选选项也应如此。假设我的所有选项都有

.png

文件。如何将这些文件包括在

selectizeInput（）

中

这是一个非常类似的问题，但没有工作的解决方案为我，因为我没有js的知识

我试过这样的东西

  selectizeInput('colours', '',
                 choices = c("blue", "red"),
                 selected = "blue",
                 options = list(render = I(
                   "{
                   option: function(item, escape) {
                   return '<div><img src=\"item.png\" width = 20 />' + escape(item.name) + '</div>'
                   }
                   }"))

selectizeInput（'颜色'，''，
选项=c（“蓝色”、“红色”），
selected=“blue”，
选项=列表（渲染=I）(
"{
选项：功能（项目，转义）{
返回“”+转义（item.name）+”
}
}"))

但是没有成功。选项现在是未定义的。没有显示任何数字

---

非常感谢您的帮助。

您可以用软件包做类似的事情（这个答案是有偏见的，我是这个软件包的作者）：

---

编辑：在最新版本的

闪亮

，将

项目.名称

替换为

项目.标签

非常感谢！使用您的

shinyWidgets

软件包，一切都很好！很高兴听到这个消息，维克多，我尝试了这个，非常好，但是dropdownlist包含了图片以及ea旁边的“未定义”一词他们中的一个，怎么会这样？

library("shiny")
library("shinyWidgets")

ui <- fluidPage(
  br(),

  pickerInput(
    inputId = "one", 
    label = "Choose:", 
    choices = c("red", "blue", "green"),
    choicesOpt = list(content = sprintf(
      "<div style='background: %s;'>&nbsp;</div>",
      c("red", "blue", "green")
    ))
  ),
  verbatimTextOutput(outputId = "resone"),

  pickerInput(
    inputId = "two", 
    label = "Choose:", 
    choices = c("home", "search", "ok-sign"),
    choicesOpt = list(
      icon = c("glyphicon-home", 
               "glyphicon-search", 
               "glyphicon-ok-sign")
    )
  ),
  verbatimTextOutput(outputId = "restwo")


)

server <- function(input, output, session) {

  output$resone <- renderPrint(input$one)

  output$restwo <- renderPrint(input$two)

}

shinyApp(ui = ui, server = server)

library("shiny")

# dummies images
png(filename = "www/red.png")
plot.new()
rect(0, 0, 1, 1, col = "red")
dev.off()

png(filename = "www/blue.png")
plot.new()
rect(0, 0, 1, 1, col = "blue")
dev.off()


# images are displayed only in dropdown menu
ui <- fluidPage(
  br(),
  selectizeInput(
    'colours', '',
    choices = c("blue" = "blue.png", "red" = "red.png"),
    selected = "blue",
    options = list(
      render = I(
        "{
      option: function(item, escape) {
      return '<div><img src=\"' + item.value + '\" width = 20 />' + escape(item.name) + '</div>'
      }
      }")
    )
  )
)

server <- function(input, output, session) {



}

shinyApp(ui = ui, server = server)