2017-10-12 3 views
0

Sagen wir, ich habe einen Eingang data frame wie folgt:Herstellung mehrerer Bilder in Shiny Hyperlink

dat <- data.frame(
    country = c('USA', 'China', 'UK', "Germany", "France"),            
    flag = c('<img src="http://upload.wikimedia.org/wikipedia/en/thumb/a/a4/Flag_of_the_United_States.svg/200px-Flag_of_the_United_States.svg.png" width="100" height="80"></img>', '<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/Flag_of_the_People%27s_Republic_of_China.svg/200px-Flag_of_the_People%27s_Republic_of_China.svg.png"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/a/ae/Flag_of_the_United_Kingdom.svg"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/b/ba/Flag_of_Germany.svg"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/c/c3/Flag_of_France.svg"width="100" height="80"></img>'),              
    infolink = c('https://en.wikipedia.org/wiki/United_States', 'https://en.wikipedia.org/wiki/China', 'https://en.wikipedia.org/wiki/United_Kingdom', 'https://en.wikipedia.org/wiki/Germany', 'https://en.wikipedia.org/wiki/France')) 

Meine ursprüngliche data frame ist groß. Datenrahmen hat 3 Spalten country, flag und infolink. Spalte country hat den Namen des Landes. Spalte flag hat eine Bildquelle des Flags, das angezeigt wird. Und Spalte infolink hat URL zu Wikipedia-Seite des Landes. Mein Ziel ist es, eine Flagge des Landes mit dem Ländernamen im datatable Format unter Verwendung renderDataTable anzuzeigen. Wo die Flagge jedes Landes mit der entsprechenden Wikipedia-URL in der Spalte "infolink" verlinkt werden soll.

Es gibt SO mehrere Fragen bereits auf Hyperlinking ein Bild gestellt:

Making an Image Hyperlink in R Shiny header

how to create a hyperlink interactively in shiny app?

jedoch diese Fragen Hyperlink eine Bildquelle nicht mehrere Bilder mit jeweils auf ihren Hyperlink verwiesen wird.

Es folgt mein glänzend App-Code:

library(shiny) 
# UI for application 
ui <- fluidPage(

    # Application title 
    titlePanel("Image Hyperlinking Test"), 

    mainPanel(
    a(dataTableOutput("imagetest"), href=dat$infolink, target="_blank") 
    ) 
) 

# Server for application 
server <- function(input, output) { 
    a(dat$flag, href=dat$infolink) 
    dat2 <- data.frame(dat[,c("country", "flag")]) 

    output$imagetest <- renderDataTable({ 
    return(dat2) 
    },escape = FALSE) 
} 

shinyApp(ui = ui, server = server) 

Diese App Laufen produziert zwei Warnungen:

Warning in if (!is.na(attribValue)) { : 
the condition has length > 1 and only the first element will be used Warning in charToRaw(enc2utf8(text)) : 
argument should be a character vector of length 1 all but the first element will be ignored 

Ich verstehe, dass diese Warnungen von href in ui verursacht, weil ich vector von Hyperlinks zugeordnet größer als 1 und nur den ersten Hyperlink zu allen Bildern zuweisen. Dies gibt mir eine App Armaturenbrett wie folgt:

enter image description here

gehen jedoch alle Flagge auf den ersten hyperlink in einem Vektor mittels Hyperlink verwiesen, wie es in der Warnung vorgeschlagen wurde. Also, wenn ich auf jede Flagge klicke, wird es mich auf die Wikipedia-Seite von USA umleiten, die eine erste hyperlink im infolink Vektor in meinem dat data frame ist.

Ich habe versucht, die Warnung zu beheben und jede Flagge auf die Wikipedia-Seite ihres jeweiligen Landes zu verlinken, aber nichts hat funktioniert. Wenn ich irgendeinen SO-Post verpasst habe, über den es berichtet, würde ich mich freuen, wenn Sie mich dazu umleiten. Wie auch immer, ich würde mich über jede Anleitung freuen, um dieses Problem zu beheben.

Antwort

1

Man könnte so etwas tun:

dat <- data.frame(
     country = c('USA', 'China', 'UK', "Germany", "France"),            
     flag = c('<img src="http://upload.wikimedia.org/wikipedia/en/thumb/a/a4/Flag_of_the_United_States.svg/200px-Flag_of_the_United_States.svg.png" width="100" height="80"></img>', '<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/Flag_of_the_People%27s_Republic_of_China.svg/200px-Flag_of_the_People%27s_Republic_of_China.svg.png"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/a/ae/Flag_of_the_United_Kingdom.svg"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/b/ba/Flag_of_Germany.svg"width="100" height="80"></img>', '<img src="https://upload.wikimedia.org/wikipedia/en/c/c3/Flag_of_France.svg"width="100" height="80"></img>'),              
     infolink = c('https://en.wikipedia.org/wiki/United_States', 'https://en.wikipedia.org/wiki/China', 'https://en.wikipedia.org/wiki/United_Kingdom', 'https://en.wikipedia.org/wiki/Germany', 'https://en.wikipedia.org/wiki/France'), 
     stringsAsFactors = FALSE) 

    library(shiny) 
    # UI for application 
    ui <- fluidPage(

     # Application title 
     titlePanel("Image Hyperlinking Test"), 

     mainPanel(
     DT::dataTableOutput("imagetest")#, href=dat$infolink, target="_blank") 
    ) 
    ) 

    # Server for application 
    server <- function(input, output) { 
     hlink <- apply(dat,1, function(x){ 
     as.character(a(HTML(x[["flag"]]), href=x[["infolink"]], target="_blank")) 
     })  

     dat2$link <- hlink 
     output$imagetest <- DT::renderDataTable({ 
     DT::datatable(dat2, escape = FALSE) 
     }) 
    } 

    shinyApp(ui = ui, server = server) 
+0

Loved, was Sie mit hlink tat. Ich versuchte ähnliches, aber war nicht erfolgreich, semantisch korrekte HTML-Syntax zu erhalten. In Ihrem Code muss 'dat2'' dat' sein, damit die App funktioniert. Es wäre auch cool, wenn Sie diesen Teil kurz erklären könnten: 'HTML (x [[" flag "]]), href = x [[" "infolink"]] '. Vielen Dank und ich akzeptiere die Antwort. – Santosh

+0

Im Grunde definiert ein 'a'-Tag einen Hyperlink. So gibt 'href' die URL der Seite an, auf die der Link verweist,' x [["infolink"]] 'der angezeigte Parameter. In unserem Fall ist das der HTML-Code für die Anzeige des Bildes, also die HTML-Funktion. Hoffe es ist klar. – SBista

+0

Verstanden. Als ich eine ähnliche Funktion schrieb, verwendete ich keine HTML-Funktion und im Ergebnis wurde Bildquelle anstelle von Bildern angezeigt. Danke noch einmal. – Santosh