代码之家 › 专栏 › 技术社区 › Mark

从URL进行渲染并可单击

render shiny url r html

Mark · 技术社区 · 8 年前

我想知道如何在Shiny中使用renderImage和在线定位图像(URL),并使图像可点击,这样我就可以在其上挂一个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),它会显示一个空方块。但仍然可以点击。

URLable通过使用 `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)

显示图像,但图像不再可单击。

renderUI() uiOuput() 进入 renderImage() imageOutput() 在示例2中,它抛出了一个“无效文件参数”错误。

带有renderText的htmlOuput

我也尝试了另一个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)

我想远离本地图片,因为一旦我们发布了闪亮的应用程序,这似乎更有意义。因此,我们真的需要一个解决方案,允许呈现URL图像,并使其可点击。如果有人能解释为什么 click = 仅适用于带有imageOutput的本地文件。

2 回复 | 直到 8 年前

José Luiz Ferreira 7 年前

一种替代方法是使用 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)

Ferroao 7 年前

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)

从URL进行渲染并可单击

可点击

URLable通过使用 renderUI()

带有renderText的htmlOuput

URLable通过使用 `renderUI()`