在Shiny仪表板上对齐四个元素

时间:2018-04-22 01:49:43

标签: r shiny alignment shinydashboard

我挣扎了三个元素,但解决了here

现在正在与四个元素斗争。我仍然没有看到一个简单的教程,它可以帮助我理解这个问题,并且不再打扰SO社区。

我想要什么?正确对齐四个元素。将条形图放在过滤器下面。然后它将是一个完美的对齐方式。

我的ui看起来像这样

# User interface
ui <- fluidPage(theme = shinytheme("united"),
            titlePanel(HTML("<h1><center><font size=14> Crimes in Washington, DC (2017) </font></center></h1>")),
            # titlePanel("Crimes in Washington, DC (2017)", align = "center"), 
            fluidRow(column(4, align="center", 
                            selectInput("offenceInput", "Type of Offence",
                                        choices = sort(unique(incidents$Offense)),
                                        selected = sort(unique(incidents$Offense)),
                                        multiple = TRUE),
                            selectInput("methodInput", "Method of Offence",
                                        choices = sort(unique(incidents$Method)),
                                        selected = sort(unique(incidents$Method)),
                                        multiple = TRUE),
                            selectInput("shiftInput", "Police Shift",
                                        choices = sort(unique(incidents$Shift)),
                                        selected = sort(unique(incidents$Shift)),
                                        multiple = TRUE),
                            selectInput('background', 'Background',
                                        choices = providers,
                                        multiple = FALSE,
                                        selected = 'Stamen.TonerLite'),
                            dateRangeInput('daterangeInput',
                                             label = 'Date',
                                             start = as.Date('2017-01-01') , end = as.Date('2017-12-31')
                              )
            ),

            column(8,
                   leafletOutput(outputId = 'map', height = 600, width = 800),

            column(10, plotOutput("bar"),

            column(12,
                       dataTableOutput('my_table')
            )
            )

)))

但是我的屏幕看起来很乱     Current status

1 个答案:

答案 0 :(得分:0)

与R社区一起解决。需要额外的工作,但我达到了预期的效果。

# User interface
ui <- fluidPage(theme = shinytheme("united"),
            titlePanel(HTML("<h1><center><font size=14> Crimes in Washington, DC (2017) </font></center></h1>")),
            fluidRow(column(4, align="center", 
                            selectInput("offenceInput", "Type of Offence",
                                        choices = sort(unique(incidents$Offense)),
                                        selected = sort(unique(incidents$Offense)),
                                        multiple = TRUE),
                            selectInput("methodInput", "Method of Offence",
                                        choices = sort(unique(incidents$Method)),
                                        selected = sort(unique(incidents$Method)),
                                        multiple = TRUE),
                            selectInput("shiftInput", "Police Shift",
                                        choices = sort(unique(incidents$Shift)),
                                        selected = sort(unique(incidents$Shift)),
                                        multiple = TRUE),
                            selectInput('background', 'Background',
                                        choices = providers,
                                        multiple = FALSE,
                                        selected = 'Stamen.TonerLite'),
                            dateRangeInput('daterangeInput',
                                             label = 'Date',
                                             start = as.Date('2017-01-01') , end = as.Date('2017-12-31')
                              ),
                            br(),
                            plotOutput("bar")
            ),

            column(8,
                   leafletOutput(outputId = 'map', height = 600, width = 800),

                       dataTableOutput('my_table')

            )

))

Result