Space between 2 widgets in R Shiny - r

Can someone please explain me the reason for having a big whitespace between following?
server = function(input, output){
# server code
}
ui = fluidPage(
fluidRow(
column(8, offset = 0, style='padding:0px;', # Sidebar panel
sidebarPanel(useShinyjs(),
dateRangeInput('dateRange',
label = 'Filter crimes by date',
start = as.Date('2019-01-01') , end = as.Date('2021-06-01')),
selectInput("var", label = "1. Select the quantitative Variable",
choices = c("place_of_death"=3,"Month Name"=11, "cause_of_death"=8), selected = 8),
radioButtons( "dist", "Enable or disable Grouping:",
c("Enable" = "enable",
"Disable" = "disable" ), inline=T),
selectInput("var2", label = "1. Select the quantitative Variable",
choices = c("cause_of_death"=8, "year"=7), selected = 7),
radioButtons( "CauseOfDeathRad", "Enable or disable Grouping:",
c("Covid" = "covid",
"Non-Covid" = "nonCovid" ,
"Both" = "both"), inline=T),
radioButtons( "DeathonYearRad", "Enable or disable Grouping:",
c(
"2020" = "2020" ,
"2021" = "2021",
"All" = "All"), inline=T)
)),
column(2, offset = 0, style='padding:0px;', wellPanel(p("Column width 2"))),
column(2, offset = 0, style='padding:0px;', wellPanel(p("Column width 2")))
)
)
shinyApp(ui = ui, server = server)
I need my dashboard to be equally divided among different plots. But this seems really hard to be done.
Appreciate if someone could help
PS.
When column(8,...) is set to column(3...)

My suggestion is to use the fluidRow() and column() in the mainPanel() to display the plots. Widgets for input can be kept in sidebarPanel(). Try this
server = function(input, output){
# server code
}
ui = fluidPage(
useShinyjs(),
sidebarLayout(
sidebarPanel(
dateRangeInput('dateRange',
label = 'Filter crimes by date',
start = as.Date('2019-01-01') , end = as.Date('2021-06-01')),
selectInput("var", label = "1. Select the quantitative Variable",
choices = c("place_of_death"=3,"Month Name"=11, "cause_of_death"=8), selected = 8),
radioButtons( "dist", "Enable or disable Grouping:",
c("Enable" = "enable",
"Disable" = "disable" ), inline=T),
selectInput("var2", label = "1. Select the quantitative Variable",
choices = c("cause_of_death"=8, "year"=7), selected = 7),
radioButtons( "CauseOfDeathRad", "Enable or disable Grouping:",
c("Covid" = "covid",
"Non-Covid" = "nonCovid" ,
"Both" = "both"), inline=T),
radioButtons( "DeathonYearRad", "Enable or disable Grouping:",
c(
"2020" = "2020" ,
"2021" = "2021",
"All" = "All"), inline=T)
),
mainPanel(
fluidRow(
column(5, offset = 0, style='padding:0px;', wellPanel(p("Column width 5"))),
column(5, offset = 0, style='padding:0px;', wellPanel(p("Column width 5")))
)
)
)
)
shinyApp(ui = ui, server = server)

Related

Panel output displaying on top of navbarPage and other panel output - R Shiny UI

