selectize輸入圖片/圖標

Question

我想知道是否有可能在閃亮時創建類似「selectIcon」的東西。我想選擇只有圖標或例如顏色。

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

但是英語單詞「藍色」和「紅色」我想顯示彩色正方形。選定的選項也應該如此。假設我有我所有選項的.png文件。我如何在selectizeInput()中包含這些文件？

這是一個非常類似的問題this one然而，由於我沒有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>' 
        } 
        }")) 

，但沒有成功。選項現在爲undefined。沒有數字顯示。

我很感激任何幫助。

Answer 1

你可以做這樣的事情與包shinyWidgets（這個答案是偏頗的，我這個包的作者）：

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) 

與selectizeInput一個解決辦法是把你的圖片名爲www文件夾中在你的應用目錄中，然後你可以這樣做：

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)