【问题标题】:Different backgrounds on shinydashboard tabs闪亮仪表板选项卡上的不同背景
【发布时间】:2021-07-01 11:17:16
【问题描述】:

我想创建一个闪亮的仪表板,其中第一个选项卡的背景包含一张图片,存储在本地,其余选项卡包含纯白色背景。

我尝试从here 修改代码以显示图像而不是颜色:

library(shiny)
library(shinydashboard)
ui <- dashboardPage(dashboardHeader(dropdownMenuOutput("notificationMenu")
                                    ), 
                    dashboardSidebar(sidebarMenu(id='sidebar',
                                                 menuItem("Page 1", tabName = "page1"),
                                                 menuItem("Page 2", tabName = "page2")
                                                 ),
                                     uiOutput('style_tag')
                                     ),
                    dashboardBody(
                      tabItems(
                        tabItem(tabName = "page1", h4("Picture!",style='color:black')),
                        tabItem(tabName = "page2", h4('white!')
                                )
                        )
                      )
                    )

server <- function(input, output, session){
  
  output$style_tag <- renderUI({
    if(input$sidebar=='page1')
      return(tags$head(tags$style(HTML('.content-wrapper {
                                             background-image:url("~/www/background.jpg") fixed center;
                                             }')
                                  )
                       )
             )
    
    if(input$sidebar=='page2')
      return(tags$head(tags$style(HTML('.content-wrapper {background-color:white;}')
                                  )
                       )
             )
  })
}

shinyApp(ui = ui, server = server)

但是,它不起作用。我在 CSS 位中做错了吗?有没有更好的方法来实现同样的目标?

【问题讨论】:

    标签: r shiny shinydashboard


    【解决方案1】:

    您的路径是从您的 R 工作目录的角度来看的。它需要从浏览器的角度来看。更改此 CSS:

    background-image:url("background.jpg")
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-07-01
      • 1970-01-01
      • 1970-01-01
      • 2021-10-06
      • 2016-11-24
      • 1970-01-01
      相关资源
      最近更新 更多