Despite the navbarPage and tabPanel combo of a Shiny UI appearing to be straightforward, I can't for the life of me get the UI of my Shiny app to display correctly. I simply want a main tabPanel titled "Matchup Finder" that displays the dashboard I've created and then another panel titled "About" that will eventually display some html when clicked that explains what's happening on the dashboard. However, upon running, the About page contents shows up behind the output from the Matchup Finder dashboard, and there's no button for the Matchup Finder tabPanel. I've tried a variety of things (i.e., adding fluidPage, and id for the navbarPage, among others) to no avail.
ui <- navbarPage(
tabPanel("Matchup Finder",
fluidRow(
column(6,
fluidRow(
column(12,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 360px;",
fluidRow(
column(6,
radioButtons(inputId = "radio",
label = "View",
choices = list(
"By player" = 1,
"By team" = 2)),
selectInput(inputId = "off_player",
label = "Offensive player",
choices = c("Jayson Tatum"),
selectize = TRUE,
selected = c("Jayson Tatum")),
conditionalPanel(
condition = "input.radio == '1'",
selectizeInput(
inputId = "def_players",
label = "Defensive players",
choices = c("Kevin Durant", "Khris Middleton",
"Matisse Thybulle", "OG Anunoby", "Scottie Barnes"),
multiple = TRUE)),
conditionalPanel(
condition = "input.radio == '2'",
selectInput(inputId = "def_team",
label = "Defensive team",
choices = c("ATL", "CHA", "CLE"),
selectize = FALSE,
selected = c("ATL"))),
selectInput(inputId = "metrics",
label = "Select metric:",
choices = c("pts_created_per_100", "off_avg_pts_created_per_100"),
selectize = FALSE,
selected = "pts_created_per_100")),
column(6,
checkboxGroupInput(
inputId = "seasons",
label = "Select season:",
choices = c("2018", "2019", "2020", "2021", "2022"),
selected = c("2018", "2019", "2020", "2021", "2022"),
inline = TRUE),
checkboxGroupInput(inputId = "season_type",
label = "Select type:",
choices = c("playoffs", "reg"),
selected = c("playoffs", "reg"),
inline = TRUE),
sliderInput(inputId = "poss",
label = "Minimum possessions:",
0, 160, 20, step = 20)))))),
fluidRow(
column(12,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 420px;",
tabsetPanel(type = "tabs",
tabPanel("Selected", DTOutput("selected_table", width = 640)),
tabPanel("Top 5 Defenders", DTOutput("top_perf", width = 640)),
tabPanel("Most Frequent", DTOutput("top_vol", width = 640))))))),
column(6,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 795px;",
fluidRow(
column(12,
mainPanel(
plotOutput("plot1",
height = 760,
width = 620)))))))),
tabPanel("About", icon = icon("bars"),
fluidRow(
column(12,
wellPanel(
# style = "background-color: #fff; border-color: #2c3e50;",
"This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank"))))
)
Individual tabPanel tabs need to be wrapped inside a tabsetPanel (See here for an example):
library(shiny)
library(DT)
ui <- navbarPage(
tabsetPanel(
tabPanel(
"Matchup Finder",
fluidRow(
column(
6,
fluidRow(
column(
12,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 360px;",
fluidRow(
column(
6,
radioButtons(
inputId = "radio",
label = "View",
choices = list(
"By player" = 1,
"By team" = 2
)
),
selectInput(
inputId = "off_player",
label = "Offensive player",
choices = c("Jayson Tatum"),
selectize = TRUE,
selected = c("Jayson Tatum")
),
conditionalPanel(
condition = "input.radio == '1'",
selectizeInput(
inputId = "def_players",
label = "Defensive players",
choices = c(
"Kevin Durant", "Khris Middleton",
"Matisse Thybulle", "OG Anunoby", "Scottie Barnes"
),
multiple = TRUE
)
),
conditionalPanel(
condition = "input.radio == '2'",
selectInput(
inputId = "def_team",
label = "Defensive team",
choices = c("ATL", "CHA", "CLE"),
selectize = FALSE,
selected = c("ATL")
)
),
selectInput(
inputId = "metrics",
label = "Select metric:",
choices = c("pts_created_per_100", "off_avg_pts_created_per_100"),
selectize = FALSE,
selected = "pts_created_per_100"
)
),
column(
6,
checkboxGroupInput(
inputId = "seasons",
label = "Select season:",
choices = c("2018", "2019", "2020", "2021", "2022"),
selected = c("2018", "2019", "2020", "2021", "2022"),
inline = TRUE
),
checkboxGroupInput(
inputId = "season_type",
label = "Select type:",
choices = c("playoffs", "reg"),
selected = c("playoffs", "reg"),
inline = TRUE
),
sliderInput(
inputId = "poss",
label = "Minimum possessions:",
0, 160, 20, step = 20
)
)
)
)
)
),
fluidRow(
column(
12,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 420px;",
tabsetPanel(
type = "tabs",
tabPanel("Selected", DTOutput("selected_table", width = 640)),
tabPanel("Top 5 Defenders", DTOutput("top_perf", width = 640)),
tabPanel("Most Frequent", DTOutput("top_vol", width = 640))
)
)
)
)
),
column(
6,
wellPanel(
style = "background-color: ghostwhite; border-color: #2c3e50; height: 795px;",
fluidRow(
column(
12,
mainPanel(
plotOutput("plot1",
height = 760,
width = 620
)
)
)
)
)
)
)
),
tabPanel("About",
icon = icon("bars"),
fluidRow(
column(
12,
wellPanel(
# style = "background-color: #fff; border-color: #2c3e50;",
"This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank
This panel is intentionally left blankThis panel is intentionally left blank"
)
)
)
)
)
)
server <- function(input, output, session) {
}
shinyApp(ui, server)

