How to Create a Hyperlink Interactively in Shiny App

how to create a hyperlink interactively in shiny app?

You can use renderUI to dynamically render HTML:

library(shiny)
runApp(
  list(ui = fluidPage(
    selectInput('website', 'Choose a website'
                , list(bbc = "http://www.bbc.co.uk"
                       , google = "http://www.google.com"
                       , cnn = "http://www.cnn.com")
    )
                , htmlOutput("mySite")
    )
  ,server = function(input, output, session){
    output$mySite <- renderUI({
      tags$a(href = input$website, input$website)
    })
  })
)

Create URL hyperlink in R Shiny?

By using paste, you're treating the url as a string. The function you want to use here is tagList:

runApp(
  list(ui = fluidPage(
     uiOutput("tab")
    ),
  server = function(input, output, session){
    url <- a("Google Homepage", href="https://www.google.com/")
    output$tab <- renderUI({
      tagList("URL link:", url)
    })
  })
)

Create hyper link to a pdf page in shiny app

You can try this one:

a("Page4",target="_blank",href="myfile.pdf#page=4")

Adding hyperlinks to Shiny plots

Shiny apps use plotly's postMessage API or plotly.js, both of which expose click, hover, and zoom events. These events aren't yet exposed as callbacks to the underlying shiny server, but they are accessible with custom javascript that you can serve yourself in shiny.

Here's an example with click events:

ui.R

library(shiny)
library(plotly)

shinyUI(fluidPage(
  mainPanel(
    plotlyOutput("trendPlot"),
    tags$head(tags$script(src="clickhandler.js"))
  )
))

server.R

library(shiny)
library(plotly)

x = c(1, 2, 3)
y = c(4, 2, 4)
links = c("https://plot.ly/r/", 
          "https://plot.ly/r/shiny-tutorial", 
          "https://plot.ly/r/click-events")

df = data.frame(x, y, links)

shinyServer(function(input, output) {

  output$trendPlot <- renderPlotly({
    # Create a ggplot
    g = ggplot(data=df, aes(x = x, y = y)) + geom_point()
    # Serialize as Plotly's graph universal format
    p = plotly_build(g)
    # Add a new key, links, that JS will access on click events
    p$data[[1]]$links = links
    p

    # Alternatively, use Plotly's native syntax. More here: https://plot.ly/r
    # plot_ly(df, x=x,y=y,links=links)
  })
})

www/clickhandler.js

$(document).ready(function(){
// boiler plate postMessage plotly code (https://github.com/plotly/postMessage-API)
var plot = document.getElementById('trendPlot').contentWindow;

pinger = setInterval(function(){
    plot.postMessage({task: 'ping'}, 'https://plot.ly')
}, 100);

var clickResponse = function(e) {
     plot = document.getElementById('trendPlot').contentWindow;
    var message = e.data;
     console.log( 'New message from chart', message );
    if(message.pong) {
        // tell the embedded plot that you want to listen to click events
        clearInterval(pinger);
        plot.postMessage({
              task: 'listen', events: ['click']}, 'https://plot.ly');
          plot.postMessage({
            task: 'relayout',
            'update': {hovermode: 'closest'},
        },
        'https://plot.ly');
    }
    else if(message.type === 'click') {
        var curveNumber = message['points'][0]['curveNumber'],
            pointNumber = message['points'][0]['pointNumber'];

        var link;
        var traces = message.points[0].data;
        if(traces !== null && typeof traces === 'object') {
            link = traces.links[pointNumber];
        } else {
            link = traces[curveNumber].links[pointNumber];
        }

        console.log(link);

        var win = window.open(link, '_blank');
        win.focus();
    }
};

window.addEventListener("message", clickResponse, false);

});

Here are some more resources that might be helpful:

• Adding custom interactivity to plotly charts in javascript with R
• In particular Binding to click events in JavaScript
• Getting started with Shiny and plotly
• Plotly postMessage API for adding custom interactivity to hosted plotly graphs

How to create a single line of text with hyperlink or other elements on same line in R Shiny?

You just need a comma. If you want your link also formatted with the h4 style, the code would look like this:

library(shiny)

shinyApp(
  ui = fluidPage(
    fluidRow(
      h4("We recently launced a new initiative. For more information visit: ", a("Search for it", href = "wwww.google.com"))
    )
  ),
  server = function(input, output) {

  }
)

Which results in:

Making multiple images hyperlinked in Shiny

You could do something like this:

 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)

---

Related Topics