如何使Shiny应用程序中图像的宽度动态化?

13

我正在编写一个应用程序,希望侧边栏面板中的图像比我放在其中的图像大一点。随着窗口的缩小或扩大,侧边栏也会相应变化,但是图像保持不变。我该如何解决这个问题?是否有一种方法可以获得侧边栏长度,或者有更好的呈现图像的方法?

ui.R

library(shiny)

shinyUI(bootstrapPage(

   # Application title
   titlePanel("Sidebar Image App"),
   sidebarPanel(
      imageOutput("image", height = "auto")
   )
))

服务器.R

library(shiny)

shinyServer(function(input, output, session) {

   output$image <- renderImage({
      return(list(
         src = "one.png",
         contentType = "image/png",
         height = 185,
         alt = "Face"
      ))
   })
})
1个回答

9
您可以使用以下css标签来样式化图片:
shinyUI(bootstrapPage(
    titlePanel("Sidebar Image App"),

    tags$head(tags$style(
        type="text/css",
        "#image img {max-width: 100%; width: 100%; height: auto}"
    )),

    sidebarPanel(
        imageOutput("image")
    )
)),

在这里,CSS ID选择器(#image)应该对应于imageOutputoutputId


1
你如何添加图像源? - Johnny

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接