Czy możesz mieć obraz jako błyszczący przycisk radia?

Question

Próbuję użyć Shiny jako narzędzia oceny dla przedmiotów wielokrotnego wyboru. W związku z tym w niektórych przypadkach chciałbym mieć obraz jako wybór. Zamiast tego wyświetlany jest surowy HTML. Czy można to zrobić w Shiny?

library(shiny) 

choices <- c('\\(e^{i \\pi} + 1 = 0 \\)' = 'equation', 
      '<img src="Rlogo.png">' = 'logo') 

ui <- shinyUI(fluidPage(
    withMathJax(), 
    img(src='Rlogo.png'), 
    fluidRow(column(width=12, 
     radioButtons('test', 'Radio buttons with MathJax choices', 
        choices = choices, inline = TRUE), 
     br(), 
     h3(textOutput('selected')) 
    )) 
)) 

server <- shinyServer(function(input, output) { 
    output$selected <- renderText({ 
     paste0('You selected the ', input$test) 
    }) 
}) 

shinyApp(ui = ui, server = server) 

Będziesz musiał umieścić logo R w katalogu www gdzie umieścić ten app.r skrypt. Oto bezpośredni link do logo: http://i1.wp.com/www.r-bloggers.com/wp-content/uploads/2016/02/Rlogo.png?resize=300%2C263

Answer 1

img nie jest wyświetlana w przycisków radiowych, ponieważ nazwy są przechowywane w span i generowane przy użyciu tags$span więc wszystkie HTML jest uciekł.

Jeśli masz tylko zrobić to raz, można skopiować dane wyjściowe radioButtons('test', 'Radio buttons with MathJax choices', choices = choices, inline = TRUE), umieścić go w tags$div i dodać obraz:

 fluidRow(column(width=12, 
         tags$div(HTML('<div id="test" class="form-group shiny-input-radiogroup shiny-input-container shiny-input-container-inline"> 
    <label class="control-label" for="test">Radio buttons with MathJax choices</label> 
             <div class="shiny-options-group"> 
             <label class="radio-inline"> 
             <input type="radio" name="test" value="equation" checked="checked"/> 
             <span>\\(e^{i \\pi} + 1 = 0 \\)</span> 
             </label> 
             <label class="radio-inline"> 
             <input type="radio" name="test" value="logo"/> 
             <span><img src="http://i1.wp.com/www.r-bloggers.com/wp-content/uploads/2016/02/Rlogo.png?resize=300%2C263"/></span> 
             </label> 
             </div> 
             </div> ')), 
         br(), 
         h3(textOutput('selected')) 
     )) 

Jeśli musisz zrobić to wiele razy, można zdefiniować radioButtons_withHTML funkcję:

radioButtons_withHTML <- function (inputId, label, choices, selected = NULL, inline = FALSE, 
      width = NULL) 
{ 
     choices <- shiny:::choicesWithNames(choices) 
     selected <- if (is.null(selected)) 
       choices[[1]] 
     else { 
       shiny:::validateSelected(selected, choices, inputId) 
     } 
     if (length(selected) > 1) 
       stop("The 'selected' argument must be of length 1") 
     options <- generateOptions_withHTML(inputId, choices, selected, inline, 
            type = "radio") 
     divClass <- "form-group shiny-input-radiogroup shiny-input-container" 
     if (inline) 
       divClass <- paste(divClass, "shiny-input-container-inline") 
     tags$div(id = inputId, style = if (!is.null(width)) 
       paste0("width: ", validateCssUnit(width), ";"), class = divClass, 
       shiny:::controlLabel(inputId, label), options) 
} 

generateOptions_withHTML <- function (inputId, choices, selected, inline, type = "checkbox") 
{ 
     options <- mapply(choices, names(choices), FUN = function(value, 
                    name) { 
       inputTag <- tags$input(type = type, name = inputId, value = value) 
       if (value %in% selected) 
         inputTag$attribs$checked <- "checked" 
       if (inline) { 
         tags$label(class = paste0(type, "-inline"), inputTag, 
            tags$span(HTML(name))) 
       } 
       else { 
         tags$div(class = type, tags$label(inputTag, tags$span(HTML(name)))) 
       } 
     }, SIMPLIFY = FALSE, USE.NAMES = FALSE) 
     div(class = "shiny-options-group", options) 
} 

różnica w stosunku do pierwotnego połączenia generateOptions_withHTML jest do utworzenia nazwy przycisków i dodałem funkcję HTML() wokół name w tags$span, aby zapobiec ucieczce. Możesz umieścić te funkcje w innym pliku i użyć source.

Następnie można użyć radioButtons_withHTML('test', 'Radio buttons with MathJax choices',choices = choices, inline = TRUE), aby utworzyć swoją radioButtons.