InfoBox doesn't communicate with the Server in Shiny

I'm making a shiny dashboard. But it seems my dashboard doesn't communicate with the server when infoBoxOutput is used. It doesn't even appear. Can someone kindly look into the following code and let me know the issue here.
If I just simply use Infobox, it prints info_box1 but doesn't communicate with the server. When infoBoxOutput is used even it doesn't show up in the dashboard body.
library(shiny)
library(shinydashboard)
library(shinyjs)
source("D:/Upwork/MAL/3rd-Data Visualization/RCodes/MalServer.R")
shinyUI <-
dashboardPage( title="Demo App",
dashboardHeader(title="Covid-19 Death Analysis",dropdownMenuOutput("msgOutput")
# dropdownMenu(type="message",
# messageItem(from="Finance Update", message = "We are on threshold"),
# messageItem(from = "Sales Update", message = "Sales are at 55%", icon=icon("bar-chart") , time="22:00"),
# messageItem(from="Sales Update",message = "Sales meeting at 6 PM on Monday", icon=icon("handshake-o"),time="03-22-2021")
# )
),
dashboardSidebar( width =320,useShinyjs(),
sidebarMenu(
width = 2,
dateRangeInput('dateRange',
label = 'Filter crimes by date',
start = as.Date('2019-01-01') , end = as.Date('2021-06-01')),
selectInput("var", label = "1. Select the quantitative Variable",
choices = c("place_of_death"=3,"Month Name"=11, "cause_of_death"=8), selected = 8),
radioButtons( "dist", "Enable or disable Grouping:",
c("Enable" = "enable",
"Disable" = "disable" ), inline=T),
selectInput("var2", label = "1. Select the quantitative Variable",
choices = c("cause_of_death"=8, "year"=7), selected = 7),
radioButtons( "CauseOfDeathRad", "Enable or disable Grouping:",
c("Covid" = "covid",
"Non-Covid" = "nonCovid" ,
"Both" = "both"), inline=T),
radioButtons( "DeathonYearRad", "Enable or disable Grouping:",
c(
"2020" = "2020" ,
"2021" = "2021",
"All" = "All"), inline=T)
)),
dashboardBody(
useShinyjs(),
#Second Row:
infoBoxOutput('info_box1'),
infoBox('Loading %', '0.97%', icon = icon('percent')),
infoBox('Revenue', 'R$ 60.000,00', icon = icon('dollar-sign')),
tabsetPanel(
#tabPanel("Plot", plotOutput("myhist")) ,
tabPanel("Plot2", plotOutput("myhist2"))
)
)
)
shinyServer <- function(input, output ) {
output$info_box1 <- renderInfoBox({
infoBox("Amount in Total here", sum(mydf$Amount))
})
}
shinyApp(shinyUI,shinyServer)

