来自网址的RenderImage和可点击的

Question

我想弄清楚如何在Shiny中使用带有在线位置图像（URL）的renderImage，并使图像可以点击，这样我就可以将observeEvent（）挂起来。我可以做这两件事，但不能一起做。我渲染URL的方法不适用于点击，而允许点击的本地图像版本不会渲染URL图像。

以下是两个半工作版本： 我从here获取了一些灵感来获取

可点击

library(shiny)

ui <- fluidPage(
        imageOutput("image1", click = "MyImage")
  )

server <- function(input, output, session) {
  setwd(Set the directory of the image in here)    #### modify to test
  output$image1 <- renderImage({
    list(
      src = "YOUR_IMAGE.png",                     #### modify to test
      contentType = "image/png",
      width = 90,
      height = 78,
      alt = "This is alternate text"
    )}, deleteFile = FALSE)
  observeEvent(input$MyImage, { print("Hey there")})
}
shinyApp(ui, server)

如果我输入一个URL（并删除deleteFile = FALSE），它会显示一个空方块。仍然可点击。

使用renderUI()

进行网址化

library(shiny)

ui <- fluidPage(
           uiOutput("image1", click = "MyImage")
  )

server <- function(input, output, session) {
  setwd(AppDir)

  output$image1<- renderUI({
    imgurl2 <- "https://www.rstudio.com/wp-content/uploads/2014/07/RStudio-Logo-Blue-Gradient.png"
    tags$img(src=imgurl2, width = 200, height = 100)
  })
 observeEvent(input$MyImage, { print("Hey there")})
}
shinyApp(ui, server)

显示图像，但图像不再可点击。

如果我在示例2中将renderUI()和uiOuput()更改为renderImage()和imageOutput()，则会引发无效的文件参数＆＃39;错误。

htmlOuput with renderText

我也尝试过这个版本，这个版本在另一个SO帖子中，但是再一次，不是可点击的。此方法基于此link

的答案

 library(shiny)

  ui <- fluidPage(
    htmlOutput("image1", click = "MyImage")
  )

  server <- function(input, output, session) {
    setwd(AppDir)
    imgurl2 <- "https://www.rstudio.com/wp-content/uploads/2014/07/RStudio-Logo-Blue-Gradient.png"

    output$image1<- renderText({c('<img src="',imgurl2,'">')})

    observeEvent(input$MyImage, { print("Hey there")})
  }
  shinyApp(ui, server)

我想远离本地图像，因为一旦我们发布了Shiny App，这似乎更有意义。因此，真正需要一种允许呈现URL图像并使其可被点击的解决方案。如果有人可以解释为什么click =仅使用imageOutput工作本地文件，则可以获得奖励积分。

Answer 1

如何将图像从url转换为ggplot：

library(magick)
library(cowplot)
library(gtools)
library(shiny)

ui <- fluidPage(
  uiOutput("myplotoutput"),
  uiOutput("text")  
)

server <- function(input, output, session) {
  output$myplotoutput = renderUI( {
    plotOutput("urlimage", click=clickOpts(id="myclick") )
}  )

output$text=renderUI({
    validate(
      need(try(!invalid(input$myclick)), "Text will appear here")
    )
    textOutput("reactext")
})

output$reactext<-renderText(mytext$texto)

output$urlimage<- renderPlot({
g<-  ggdraw() +   draw_image("https://jeroen.github.io/images/frink.png")
g
})

mytext<-reactiveValues()  

observeEvent(input$myclick, {
    mytext$texto<-"Hey there"
})
} 

shinyApp(ui, server)

Answer 2

一种替代方法是使用onclick库中的shinyjs函数。它允许您将点击事件包括到特定的html元素（以id为目标）。

Here's the documentation

在您的情况下，代码如下所示：

library(shiny)
library(shinyjs)

ui <- fluidPage(
  useShinyjs(),
  uiOutput("image1", click = "MyImage")
)

server <- function(input, output, session) {

  output$image1<- renderUI({
    imgurl2 <- "https://www.rstudio.com/wp-content/uploads/2014/07/RStudio-Logo-Blue-Gradient.png"

    div(id = "myImage",
      tags$img(src = imgurl2, width = 200, height = 100)
    )
  })
  onclick(
    myImage, 
    { 
      # Do whatever you want!
      print("Hey there")
    }
  )
}

shinyApp(ui, server)