data_bars: Add horizontal bars to cells in a column
In reactablefmtr: Streamlined Table Styling and Formatting for Reactable
data_bars R Documentation
Add horizontal bars to cells in a column
Description
The 'data_bars()' function adds a horizontal bar to each row of a column.
The length of the bars are relative to the value of the row in relation to other values within the same column.
The maximum width of the filled bars can be adjusted. Ex. if you are displaying percentages,
and the maximum value in your column is 50
you could increase the maximum fill to 100
The values for the bars can be displayed inside or outside the filled bars with the 'text_position' option.
By default, the values are displayed on the outside-end of the filled bars.
The fill_color of both the fill and the background of the bars can be adjusted.
To adjust the fill_color of the filled bar, use 'fill_color'.
If more than one color is provided, a conditional color palette will be applied to to the values,
or if 'fill_gradient' is set to TRUE, a left-to-right gradient fill color will be applied.
The fill colors can also be provided via another column in the dataset by referencing the column by name with 'fill_color_ref'.
'text_color' can be used to change the color of the text_position. By default, the label color is black.
If values are displayed inside the bars and a dark color palette is used to fill the bars,
'brighten_text' will display the values in white text so the values are visible by default.
The color of 'brighten_text_color' can be changed to a color other than white if desired.
The border around the filled bars can be controlled via three different border options:
'border_style', 'border_width', and 'border_color'.
An icon or image can be added to the data bars with 'icon' or 'img'.
Alternatively, icons and images can be assigned from another column with 'icon_ref' and 'img_ref', similar to 'fill_color_ref'.
The color of the icons can be assigned through either 'icon_color' (a single color) or 'icon_color_ref' (from another column).
The size of the images can be adjusted using 'img_height' and 'img_width'.
The size of the icons can be adjusted using 'icon_size'.
'data_bars()' works with columns containing both positive and negative values.
It should be placed within the cell argument in reactable::colDef.
Usage
data_bars(
data,
text_position = "inside-end",
fill_color = "#15607A",
fill_color_ref = NULL,
fill_by = NULL,
fill_opacity = 1,
fill_gradient = FALSE,
background = "#EEEEEE",
number_fmt = NULL,
bias = 1,
min_value = NULL,
max_value = NULL,
align_bars = "left",
bar_height = NULL,
force_outside = NULL,
text_color = "black",
text_color_ref = NULL,
text_size = NULL,
brighten_text = TRUE,
brighten_text_color = "white",
bold_text = FALSE,
border_width = NULL,
border_style = NULL,
border_color = NULL,
icon = NULL,
icon_ref = NULL,
icon_size = 20,
icon_color = NULL,
icon_color_ref = NULL,
img = NULL,
img_ref = NULL,
img_height = 20,
img_width = 20,
box_shadow = FALSE,
round_edges = FALSE,
tooltip = FALSE,
animation = "width 1s ease"
)
Arguments
data
Dataset containing at least one numeric column.
text_position
Choose where to display the text labels relative to the filled data bars.
Text labels can be displayed within the filled bars ("inside-end" or "inside-base"),
outside of the filled bars ("outside-end" or "outside-base"),
within the center of the filled bars ("center"),
above the filled bars ("above"),
or not displayed at all ("none").
Default is inside-end.
fill_color
A single color or a vector of fill_color for the fill of the data bars.
fill_color should be given in order from low values to high values.
Can use R's built-in fill_color or other color packages.
Default is #15607A.
fill_color_ref
Optionally assign fill_color to from another column
by providing the name of the column containing the fill colors in quotes.
Only one color can be provided per row, and therefore will not work with fill_gradient.
Default is NULL.
fill_by
Assign data bars to a column based on the values of another column.
The column in reference must contain numeric data.
The column in which the colors are being assigned to can be either numerical or character.
Default is NULL.
fill_opacity
A value between 0 and 1 that adjusts the opacity in fill_color.
A value of 0 is fully transparent, a value of 1 is fully opaque.
Default is 1.
fill_gradient
Logical: if two or more colors are provided in fill_color,
the colors in the fill of the bars are converted to a left-to-right gradient.
Default is FALSE.
background
The color for the background of the data bars.
Default is #EEEEEE.
number_fmt
Optionally format numbers using formats from the scales package.
Default is NULL.
bias
A positive value that determines the spacing between multiple colors.
A higher value spaces out the colors at the higher end more than a lower number.
Default is 1.
min_value
A value to use as the minimum value for the width of the filled bars.
Default is NULL.
max_value
A value to use as the maximum value for the width of the filled bars.
The default maximum value is the maximum value in the column.
Default is NULL.
align_bars
Display filled bars from left-to-right or right-to-left.
Options are "left" or "right".
Default is left.
bar_height
Numeric height of the data bars in px.
Default is NULL.
force_outside
Optionally force a range of values to display their text labels on the outside-end of the filled bars
when the text_position is set to either "inside-end", "inside-base", or "center".
Must provide a start and a stop number for the range of values to be forced to outside-end. Ex. c(0, 100).
Default is NULL.
text_color
The color of the text labels.
Default is black.
text_color_ref
Optionally assign text color from another column
by providing the name of the column containing the text colors in quotes.
Only one color can be provided per cell.
Default is NULL.
text_size
Numeric value representing the size of the text labels.
Default is NULL.
brighten_text
Logical: automatically assign color to text labels based on filled color
when the text labels are positioned within the filled bars.
Text within dark-colored filled bars will turn white, text within light-colored bars will be black.
Default is TRUE.
brighten_text_color
Assigns color to text labels if values are within a dark-colored filled bar.
Default is white.
bold_text
Logical: display the text labels in bold.
Default is FALSE.
border_width
The width of the border around the filled data bars
Options are "thin", "medium", "thick", or a numeric value with the units included such as "2px" or "2mm".
May be specified using one, two, three, or four values.
See [CSS border-width](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width) for more options.
Default is NULL.
border_style
The style of the border around the filled data bars
Options are "solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", or "hidden".
May be specified using one, two, three, or four values.
See [CSS border-style](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style) for more options.
Default is NULL.
border_color
The color of the border around the filled data bars
May be specified using one, two, three, or four values.
See [CSS border-color](https://developer.mozilla.org/en-US/docs/Web/CSS/border-color) for more options.
Default is NULL.
icon
Assign an icon label from the Font Awesome library (via shiny).
If an icon is provided, it will be positioned so that it does not overlap the text for the data bars.
Default is NULL.
icon_ref
Optionally assign icons from another column
by providing the name of the column containing the icons in quotes.
Only one icon can be provided per cell.
Default is NULL.
icon_size
A value representing the size of the icon in px.
Default is 20.
icon_color
The color for the icon.
If no color is provided, default is set to the color of the filled bars.
Default is NULL.
icon_color_ref
Optionally assign color to the icons from another column
by providing the name of the column containing the icon colors in quotes.
Only one color can be provided per cell.
Default is NULL.
img
Optionally assign an image label via a valid URL.
img_ref
Optionally assign images from another column
by providing the name of the column containing the image URLs in quotes.
Only one image can be provided per cell.
Default is NULL.
img_height
A value for the height of the image in px.
Default is 20.
img_width
A value for the width of the image in px.
Default is 20.
box_shadow
Logical: add a box shadow to the bars.
Default is FALSE.
round_edges
Logical: round the edges around the data bars.
Default is FALSE.
tooltip
Logical: hover tooltip.
Default is FALSE.
animation
Control the duration and timing function of the animation
when sorting/updating values shown on a page.
See [CSS transitions](https://developer.mozilla.org/en-US/docs/Web/CSS/transition)
for available timing functions and examples.
Animation can be turned off by setting to "none".
Default is "width 1s ease".
Value
a function that applies data bars
to a column of numeric values.
Examples
data <- MASS::Cars93[20:49, c("Make", "MPG.city", "MPG.highway")]
## By default, data bars are aligned left and text_position are placed on the inside end
reactable(data,
defaultColDef = colDef(
cell = data_bars(data)))
## Align the bars to the right
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
align_bars = "right")))
## Move the text labels outside of the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
text_position = "outside-end")))
## Apply multiple fill_color to the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
fill_color = c("lightblue","royalblue","navy"))))
## Apply a fill_gradient pattern to the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
fill_color = c("lightblue","royalblue","navy"),
fill_gradient = TRUE,
text_position = "outside-end")))
reactablefmtr documentation built on March 18, 2022, 5:08 p.m.
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
| data_bars | R Documentation |
Add horizontal bars to cells in a column
Description
The 'data_bars()' function adds a horizontal bar to each row of a column. The length of the bars are relative to the value of the row in relation to other values within the same column. The maximum width of the filled bars can be adjusted. Ex. if you are displaying percentages, and the maximum value in your column is 50 you could increase the maximum fill to 100 The values for the bars can be displayed inside or outside the filled bars with the 'text_position' option. By default, the values are displayed on the outside-end of the filled bars. The fill_color of both the fill and the background of the bars can be adjusted. To adjust the fill_color of the filled bar, use 'fill_color'. If more than one color is provided, a conditional color palette will be applied to to the values, or if 'fill_gradient' is set to TRUE, a left-to-right gradient fill color will be applied. The fill colors can also be provided via another column in the dataset by referencing the column by name with 'fill_color_ref'. 'text_color' can be used to change the color of the text_position. By default, the label color is black. If values are displayed inside the bars and a dark color palette is used to fill the bars, 'brighten_text' will display the values in white text so the values are visible by default. The color of 'brighten_text_color' can be changed to a color other than white if desired. The border around the filled bars can be controlled via three different border options: 'border_style', 'border_width', and 'border_color'. An icon or image can be added to the data bars with 'icon' or 'img'. Alternatively, icons and images can be assigned from another column with 'icon_ref' and 'img_ref', similar to 'fill_color_ref'. The color of the icons can be assigned through either 'icon_color' (a single color) or 'icon_color_ref' (from another column). The size of the images can be adjusted using 'img_height' and 'img_width'. The size of the icons can be adjusted using 'icon_size'. 'data_bars()' works with columns containing both positive and negative values. It should be placed within the cell argument in reactable::colDef.
Usage
data_bars( data, text_position = "inside-end", fill_color = "#15607A", fill_color_ref = NULL, fill_by = NULL, fill_opacity = 1, fill_gradient = FALSE, background = "#EEEEEE", number_fmt = NULL, bias = 1, min_value = NULL, max_value = NULL, align_bars = "left", bar_height = NULL, force_outside = NULL, text_color = "black", text_color_ref = NULL, text_size = NULL, brighten_text = TRUE, brighten_text_color = "white", bold_text = FALSE, border_width = NULL, border_style = NULL, border_color = NULL, icon = NULL, icon_ref = NULL, icon_size = 20, icon_color = NULL, icon_color_ref = NULL, img = NULL, img_ref = NULL, img_height = 20, img_width = 20, box_shadow = FALSE, round_edges = FALSE, tooltip = FALSE, animation = "width 1s ease" )
Arguments
data |
Dataset containing at least one numeric column. |
text_position |
Choose where to display the text labels relative to the filled data bars. Text labels can be displayed within the filled bars ("inside-end" or "inside-base"), outside of the filled bars ("outside-end" or "outside-base"), within the center of the filled bars ("center"), above the filled bars ("above"), or not displayed at all ("none"). Default is inside-end. |
fill_color |
A single color or a vector of fill_color for the fill of the data bars. fill_color should be given in order from low values to high values. Can use R's built-in fill_color or other color packages. Default is #15607A. |
fill_color_ref |
Optionally assign fill_color to from another column by providing the name of the column containing the fill colors in quotes. Only one color can be provided per row, and therefore will not work with fill_gradient. Default is NULL. |
fill_by |
Assign data bars to a column based on the values of another column. The column in reference must contain numeric data. The column in which the colors are being assigned to can be either numerical or character. Default is NULL. |
fill_opacity |
A value between 0 and 1 that adjusts the opacity in fill_color. A value of 0 is fully transparent, a value of 1 is fully opaque. Default is 1. |
fill_gradient |
Logical: if two or more colors are provided in fill_color, the colors in the fill of the bars are converted to a left-to-right gradient. Default is FALSE. |
background |
The color for the background of the data bars. Default is #EEEEEE. |
number_fmt |
Optionally format numbers using formats from the scales package. Default is NULL. |
bias |
A positive value that determines the spacing between multiple colors. A higher value spaces out the colors at the higher end more than a lower number. Default is 1. |
min_value |
A value to use as the minimum value for the width of the filled bars. Default is NULL. |
max_value |
A value to use as the maximum value for the width of the filled bars. The default maximum value is the maximum value in the column. Default is NULL. |
align_bars |
Display filled bars from left-to-right or right-to-left. Options are "left" or "right". Default is left. |
bar_height |
Numeric height of the data bars in px. Default is NULL. |
force_outside |
Optionally force a range of values to display their text labels on the outside-end of the filled bars when the text_position is set to either "inside-end", "inside-base", or "center". Must provide a start and a stop number for the range of values to be forced to outside-end. Ex. c(0, 100). Default is NULL. |
text_color |
The color of the text labels. Default is black. |
text_color_ref |
Optionally assign text color from another column by providing the name of the column containing the text colors in quotes. Only one color can be provided per cell. Default is NULL. |
text_size |
Numeric value representing the size of the text labels. Default is NULL. |
brighten_text |
Logical: automatically assign color to text labels based on filled color when the text labels are positioned within the filled bars. Text within dark-colored filled bars will turn white, text within light-colored bars will be black. Default is TRUE. |
brighten_text_color |
Assigns color to text labels if values are within a dark-colored filled bar. Default is white. |
bold_text |
Logical: display the text labels in bold. Default is FALSE. |
border_width |
The width of the border around the filled data bars Options are "thin", "medium", "thick", or a numeric value with the units included such as "2px" or "2mm". May be specified using one, two, three, or four values. See [CSS border-width](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width) for more options. Default is NULL. |
border_style |
The style of the border around the filled data bars Options are "solid", "dashed", "dotted", "double", "groove", "ridge", "inset", "outset", "none", or "hidden". May be specified using one, two, three, or four values. See [CSS border-style](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style) for more options. Default is NULL. |
border_color |
The color of the border around the filled data bars May be specified using one, two, three, or four values. See [CSS border-color](https://developer.mozilla.org/en-US/docs/Web/CSS/border-color) for more options. Default is NULL. |
icon |
Assign an icon label from the Font Awesome library (via shiny). If an icon is provided, it will be positioned so that it does not overlap the text for the data bars. Default is NULL. |
icon_ref |
Optionally assign icons from another column by providing the name of the column containing the icons in quotes. Only one icon can be provided per cell. Default is NULL. |
icon_size |
A value representing the size of the icon in px. Default is 20. |
icon_color |
The color for the icon. If no color is provided, default is set to the color of the filled bars. Default is NULL. |
icon_color_ref |
Optionally assign color to the icons from another column by providing the name of the column containing the icon colors in quotes. Only one color can be provided per cell. Default is NULL. |
img |
Optionally assign an image label via a valid URL. |
img_ref |
Optionally assign images from another column by providing the name of the column containing the image URLs in quotes. Only one image can be provided per cell. Default is NULL. |
img_height |
A value for the height of the image in px. Default is 20. |
img_width |
A value for the width of the image in px. Default is 20. |
box_shadow |
Logical: add a box shadow to the bars. Default is FALSE. |
round_edges |
Logical: round the edges around the data bars. Default is FALSE. |
tooltip |
Logical: hover tooltip. Default is FALSE. |
animation |
Control the duration and timing function of the animation when sorting/updating values shown on a page. See [CSS transitions](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) for available timing functions and examples. Animation can be turned off by setting to "none". Default is "width 1s ease". |
Value
a function that applies data bars to a column of numeric values.
Examples
data <- MASS::Cars93[20:49, c("Make", "MPG.city", "MPG.highway")]
## By default, data bars are aligned left and text_position are placed on the inside end
reactable(data,
defaultColDef = colDef(
cell = data_bars(data)))
## Align the bars to the right
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
align_bars = "right")))
## Move the text labels outside of the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
text_position = "outside-end")))
## Apply multiple fill_color to the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
fill_color = c("lightblue","royalblue","navy"))))
## Apply a fill_gradient pattern to the filled bars
reactable(data,
defaultColDef = colDef(
cell = data_bars(data,
fill_color = c("lightblue","royalblue","navy"),
fill_gradient = TRUE,
text_position = "outside-end")))
R Package Documentation
Browse R Packages
We want your feedback!
Note that we can't provide technical support on individual packages. You should contact the package authors for that.
Embedding an R snippet on your website
Add the following code to your website.
For more information on customizing the embed code, read Embedding Snippets.