Insert bspopover in Shiny

I would like to insert a bspopover next to the text: "Shapefile Import". For the Filter options I was able to insert as you can see in the code below, however for fileImput no. The executable code is below.
can anybody help me?
Thank you!
library(shinyBS)
library(shiny)
popoverTempate <-
'<div class="popover popover-lg" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
DES_filter1<-paste("Text text text text text text.", sep = "<br>")
ui <- fluidPage(
tags$head(
tags$style(HTML(".popover.popover-lg {width: 500px; max-width: 500px;}"))
),
titlePanel("Old Faithful Geyser Data"),
sidebarLayout(
sidebarPanel(
fileInput("shp", h3("Shapefile import"), multiple = TRUE, accept = c('.shp', '.dbf','.sbn', '.sbx', '.shx', '.prj')),
radioButtons(
"filter1",
h3("Select properties"),
choiceValues = c(1, 2),
choiceNames = list(
tagList(
tags$span("All properties"),
tags$span(icon("info-circle"), id = "icon1", style = "color: blue;")
),
tagList(
tags$span("Exclude properties"),
tags$span(icon("info-circle"), id = "icon2", style = "color: blue;")
)
),
selected = 1
),
bsPopover("icon1", "TITLE1", DES_filter1, placement = "right",
options = list(template = popoverTempate)),
bsPopover("icon2", "TITLE2", "CONTENT2", placement = "right"),
radioButtons("filter2", h3("Select"),
choices = list("All" = 1,
"Exclude" = 2),
selected = 1),
),
mainPanel(
)
)
)
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
You can add the icon in the fileInput title:
sidebarPanel(
fileInput("shp",
h3(
span("Shapefile import"),
span(icon("info-circle"), id = "icon3", style = "color: blue")
),
multiple = TRUE,
accept = c('.shp', '.dbf','.sbn', '.sbx', '.shx', '.prj')
),
bsPopover("icon3", "TITLE3", "CONTENT3", placement = "right"),
...

Insert warning message from selectInput option

Friends, could you help me to insert a warning message if an option is selected in selecInput. In my case, I would like it to be the case if the option "Exclude farms" is selected, a message like: Change filter options selected above. The executable code is below:
library(shinyBS)
library(shiny)
popoverTempate <-
'<div class="popover popover-lg" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content"></div></div>'
DES_filter1<-paste(".........", sep = "<br>")
ui <- fluidPage(
tags$head(
tags$style(HTML(".popover.popover-lg {width: 500px; max-width: 500px;}"))
),
titlePanel("Old Faithful Geyser Data"),
sidebarLayout(
sidebarPanel(
radioButtons(
"filter1",
h3("Select properties"),
choiceValues = c(1, 2),
choiceNames = list(
tagList(
tags$span("All properties"),
tags$span(icon("info-circle"), id = "icon1", style = "color: blue;")
),
tagList(
tags$span("Exclude properties"),
tags$span(icon("info-circle"), id = "icon2", style = "color: blue;")
)
),
selected = 1
),
bsPopover("icon1", "TITLE1", DES_filter1, placement = "right",
options = list(template = popoverTempate)),
bsPopover("icon2", "TITLE2", "CONTENT2", placement = "right"),
selectInput("filter2", h3("Select farms"),
choices = list("All farms" = 1,
"Exclude farms" = 2),
selected = 1),
),
mainPanel(
)
)
)
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
If you are open to using another package here is a shinyWidgets solution with a 'sendSweetAlert':
library(shinyWidgets)
library(shiny)
ui <- fluidPage(
titlePanel("Old Faithful Geyser Data"),
sidebarLayout(
sidebarPanel(
radioButtons(
"filter1",
h3("Select properties"),
choiceValues = c(1, 2),
choiceNames = list(
tagList(
tags$span("All properties"),
tags$span(icon("info-circle"), id = "icon1", style = "color: blue;")
),
tagList(
tags$span("Exclude properties"),
tags$span(icon("info-circle"), id = "icon2", style = "color: blue;")
)
),
selected = 1
),
selectInput("filter2", h3("Select farms"),
choices = list("All farms" = 1,
"Exclude farms" = 2),
selected = 1),
),
mainPanel(
)
)
)
server <- function(input, output, session) {
observe({
if(input$filter2 == 2){
sendSweetAlert(
session = session,
title = "Warning!",
text = "Change filter options selected above",
type = "warning"
)
}
})
}
shinyApp(ui = ui, server = server)
All is needed is to observe the selectInput value and when the input is on "Exclude farms" which has a value of 2 a warning message is sent.

How to add conditional rows which consist of few user inputs in Shiny app

I would like to show in UI only the first row (currently fluidRow) with device, color and linetype if user chooses number one, two first rows if user chooses number two and so on.
How do I add this kind of condition. I tried conditionalPanel but I failed there.
Tried to make a minimal reproducible example:
library(shiny)
shinyApp(
ui <- fluidPage(
fluidRow(
column(2, offset = 1,
selectInput(inputId = "number",
label = "Number:",
choices = list(
"One data set" = "1",
"Two data sets" = "2",
"Three data sets" = "3"))
)
),
fluidRow(
column(2,
selectInput(inputId = "dev1",
label = "Device:",
choices = list("Device 1", "Device 2"))
),
column(2,
selectInput(inputId = "col1",
label = "Color:",
choices = list("black", "red", "blue"))
),
column(2,
selectInput(inputId = "lty1",
label = "Linetype:",
choices = list("solid", "dashed"))
)
),
fluidRow(
column(2,
selectInput(inputId = "dev2",
label = "Device:",
choices = list("Device 1", "Device 2"))
),
column(2,
selectInput(inputId = "col2",
label = "Color:",
choices = list("black", "red", "blue"))
),
column(2,
selectInput(inputId = "lty3",
label = "Linetype:",
choices = list("solid", "dashed"))
)
)
),
server <- function(input, output) {})
Tell me if this needs more clarifying.
solution using server side logic, client side (JS) is also an option however this seems more natural given the platform in R and also it offers more control.
library(shiny)
library(shinyFiles)
shinyApp(
ui = fluidPage(
fluidRow(
column(2, offset = 1,
selectInput(inputId = "number",
label = "Number:",
choices = list(
"One data set" = "1",
"Two data sets" = "2",
"Three data sets" = "3"))
)
),
uiOutput('dynamic_selections')
),
server = function(input, output) {
observeEvent(input$number,{
output$dynamic_selections = renderUI({
lapply(1:as.integer(input$number),function(i){
fluidRow(
column(2,
selectInput(inputId = sprintf("dev%s",i),
label = "Device:",
choices = list("Device 1", "Device 2"))
),
column(2,
selectInput(inputId = sprintf("col%s",i),
label = "Color:",
choices = list("black", "red", "blue"))
),
column(2,
selectInput(inputId = sprintf("lty%s",i),
label = "Linetype:",
choices = list("solid", "dashed"))
),
column(2,
shinyFilesButton(id=sprintf("file%s",i), label='File:',title = 'Select File',multiple=FALSE, buttonType = "default", class = NULL)
)
)
})
})
lapply(1:as.integer(input$number),function(i){
shinyFileChoose(input, sprintf("file%s",i), roots=c(wd='.'), filetypes=c('', 'txt'))
})
})
})
EDIT: it has been highlighted that in some scenarios the file chooser box is not populated. Two things could go wrong
JS cannot read date attribute of folder/file therefore array is populated with null and errors when trying string split:
var mTime = data.files.mtime[i].split('-')
as a temp solution this can be avoided using restrictions parameter to exclude problematic folders/files?
When shinyFilesButton() is rendered via renderUI and server logic then fileChooser fails to populate but without any JS error, needs to be investigated further

Resources