how to change the size of panels

3,984 views
Skip to first unread message

Xia Lu

unread,
May 21, 2013, 9:22:30 PM5/21/13
to shiny-...@googlegroups.com
I have a sidebarPanel and a mainPanel, for now the sidebar is too big while the mainPanel is too small. is there any way to adjust the sizes of these panels? thanks!

Ramnath Vaidyanathan

unread,
May 21, 2013, 9:40:30 PM5/21/13
to shiny-...@googlegroups.com
If you look at the code for sidebarPanel, you will see

sidebarPanel = function(...) {
div(class="span4",
tags$form(class="well",
...
)
)
}

The width of the panel is controlled by the class. You can create a custom version of this function that accepts a class argument, and then use it to reduce the width of the sidebar. So sidebarPanel2(..., class='span3') would give you a smaller sidebar. Note that you would also need to adjust mainPanel, if you want it to occupy the extra width created by reducing the width of the sidebar.

sidebarPanel2 = function(..., class='span4') {
div(class=class,
tags$form(class="well",
...
)
)
}

vincen...@gmail.com

unread,
May 21, 2013, 10:21:05 PM5/21/13
to shiny-...@googlegroups.com
I am not exactly sure what put in sidebarPanel 2 but ... I have this in my ui.R file:

sidebarPanel(

      tags$head(
        tags$style(type="text/css", "label.radio { display: inline-block; }", ".radio input[type=\"radio\"] { float: none; }"),
        tags$style(type="text/css", "select { max-width: 200px; }"),
        tags$style(type="text/css", "textarea { max-width: 185px; }"),
        tags$style(type="text/css", ".jslider { max-width: 200px; }"),
        tags$style(type='text/css', ".well { padding: 12px; margin-bottom: 5px; max-width: 280px; }"),
        tags$style(type='text/css', ".span4 { max-width: 280px; }")
      ),

...

Play around with the numbers and see if you get what you are looking for.

If you come up with a nice, clean, version of Ramnath's suggestion please do share on the board.

Blake Arensdorf

unread,
Nov 26, 2013, 6:41:11 PM11/26/13
to shiny-...@googlegroups.com
Can anyone point me to the actual code for sidebarPanel? I want to write my own versions (sidebarPanel2, sidebarPanel3, etc...) to make different sized panels but I can't find the actual code anywhere.

Winston Chang

unread,
Nov 26, 2013, 7:23:47 PM11/26/13
to Blake Arensdorf, shiny-...@googlegroups.com
You can just type sidebarPanel at the R console, and it'll print out the source.



--
You received this message because you are subscribed to the Google Groups "Shiny - Web Framework for R" group.
To unsubscribe from this group and stop receiving emails from it, send an email to shiny-discus...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.

Reply all
Reply to author
Forward
0 new messages