简体   繁体   中英

daterangeinput without fluidpage in shiny dashboard

I have an issue while creating a shiny web app using semantic.dashboard library.

Below is the code for my app.

library(semantic.dashboard)

# Define UI
header <- dashboardHeader(
)

sidebar <- dashboardSidebar(
    side = "left",
    sidebarMenu(
        menuItem(tabName = "overview", text = "Overview", icon = icon("home")),
        menuItem(tabName = "analysis", text = "Analysis", icon = icon("chart bar"))
    )
)

body <- dashboardBody(
    dateRangeInput("datepicker", NULL, start = Sys.Date()-30, end = Sys.Date()-1)
)

tabItems(
  tabItem(
    tabName = "overview",
    fluidRow(

    )
  ),
  tabItem(
    tabName = "analysis",
    fluidRow(

    )
  )
)

ui <- dashboardPage(
  header,
  sidebar,
  body,
  title = "My Dashboard",
  theme = "lumen"
)

# Define server logic
server <- function(input, output, session) {
    session$onSessionEnded(stopApp)
}

# Run the application 
shinyApp(ui = ui, server = server)

The result is in the screenshot below:

结果

The main problem is that the dates inside the daterangeinput widget are just like simple text inside textbox. I can't click on them to change the dates.

Using fluidPage() would resolve the problem, but the whole web page isn't filled totally by the app (and for this app, responsiveness isn't really useful).

Below is the screenshot of the app when I use fluidPage(), you can see that there's so much space between the sidebar and the border, and beetween the sidebar and the body.

app with fluidPage()

I'd like to know if it's possible to use daterangeinput without using fluidPage() or, if not possible, know how to remove the padding between the border and the sidebar when using fluidPage.

Thanks in advance for your help.

Above example doesn't work because it uses bootstrap framework styles - contrary to shiny.semantic or semantic.dashboard packages.

Please check my PR to shiny.semantic package. I've implemented there simple date input with usage of semantic-ui components. You can also use it to create simple date range (added quick example in PR).

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM