Shiny: How to adjust the width of the tabsetPanel?
I figure it now, I inspect the html code of the app on Shiny Homepage. And the tabsetPanel is adjusted using the <div> (Document Division) tag in html by setting the option class to either span1, span2, span3 and so on. The higher the suffix of the span the larger the width of the division. And I just add div() tag in my ui.R code:
div(
tabsetPanel(
tabPanel("Plot",
plotOutput(
outputId = "histogram",
height = "400px",
width = "400px")),
tabPanel("Summary",
verbatimTextOutput(outputId = "datsummary"))
), class = "span7")
How to change tabPanel width in a shinyDashboard layout?
Please try this.
library(shiny)
library(shinydashboard)
header<-dashboardHeader(title="Shiny App")
sidebar<-dashboardSidebar()
body<-dashboardBody(
tabsetPanel(
fluidRow(
tabBox(id = "tabset1", height = "650px", width=12, title = "My Box Size", ## change box size here
tabPanel("Panel1",
fluidRow(
column(12, plotOutput("plot",height=420, width=600)) ## change plot width here
)
)
)))
)
ui<-dashboardPage(header,sidebar,body)
server<-function(input,output) {
plot1 <- qplot(rnorm(500),fill=I("red"),binwidth=0.2,title="plotgraph1")
output$plot<-renderPlot({plot1})
}
shinyApp(ui,server)
Shiny: How to increase the width of tabsetPanel to cover the whole area to the right of the sidebarPanel?
Edit: Sorry for not checking my first answer. But here is something that works:
For some reason, plotOutput is broken in the sense that height = "100%" does not work, otherwise that would be a solution. But you can add css3 by hand which scales your plot according to window size with ...vh.
Code:
library(shiny)
library(ggplot2)
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
h1("Shiny app"),
tags$hr(),
h2("several options here"),
width =2),
mainPanel(
uiOutput("tb")
)
)
)
server <- function(input,output, session){
output$diamonds1 <- renderPlot({
ggplot(diamonds, aes(x=carat, y=price, col=clarity)) +
geom_point(alpha=0.5)+ facet_wrap(~color, scales="free")
})
output$diamonds2 <- renderPlot({
ggplot(diamonds, aes(x=carat, y=price, col=clarity)) +
geom_point(alpha=0.5)+ facet_wrap(~cut, scales="free")
})
output$info <- renderPrint({
nearPoints(diamonds, input$plot_click, threshold = 10, maxpoints = 1,
addDist = TRUE)
})
output$tb <- renderUI({
tabsetPanel(
tabPanel("First plot",
tags$head(tags$style(type = "text/css", "#diamonds1 {height:95vh !important;}")),
plotOutput("diamonds1")),
tabPanel("Second plot",
tags$head(tags$style(type = "text/css", "#diamonds2 {height:80vh !important;}")),
plotOutput("diamonds2", click = "plot_click"),
verbatimTextOutput("info")))
})
}
shinyApp(ui = ui, server = server)
I admit, it's more of a workaround.
Adjusting width of tabPanel titles with R Shiny
I'm not great at CSS but this should give you (or another contributor) a start. The issue I'm facing is a phantom tab appears in the front of the header and it doesn't resize correctly if you make your screen very narrow (does to a certain point and then fails).
Hope this helps!
library(shiny)
ui <- fluidPage(
tabsetPanel(
tags$head(tags$style(HTML('
/* HEADER */
.nav>li>a {
padding: 1vh 8vw;;
}'
))),
tabPanel("Title1", tags$h1("text")),
tabPanel("Title2", tags$h1("text")),
tabPanel("Title3", tags$h1("text")),
tabPanel("Title4", tags$h1("text"))
)
)
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)
Shiny tabsetPanel take full width
The link you posted makes sense and is probably a better way of doing it. We could make a custom widget to perform this. For now, here is a workaround using some simple css.
The CSS Selector here is very general, you should probably be more specific but here is an idea.
library(shiny)
ui <- fluidPage(
tags$head(
tags$style(HTML("
.nav li {
width: 32vw;
}
"))),
tabsetPanel(id = "tab_panel",
tabPanel("Tab 1"),
tabPanel("Tab 2"),
tabPanel("Tab 3")
)
)
server <- function(input, output, session) {}
shinyApp(ui, server)
Adjust tabPanel in Shiny
Try this:
column(8, "",
tabsetPanel(
tabPanel("Output1", plotOutput("graph",width = "100%", height = "600")),
tabPanel("Output2",uiOutput('daterange')),
tabPanel("Output3")
)
)
TabsetPanel not filling whole page in Shiny
Here is one that spans over the whole width:
library(shiny)
ui <- fluidPage(
titlePanel("Title"),
tabsetPanel(
tabPanel(
"Test",
sidebarLayout(
sidebarPanel(
sliderInput("bins", "Number of bins:", min = 1, max = 50, value = 30)
),
mainPanel(
plotOutput("distPlot")
)
)
),
tabPanel("Second Test", h3("Test"))
)
)
server <- function(input, output) {
output$distPlot <- renderPlot({
x <- faithful[, 2]
bins <- seq(min(x), max(x), length.out = input$bins + 1)
hist(x, breaks = bins, col = 'darkgray', border = 'white')
})
{ "example second tab" }
}
shinyApp(ui = ui, server = server)
Basically you had a mainPanel wrapped around the tabsetPanel. Without it everything looks fine.
Shiny Module app displays tabpanel outside the box layout. Need to resize the tabpanel
Adding the fluidpage() and fluidrow() in the master module got the tabs to align.
medical_history_UI <- function(id) {
ns <- NS(id)
fluidPage(
fluidRow(
box(
h3("Previously Diagnosed Patients", align = "center"),
h4(textOutput(ns("mh_prev_truven_total_projected")), align = "center"),
h4(textOutput(ns("mh_prev_truven_total_observed")), align = "center"),
width = 6
),
box(
h3("Newly Diagnosed Patients", align = "center"),
h4(textOutput(ns("mh_inc_truven_total_projected")), align = "center"),
h4(textOutput(ns("mh_inc_truven_total_observed")), align = "center"),
width = 6
),
astellasTabsetPanel(
type = "pills",
id = "med_history",
# Drug Panel
drug_history_UI(ns("drug_history")),
# Condition Panel
condition_UI(ns("condition_history")),
# Procedure Panel
procedure_UI(ns("procedure_history")),
# Charlson Comorbidity Panel
CCI_UI(ns("CCI")),
tags$head(
tags$script(
'
var dimension = [0, 0];
$(document).on("shiny:connected", function(e) {
dimension[0] = window.innerWidth;
dimension[1] = window.innerHeight;
Shiny.onInputChange("dimension", dimension);
});
$(window).resize(function(e) {
dimension[0] = window.innerWidth;
dimension[1] = window.innerHeight;
Shiny.onInputChange("dimension", dimension);
});
'
)
)
)))
}
Width issue with the tabsetPanel function of the package shiny
To remove the space you can remove the tabsetPanel from your ui code:
The modification in your ui code will be something like this:
ui <- fluidPage(
tabBox(width = 12,title="Title",
# tabsetPanel(id = "AB",
tabPanel(
value = "A",
title = span(icon("lightbulb-o"), HTML(' '), strong("A"), style="color:#FE5815;")
),
tabPanel(
value = "B",
title = span(icon("fire-o"), HTML(' '), strong("B"), style="color:#FE5815;")
)
# )
)
)
With this modification you will get output which looks like this:
EDIT:
Instead of having tabsetPanel you can change the title based on id of tabBox. Have a look at this code:
library(shiny)
library(shinydashboard)
ui <- fluidPage(
tabBox(width = 12,title=htmlOutput('Date_Panel'), id = "AB",
# tabsetPanel(id = "AB",
tabPanel(
value = "A",
title = span(icon("lightbulb-o"), HTML(' '), strong("A"), style="color:#FE5815;")
),
tabPanel(
value = "B",
title = span(icon("fire-o"), HTML(' '), strong("B"), style="color:#FE5815;")
)
# )
)
)
server <- function(input, output, session) {
output$Date_Panel <- renderText(if(input$AB=='A'){
text='title_A'
}
else{
text='title_B'
}
)
}
shinyApp(ui, server)
With this you get the desired output.
Hope it helps!
Related Topics
Remove Plot Margins in Ggplot2
Package 'Stringi' Does Not Work After Updating to R3.2.1
How to Set Attributes for a Variable in R
Shiny Selectinput to Select All from Dropdown
Apply Over Matrix by Column - Any Way to Get Column Name
R List Get First Item of Each Element
How to Change the Position of the Table of Contents in Rmarkdown
How to Align a Group of Checkboxgroupinput in R Shiny
R Shiny Checkboxgroupinput - Select All Checkboxes by Click
Finding the Bounding Box of Plotted Text
Generate a Repeating Sequence Based on Vector
How to Avoid Using Round() in Every \Sexpr{}