svg with clickable links in shiny - not clickable

Question

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.

score 2 · Accepted Answer · edited May 23 '17 at 12:07

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)

Thanks - that works! I had better results with the object tag, like this: and I had to remember to put the svg in the www/ folder. — Steve Powell, May 10 '16 at 10:20
are you using `svglite` https://github.com/hadley/svglite? If not, might be worth a try. — timelyportfolio, May 10 '16 at 12:41

svg with clickable links in shiny - not clickable

1 Answers1

Linked