如何让Shiny应用程序中的图像的宽度变为动态?
我正在编写一个应用程序,并希望sidebarPanel中的图像比我放入其中的图像稍大一些。 随着窗口变得越来越小,边栏也变得越来越小,但图像保持静止。 我该如何解决这个问题? 有没有办法获得边栏的长度,或者有更好的方法来渲染图像?
ui.R
library(shiny)
shinyUI(bootstrapPage(
# Application title
titlePanel("Sidebar Image App"),
sidebarPanel(
imageOutput("image", height = "auto")
)
))
server.R
library(shiny)
shinyServer(function(input, output, session) {
output$image <- renderImage({
return(list(
src = "one.png",
contentType = "image/png",
height = 185,
alt = "Face"
))
})
})
您可以使用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
)应该对应于outputId
的imageOutput
。
上一篇: How can I make the width of an image in a Shiny app dynamic?
下一篇: How to align bootstrap dropdown and others together in a grid layout?