R-shiny-dashboard/ui.R at main · sabberrahman/R-shiny-dashboard · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
library(shiny)
library(shinydashboard)
library(leaflet)
library(sf)
library(DT)
library(plotly)
library(bslib)


# UI
header <- dashboardHeader(title = "Map Overview")

sidebar <- dashboardSidebar(
   sidebarMenu(
     menuItem("Map View", tabName = "map", icon = icon("globe")),
     menuItem("Table", tabName = "table", icon = icon("table")),
     menuItem("Graph", tabName = "graph", icon = icon("map")),
     menuItem("source code",icon = icon("github"),href ="https://github.com/sabberrahman?tab=repositories")

   ),collapsed = FALSE
)

body <- dashboardBody(


  tags$head(
    tags$style(HTML("
      .dataTable {
        padding: 20px;
         margin-top: 20px; /* Add padding to the entire table */
      }
    "))
  ),
  tabItems(
    tabItem(
      tabName ="map",
      fluidRow(
        column(width =4 ,
          selectInput("rate",label ="Rate each year",choices =names(year_data),selected = "2024",width = 100),
          uiOutput("populationT"),
          uiOutput("rateT")
        ),
        column(width =4 ,box(title = "Top 5 Populated Districts", status = "primary",  collapsible = TRUE, solidHeader = TRUE, tableOutput("low5"),width =300)),
        column(width =4 ,box(title = "Less Populated Districts", status = "primary",  collapsible = TRUE, solidHeader = TRUE, tableOutput("top5"),width =300))
      ) ,


     fluidRow(
       column(width =8,leafletOutput("mymap",height =600 )),
       column(width =4, selectInput(
         "location",
         "Select options below:",

         choices = choics,
         selected = "Dhaka"
       ))
     ),
     fluidRow(
       class="custom-row",
       column(width =6 ,dataTableOutput("dataT")),
       column(width =6 ,plotlyOutput("barChart",height =600 ))
     )

    ),
     #tab 2
    tabItem(
      tabName ="table",
      fluidRow(
        column(
          width=12,
          dataTableOutput("tableTab")
               )
      )
    ),
    #tab 3
    tabItem(
      tabName ="graph",
      fluidRow(
        column(
          width=12,
          plotlyOutput("barchartTab",height = 700)
        )
      )
    )

  )
)

ui <- dashboardPage(header,sidebar,body)