Shiny - Adjust width of sidebarPanel() relative to mainPanel() - r

I have the following segment of code which works as part of my shiny UI:
fluidPage(
titlePanel("Complaints this month"),
tabsetPanel(
tabPanel(
"Opened",
sidebarLayout(
sidebarPanel(
sliderInput('sampleSize', 'Sample Size', min = 1, max = nrow(ThisMonthCreated),
value = 1000, step = 500, round = 0),
selectInput('Openedx', 'X', choices = nms1, selected = "ActualDateCreated"),
selectInput('Openedy', 'Y', choices = nms1, selected = "TimeToAcknowledge"),
selectInput('Openedcolor', 'Color', choices = nms1, selected = "SimpleBusinessArea"),
selectInput('Openedfacet_row', 'Facet Row', c(None = '.', nms1), selected = "none"),
selectInput('Openedfacet_col', 'Facet Column', c(None = '.', nms1)),
sliderInput('OpenedHeight', 'Height of plot (in pixels)',
min = 100, max = 2000, value = 680)
),
mainPanel(
plotlyOutput("Open", height = "600px")
)
)
)
)
)
)
I tried to adjust the sidebarpanel by messing with the width of the stuff within it but of course that doesn't affect the actual width of the sidebarpanel. It only affects the size of the specific things inside, so it doesn't provide the desired outcome:
sidebarLayout(
sidebarPanel(
sliderInput('sampleSize', 'Sample Size', min = 1, max = nrow(ThisMonthCreated),
value = 1000, step = 500, round = 0, width = "50%"),
selectInput('Openedx', 'X', choices = nms1, selected = "ActualDateCreated", width = "50%"),
selectInput('Openedy', 'Y', choices = nms1, selected = "TimeToAcknowledge", width = "50%"),
selectInput('Openedcolor', 'Color', choices = nms1, selected = "SimpleBusinessArea", width = "50%"),
selectInput('Openedfacet_row', 'Facet Row', c(None = '.', nms1), selected = "none", width = "50%"),
selectInput('Openedfacet_col', 'Facet Column', c(None = '.', nms1), width = "50%"),
sliderInput('OpenedHeight', 'Height of plot (in pixels)',
min = 100, max = 2000, value = 680, width = "50%")
),
mainPanel(
plotlyOutput("Open", height = "600px")
)
)
I want it so that the sidebar panel is 1/3 (I may wan't to adjust this depending on how it looks) of the main panel. Would this be doable or would I have to provide specific width arguments (e.g 1000px) for both panels in each tab I make?
Thanks in advance

Simple sidebarPanel(..., width = 2) worked for me as shown in the R document.

Related

Aligning verbatim text output to text input in fluidrow - R Shiny

I am trying to display some input field alongside some output field inputted from another tab. However the output field is going below and cannot align with the rest.
Code given below:-
fluidRow(
column(3, sliderInput(inputId = "avg_planned_miles", label = "Average Planner Miles", min = 5, max = 50, value = 9, step = 0.1)),
column(3, textInput(inputId = "batch_pct", label = "Batch %", value = "0.5")),
column(3, h4("Volume: "), verbatimTextOutput(outputId = "planner_volume"))
)
Try this code, it looks better to me
fluidRow(
column(3,
tagList(
tags$style(type = 'text/css','#avg_planned_miles .irs-grid-text {font-size: 12px}'), #the grid numbers size
div(id = 'avg_planned_miles', style='font-size: 16px;', #label font size
sliderInput(inputId = "avg_planned_miles", label = "Average Planner Miles\n", min = 5, max = 50, value = 9, step = 0.1)
)#div
)#tags
),
column(3,
tagList(
div(id = 'batch_pct',
style='position:absolute; top:10px; right:5px;', #add margin space
textInput(inputId = "batch_pct", width = 280,
label = "Batch%", value = "0.5")
)
)
),
column(3, p(strong("Volume")), #bold font to match the other fields
verbatimTextOutput(outputId = "planner_volume", placeholder = 1)
),
)
You can keep the sliderInput as it is in your code, I thought if the font sizes are bigger it looks better.

How can I make the TopNav in a Shiny dashboard not overlap with the sidebar?

I have a shiny dashboard with many tabs - now there are enough tabs that when the window size is small enough, the tabs wrap into a second row. For some reason, this second row overlaps the content of my sidebar, but the content in my main panel adjusts to accomodate the navbar's new size.
ui11 <- shinyUI(navbarPage("Beasts of Bellevue",
tabPanel("Head to Head", fluid = TRUE,
useShinydashboard(),
dashboardSidebar(
sidebarMenu(),
# Select variable for left plot
selectInput(inputId = "left",
label = "Manager 1:",
choices = c("Kevin", "Jake", "Lyons",
"Nipples", "Dan", "Shuds",
"Karp", "Mills", "Joey",
"Raffy", "Oster", "Scott", "Sam"),
selected = "Kevin"),
# Select variable for right plot
selectInput(inputId = "right",
label = "Manager 2:",
choices = c("Kevin", "Jake", "Lyons",
"Nipples", "Dan", "Shuds",
"Karp", "Mills", "Joey",
"Raffy", "Oster", "Scott", "Sam"),
selected = "Lyons"),
# Select which game type to include
checkboxGroupInput(inputId = "selected_gametype",
label = "Select game type(s):",
choices = c("Regular Season", "Playoffs", "Consolation"),
selected = c("Regular Season", "Playoffs", "Consolation")),
# Select which seasons to include
sliderInput(inputId = "slider",
label = "Seasons",
min = 2012,
max = max(h2h$Year),
value = c(2012, max(h2h$Year)),
sep = "",
ticks = FALSE,
dragRange = TRUE),
br(),
tags$img(src = "bob.png", height = 225, width = 225)),
#Header
header <- dashboardHeader(
disable = TRUE
),
mainPanel(width = 12,
dashboardBody(tags$head(tags$meta(name = "viewport", content = "width=1600")),
shinyDashboardThemes(
theme = "grey_light"
),
fluidRow(
# Row 1, Column 1
column(width = 6,
h3(textOutput("left"))
),
#Row 1, Column 2
column(width = 6,
h3(textOutput("right"))
)
),
fluidRow(
# Row 2, Column 1
column(width = 6,
withLoader(valueBoxOutput(
outputId = "leftnumber",
width = NULL), type = "html", loader = "loader7")),
# Row 2, Column 2
column(width = 6,
valueBoxOutput(
outputId = "rightnumber",
width = NULL))
),
fluidRow(
column(width = 12,
valueBoxOutput(
outputId = "leftnumberavg",
width = 2),
valueBoxOutput(
outputId = "leftnumberavg2",
width = 2),
valueBoxOutput(
outputId = "leftmargofvic",
width = 2),
valueBoxOutput(
outputId = "rightnumberavg",
width = 2),
valueBoxOutput(
outputId = "rightnumberavg2",
width = 2),
valueBoxOutput(
outputId = "rightmargofvic",
width = 2))
),
plotlyOutput(outputId = "plot")
)
)
)))
Here is an image of how the issue renders: Overlapping navbar

How can I increase size of plotted area in wordcloud R (borders,as some of words are cut)

I use Shiny dashboard and output of is in dashboardBody( box ( Output
dashboardPage(skin = "blue",
dashboardHeader(title = "Word Cloud",titleWidth = 320),
dashboardSidebar(tags$style(HTML(".main-sidebar{width: 320px;}")),
sidebarMenu(
menuItem("Type",startExpanded = TRUE,
selectInput("selection", "Please, Choose Type:",
choices = books),
actionButton("update", "Change"),
hr()
),
menuItem("Frequency",startExpanded = TRUE,
sliderInput("freq",
"Please, choose Frequency:",
min = 100, max = 1000, value = 20,step=50)
),
menuItem("Number of Words",startExpanded = TRUE,
sliderInput("max",
"Please choose Number of Words:",
min = 10, max = 300, value = 70,step=10)
)
)
),
###My outPut
dashboardBody(
fluidRow(
box(width=12,height = 12,background="yellow",collapsible = TRUE,res = 300,
plotOutput("plot")
)
)
)
)[enter image description here][1]
[1]: https://i.stack.imgur.com/IogCV.jpg
dashboardBody(
fluidRow(
box(width=12,height = 12,background="yellow",collapsible = TRUE,res = 300,
plotOutput("plot")
)
dashboardBody(
fluidRow(
box(width=12,height = 12,background="yellow",collapsible = TRUE,res = 300,
plotOutput("plot")
)
How can I increase size of plotted area in wordcloud R (borders,as some of words are cut)

Arrange R shiny Side bar objects

I have created the following interface using R shiny.
library(shiny)
ui <- fluidPage(
#Can be fluid row also
fluidRow(
column(3,
h3("Excel DB"),
hr(),
fileInput("file1", "Excel DB",
multiple = TRUE,
accept = c("text/csv/xlsx/xls",
"text/comma-separated-values,text/plain",
".csv", ".xls", ".xlsx")),
textInput(inputId = 'Type',label = 'Type'),
textInput(inputId = 'Client',label = 'Client'),
textInput(inputId = "Task", label = "Task"),
actionButton(inputId = "ClearAll", label = "Clear Screen"),
radioButtons("dist", "Vertical Axis Scale",
c("Linear" = "Linear Regression",
"Log" = "Logistic Regression"))
),
column(5,h5(' '),
hr(), downloadButton(outputId = "Downloaddata", label = "Fetch Dataset"),
textInput(inputId = "Commodity", label = "Commodity"),
textInput(inputId = "Year", label = "Year"),
radioButtons("dist", "Horizontal Axis Scale",
c("Linear" = "Linear Regression",
"Log" = "Logistic Regression")),
numericInput(inputId = "Numberinput", label = "Numinput", min = -1000000000, max = 1000000000, value = 0,step = 1)
)
), sliderInput(inputId = "Scale", label = "Scale", min = 0, max = 100, step
= 2.5, value = 1)
)
I have created the following empty server
server<-function(input, output){}
shinyApp(ui, server)
The above code creates a shiny application with a sidebar panel having two columns. However, the 2 columns are not aligned with each other. I would like to know how to arrange the components of the app as follows.
The fetch dataset button should be along the browse button. Similarly the commodity text box should be next to type text box and the year box should come near the client. The two sets of radio buttons should align with each other. I request some help here. Am unable to arrange them in that pattern
To achieve this you need to do some nesting of column() and fluidRow(). This answer should explain enough to get you started, along with the examples on Shiny's layout guide. I believe the following should get you roughly what you want:
library(shiny)
ui <- fluidPage(
#Can be fluid row also
h3("Excel DB"),
hr(),
fluidRow(
column(12,
fluidRow(
column(3,
fileInput("file1", NULL,
multiple = TRUE,
accept = c("text/csv/xlsx/xls",
"text/comma-separated-values,text/plain",
".csv", ".xls", ".xlsx"))),
column(5,
column(3,
downloadButton(outputId = "Downloaddata", label = "Fetch Dataset")),
column(2, offset = 2,
actionButton(inputId = "ClearAll", label = "Clear Screen"))
)
),
fluidRow(
column(3,
textInput(inputId = 'Type',label = 'Type'),
textInput(inputId = 'Client',label = 'Client'),
textInput(inputId = "Task", label = "Task")
),
column(5,
textInput(inputId = "Commodity", label = "Commodity"),
textInput(inputId = "Year", label = "Year"),
numericInput(inputId = "Numberinput", label = "Numinput", min = -1000000000, max = 1000000000, value = 0,step = 1)
)),
fluidRow(
column(3,
radioButtons("dist", "Vertical Axis Scale",
c("Linear" = "Linear Regression",
"Log" = "Logistic Regression"))),
column(5,
radioButtons("dist", "Horizontal Axis Scale",
c("Linear" = "Linear Regression",
"Log" = "Logistic Regression")))
),
fluidRow(
column(5,
sliderInput(inputId = "Scale", label = "Scale", min = 0, max = 100,
step = 2.5, value = 1))
)
)
)
)
Created on 2018-09-20 by the reprex package (v0.2.1)

Shiny - align plots axis

I have a shiny app that have 2 bar charts and one heat chart, they have the same x axis (year), I want the years to be aligned in all the plots, but I don't know how to do it. below is my UI code:
ui = fluidPage(
titlePanel("Global Terrorism, is it getting worse?"),
tabsetPanel(
tabPanel("Plot", fluid = TRUE,
sidebarLayout(
sidebarPanel(radioButtons(
inputId="radio",
label="Variable Selection Type:",
choices=list(
"All Countries",
"Select a Country"
),
selected="All Countries")
,conditionalPanel(
condition = "input.radio != 'All Countries'",
selectInput("Country", "Select Country", choices = sort(unique(mydat$Country)), selected = "Iraq"),
sliderInput("freq", "Minimum Frequency:",min = 1, max = 50, value = 15),
sliderInput("max", "Maximum Number of Words:", min = 1, max = 100, value = 100)
), width=2),
mainPanel(fluidRow(
column(8, plotlyOutput("trendbarPlot", height = "200px",width = 845)),
column(8, plotlyOutput("trendheatrPlot", height = "300px",width = 845)),
column(2, plotOutput("WordCloud", height = "200px",width = 400)),
column(8, plotlyOutput("trendstakbarPlot", height = "200px",width = 895))
)
)
)
),
tabPanel("Map", fluid = TRUE,
sidebarLayout(
sidebarPanel(sliderInput("year", "Select Year:", min = 1968, max = 2009, value = 2009, sep='')),
mainPanel(
htmlOutput("Attacks")
)
)
)
)

Resources