svg with clickable links in shiny - not clickable

问题

I am generating svg files in Shiny using graphviz dot. They have clickable links. I am doing it like this.

imageOutput("imagegraph",width = "100%", height = "auto",inline=F)
...
output$imagegraph <- renderImage({
...
list(src = svgGeneratedOnTheFlyByGraphviz.svg,
     align="top",
     width=wid,
     contentType="text/svg+xml"
     )
)

The problem is that although the actual image as viewed through "open image in new tab" does have the clickable links, within the div generated by Shiny, nothing is clickable. Also the text is not selectable, which is strange. (Can't post a complete reproducible example because the code to produce the .svg using Graphviz is pretty hairy and has a lot of dependencies.) I tried fiddling with all the parameters including contentType but nothing helps.

回答1:

I think the links are not clickable because you are using the img tag to render your svg. This StackOverflow post says you can overcome this limitation by using the object tag. However, I think using the svg tag will provide the best results. Here is a minimal example. Based on your question, you could wrap your dynamically-generated svg in HTML(...).

library(shiny)
library(htmltools)

# see Shiny docs
#  http://shiny.rstudio.com/reference/shiny/latest/htmlOutput.html
#  http://shiny.rstudio.com/reference/shiny/latest/renderUI.html
ui <- list(
  uiOutput("svgout")
)

server <- function(input, output, session){
  output$svgout <- renderUI({
    HTML(
"
<svg>
  <a xlink:href = 'https://developer.mozilla.org/en-US/docs/Web/SVG/Element/circle'>
    <circle cx='60' cy='60' r='50'/>
  </a>
</svg>
"      
    )
  })
}

shinyApp(ui, server)

来源：https://stackoverflow.com/questions/37121767/svg-with-clickable-links-in-shiny-not-clickable

标签

svg

Shiny