"globals"
"marker"
"tooltip"
"gui"
"context-menu"
"button"
"gear"
"item"
"graphset"
"arrows"
"from"
"label"
"to"
"bubble-legend"
"marker"
"chart"
"color-scale"
"cursor"
"item"
"crosshair-x"
"marker"
"plot-label"
"scale-label"
"crosshair-y"
"scale-label"
"globals"
"marker"
"tooltip"
"guide"
"marker"
"plot-label"
"scale-label"
"heatmap"
"tooltip"
"images"
"labels"
"legend"
"footer"
"header"
"icon"
"item"
"item-off"
"marker"
"marker-off"
"page-off"
"page-on"
"page-status"
"scroll"
"bar"
"handle"
"tooltip"
"nav"
"back"
"tooltip"
"no-data"
"options"
"arrow"
"back"
"tooltip"
"bars"
"tooltip"
"box"
"tooltip"
"button-zoomin"
"tooltip"
"button-zoomout"
"tooltip"
"close"
"containers"
"day"
"items"
"final"
"group-box"
"tooltip"
"handle"
"indicator"
"intermediate"
"item"
"label"
"tooltip"
"item-group-n"
"label"
"tooltip"
"item-id-n"
"label"
"tooltip"
"item-level-n"
"label"
"tooltip"
"label"
"link"
"link[cls-n]"
"link[container-n]"
"link[group-n]"
"link[level-n]"
"link[parent-n]"
"link[sibling]"
"link[source-n]"
"link[target-n]"
"links"
"mmp-marker"
"label"
"month"
"item"
"items"
"outline"
"multi-guide"
"close"
"handle"
"label"
"negative"
"node"
"label"
"tooltip"
"node[cls-n]"
"label"
"tooltip"
"node[collapsed]"
"label"
"tooltip"
"node[group-n]"
"label"
"tooltip"
"node[leaf]"
"label"
"tooltip"
"node[level-n]"
"label"
"tooltip"
"node[parent]"
"label"
"tooltip"
"node[parent-n]"
"label"
"tooltip"
"nodes"
"OBJECT_KEY_NAME"
"label"
"tooltip"
"outlier"
"marker"
"tooltip"
"positive"
"scale"
"label"
"pointer"
"scale-y-2"
"guide"
"item"
"label"
"markers"
"label"
"tick"
"tooltip"
"style"
".td"
".td_even"
".td_first"
".td_last"
".td_n"
".td_n_n"
".td_odd"
".th"
".th_even"
".th_first"
".th_last"
".th_n"
".th_odd"
".tr"
".tr_even"
".tr_first"
".tr_last"
".tr_n"
".tr_odd"
"band"
"tooltip"
"chord"
"tooltip"
"flow"
"item"
"item-flow"
"item-overall"
"label"
"label-overall"
"tooltip"
"subtitle"
"tile"
"label"
"tooltip"
"title"
"tooltip-box"
"tooltip-group"
"trigger"
"value"
"violin"
"week"
"items"
"weekday"
"item"
"items"
"plot"
"error"
"facets"
"goal"
"tooltip"
"guide-label"
"guide-marker"
"highlight-marker"
"hover-marker"
"hover-state"
"styles"
"highlight-state"
"legend-item"
"legend-marker"
"max-marker"
"marker"
"min-marker"
"selected-marker"
"selected-state"
"tooltip"
"trend-down"
"trend-equal"
"trend-up"
"value-box"
"rules"
"plotarea"
"preview"
"handle"
"handle-bottom"
"handle-left"
"handle-right"
"handle-top"
"label"
"refresh"
"scale"
"item"
"scale-k"
"guide"
"item"
"tooltip"
"scale-r"
"center"
"guide"
"item"
"markers"
"label"
"ring"
"tooltip"
"scale-v"
"guide"
"item"
"tooltip"
"scale-x"
"guide"
"item"
"label"
"markers"
"label"
"tooltip"
"scale-y"
"guide"
"item"
"label"
"markers"
"tick"
"tooltip"
"scroll-x"
"bar"
"handle"
"scroll-y"
"bar"
"handle"
"selection-tool"
"series"
"error"
"facets"
"goal"
"tooltip"
"guide-label"
"guide-marker"
"highlight-marker"
"hover-marker"
"highlight-state"
"legend-item"
"legend-marker"
"marker"
"max-marker"
"min-marker"
"selected-marker"
"selected-state"
"style"
"band"
"tooltip"
"chord"
"tooltip"
"item"
"item-flow"
"item-overall"
"label"
"tooltip"
"value-box"
"rules"
"shapes"
"label"
"options"
"style"
"controls"
"zoom-in"
"tooltip"
"zoom-out"
"tooltip"
"items"
"OBECT_KEY_NAME"
"tooltip"
"label"
"tooltip"
"tooltip"
"source"
"subtitle"
"title"
"tooltip"
"zoom"
"label"
"history"
"refresh"
graph » options » group-box
group-box
[ root » graph » options » group-box ]
Treemaps only: Customize the treemap nodes with at least one child node.
Attribute | Type | Description |
---|---|---|
align | String | Sets the alignment of the object. Accepted Values: ['left', 'center', 'right'] Chart types: Treemap |
alpha | Number | Sets the opacity on the marker, with 0 being fully transparent and 1 being fully opaque. Note that decimal value requires the leading 0. Default Value: 1 Chart types: Boxplot,3D Toolbar,Treemap |
backgroundClip background-clip | Boolean | Clips the background image to the margins of the shape/box. Default Value: true Chart types: Boxplot,Treemap |
backgroundColor background-color | String | Sets the background color of the object. Colors can be entered by name (e.g., "purple", "blue"), hexadecimal notation (e.g., "#666699", #33ccff"), or RGB notation (e.g., "rgb(255,0,0)", "rgb(0,0,255)") Default Value: null Chart types: Boxplot,3D Toolbar,Treemap |
backgroundColor1 background-color-1 | String | Sets the first color of a 2 color background gradient of the object. To be used with background-color-2. Default Value: null Chart types: Boxplot,3D Toolbar,Treemap |
backgroundColor2 background-color-2 | String | Sets the second color of a 2 color background gradient of the object. To be used with background-color-1. Default Value: null Chart types: Boxplot,3D Toolbar,Treemap |
backgroundFit background-fit | String | Sets the direction/s on which the background image is being "stretched". Default Value: '' Chart types: Boxplot,Treemap |
backgroundImage background-image | String | Sets a background image for the object. Value can be a local file or a web image's location.
For patterns, the available patterns are: [`${string}`, 'PATTERN_BACKWARD_DIAGONAL', 'PATTERN_DARK_DOWNWARD_DIAGONAL', 'PATTERN_DARK_HORIZONTAL', 'PATTERN_DARK_UPWARD_DIAGONAL', 'PATTERN_DARK_VERTICAL', 'PATTERN_DASHED_DOWNWARD_DIAGONAL', 'PATTERN_DASHED_HORIZONTAL', 'PATTERN_DASHED_UPWARD_DIAGONAL', 'PATTERN_DASHED_VERTICAL', 'PATTERN_DIAGONAL_BRICK', 'PATTERN_DIAGONAL_CROSS', 'PATTERN_DIVOT', 'PATTERN_DOTTED_DIAMOND', 'PATTERN_DOTTED_GRID', 'PATTERN_FORWARD_DIAGONAL', 'PATTERN_HORIZONTAL', 'PATTERN_HORIZONTAL_BRICK', 'PATTERN_LARGE_CHECKER_BOARD', 'PATTERN_LARGE_GRID', 'PATTERN_LIGHT_DOWNWARD_DIAGONAL', 'PATTERN_LIGHT_HORIZONTAL', 'PATTERN_LIGHT_UPWARD_DIAGONAL', 'PATTERN_LIGHT_VERTICAL', 'PATTERN_NARROW_HORIZONTAL', 'PATTERN_NARROW_VERTICAL', 'PATTERN_OUTLINED_DIAMOND', 'PATTERN_PLAID', 'PATTERN_SHADE_25', 'PATTERN_SHADE_50', 'PATTERN_SHADE_75', 'PATTERN_SHINGLE', 'PATTERN_SMALL_CHECKER_BOARD', 'PATTERN_SMALL_GRID', 'PATTERN_SOLID_DIAMOND', 'PATTERN_SPHERE', 'PATTERN_TRELLIS', 'PATTERN_VERTICAL', 'PATTERN_WAVE', 'PATTERN_WEAVE', 'PATTERN_WIDE_DOWNWARD_DIAGONAL', 'PATTERN_WIDE_UPWARD_DIAGONAL', 'PATTERN_ZIGZAG']. Accepted Values: ['PATTERN_BACKWARD_DIAGONAL', 'PATTERN_DARK_DOWNWARD_DIAGONAL', 'PATTERN_DARK_HORIZONTAL', 'PATTERN_DARK_UPWARD_DIAGONAL', 'PATTERN_DARK_VERTICAL', 'PATTERN_DASHED_DOWNWARD_DIAGONAL', 'PATTERN_DASHED_HORIZONTAL', 'PATTERN_DASHED_UPWARD_DIAGONAL', 'PATTERN_DASHED_VERTICAL', 'PATTERN_DIAGONAL_BRICK', 'PATTERN_DIAGONAL_CROSS', 'PATTERN_DIVOT', 'PATTERN_DOTTED_DIAMOND', 'PATTERN_DOTTED_GRID', 'PATTERN_FORWARD_DIAGONAL', 'PATTERN_HORIZONTAL', 'PATTERN_HORIZONTAL_BRICK', 'PATTERN_LARGE_CHECKER_BOARD', 'PATTERN_LARGE_GRID', 'PATTERN_LIGHT_DOWNWARD_DIAGONAL', 'PATTERN_LIGHT_HORIZONTAL', 'PATTERN_LIGHT_UPWARD_DIAGONAL', 'PATTERN_LIGHT_VERTICAL', 'PATTERN_NARROW_HORIZONTAL', 'PATTERN_NARROW_VERTICAL', 'PATTERN_OUTLINED_DIAMOND', 'PATTERN_PLAID', 'PATTERN_SHADE_25', 'PATTERN_SHADE_50', 'PATTERN_SHADE_75', 'PATTERN_SHINGLE', 'PATTERN_SMALL_CHECKER_BOARD', 'PATTERN_SMALL_GRID', 'PATTERN_SOLID_DIAMOND', 'PATTERN_SPHERE', 'PATTERN_TRELLIS', 'PATTERN_VERTICAL', 'PATTERN_WAVE', 'PATTERN_WEAVE', 'PATTERN_WIDE_DOWNWARD_DIAGONAL', 'PATTERN_WIDE_UPWARD_DIAGONAL', 'PATTERN_ZIGZAG', `${string}`] Default Value: '' Chart types: Boxplot,Treemap |
backgroundPosition background-position | String | Sets the position of the background when the background-repeat value is no-repeat. Default Value: '50% 50%' Chart types: Boxplot,Treemap |
backgroundRepeat background-repeat | Boolean, String | Sets the repeating mode for the background image. Default Value: 'repeat' Chart types: Boxplot,Treemap |
backgroundScale background-scale | Number | Scales the background image using the specified ratio. Default Value: 1 Chart types: Boxplot,Treemap |
bold | Boolean | Sets whether the text is displayed with bold characters or not. Default Value: false Chart types: Treemap |
borderAlpha border-alpha | Number | Sets the transparency level of the border on the object. Values must range between 0.0 and 1.0, with 0.0 being completely transparent and 1.0 being completely opaque. Note that values require the leading 0 before the decimal point. Default Value: 1 Introduced in: v2.1.1 Chart types: Boxplot,3D Toolbar,Treemap |
borderBottom border-bottom | Number | Sets the object's bottom border style. Accepts solid, dashed, and dotted styles. Default Value: '' Chart types: Treemap |
borderColor border-color | String | Sets the border color of the object. Default Value: '#000' Chart types: Boxplot,3D Toolbar,Treemap |
borderLeft border-left | Number | Sets the object's left border style. Accepts solid, dashed, and dotted styles. Chart types: Treemap |
borderRadius border-radius | Number | Sets the object's border radius for rounded corners. Larger values create rounder corners, while smaller values create sharper corners. A single value will affect all 4 corners; multiple values will have separate effects on each corner, with the first value affecting the top-left corner, the second value affecting the top-right corner, and so on, in a clockwise direction. A negative value will cut a corner off without rounding. Default Value: 0 Chart types: Treemap |
borderRadiusBottomLeft border-radius-bottom-left | Number | Sets the object's bottom-left border radius for rounded corners. Larger values create rounder corners, while smaller values create sharper corners. A negative value will cut a corner off without rounding. Default Value: 0 Chart types: Treemap |
borderRadiusBottomRight border-radius-bottom-right | Number | Sets the object's bottom-right border radius for rounded corners. Larger values create rounder corners, while smaller values create sharper corners. A negative value will cut a corner off without rounding. Default Value: 0 Chart types: Treemap |
borderRadiusTopLeft border-radius-top-left | Number | Sets the object's top-left border radius for rounded corners. Larger values create rounder corners, while smaller values create sharper corners. A negative value will cut a corner off without rounding. Default Value: 0 Chart types: Treemap |
borderRadiusTopRight border-radius-top-right | Number | Sets the object's top-right border radius for rounded corners. Larger values create rounder corners, while smaller values create sharper corners. A negative value will cut a corner off without rounding. Default Value: 0 Chart types: Treemap |
borderRight border-right | Number | Sets the object's right border style. Accepts solid, dashed, and dotted styles. Default Value: '' Chart types: Treemap |
borderTop border-top | Number | Sets the object's top border style. Accepts solid, dashed, and dotted styles. Default Value: '' Chart types: Treemap |
borderWidth border-width | Number | Sets the border width of the object. Default Value: 0 Chart types: Boxplot,3D Toolbar,Treemap |
class | String | Sets a class value on the object. Default Value: null Chart types: Boxplot,3D Toolbar,Treemap |
clipText clip-text | Boolean | Truncates text based on the setting of width. Default Value: false Chart types: Treemap |
color | String | Sets the object's font color. Similar to font-color. Default Value: '#000' Chart types: Treemap |
cursor | String | Sets the cursor type when hovering over the object. Accepted Values: ['alias', 'all-scroll', 'arrow', 'auto', 'cell', 'col-resize', 'context-menu', 'copy', 'crosshair', 'default', 'e-resize', 'ew-resize', 'hand', 'help', 'move', 'n-resize', 'ne-resize', 'nesw-resize', 'no-drop', 'none', 'not-allowed', 'ns-resize', 'nw-resize', 'nwse-resize', 'pointer', 'progress', 'row-resize', 's-resize', 'se-resize', 'sw-resize', 'text', 'vertical-text', 'w-resize', 'wait'] Default Value: 'auto' Introduced in: v1.9.0 Chart types: Treemap |
dataN data-n | Any | Prefix attribute or array using "data-" to define a custom token. Chart types: Boxplot,3D Toolbar,Treemap |
fillAngle fill-angle | Number | Sets the angle of the axis along which the linear gradient is drawn. Default Value: 90 Chart types: Boxplot,3D Toolbar,Treemap |
fillOffsetX fill-offset-x | Number | Sets an X offset to apply to the fill. Default Value: 0 Chart types: Boxplot,3D Toolbar,Treemap |
fillOffsetY fill-offset-y | Number | Sets a Y offset to apply to the fill. Default Value: 0 Chart types: Boxplot,3D Toolbar,Treemap |
fillType fill-type | String | Sets the background gradient fill type to either linear or radial. Accepted Values: ['linear', 'none', 'radial'] Default Value: 'linear' Chart types: Boxplot,3D Toolbar,Treemap |
flat | Boolean | Set to true disables the chart interactivity. Default Value: false Chart types: Treemap |
fontColor font-color | String | Sets the font color of the text. Chart types: Treemap |
fontFamily font-family | String | Sets the text's font family. Chart types: Treemap |
fontSize font-size | Number | Sets the text's font size. Chart types: Treemap |
fontStyle font-style | String | Sets the text's font style. Accepted Values: ['normal', 'italic', 'oblique', 'none'] Chart types: Treemap |
fontWeight font-weight | Number, String | Sets the text's font weight. Similar to bold. Accepted Values: ['bold', 'none', 'normal', `${string}`] Default Value: 'normal' Chart types: Treemap |
gradientColors gradient-colors | String | Sets a set of colors for a complex background gradient consisting of 2 or more colors. To be used with gradient-stops. Default Value: '' Chart types: Boxplot,3D Toolbar,Treemap |
gradientStops gradient-stops | String | Sets the gradient stops for a complex background gradient consisting of 2 or more colors. To be used with gradient-colors. Default Value: '' Chart types: Boxplot,3D Toolbar,Treemap |
hoverState hover-state | Object | Sets the hover state styles of the object. Chart types: Boxplot,Treemap |
id | String | Sets the id of the object. Default Value: '' Chart types: Boxplot,3D Toolbar,Treemap |
italic | Boolean | Sets whether the text is displayed with italicized characters or not. Default Value: false Chart types: Treemap |
lineGapSize line-gap-size | Number | Can be used to create custom dashed or dotted lines when used with line-segment-size. This will control the size of the gaps between each line segment. Default Value: 0 Chart types: Boxplot,Treemap |
lineHeight line-height | Number | Sets the height of a line box. Default Value: -1 Chart types: Treemap |
lineSegmentSize line-segment-size | Number | Can be used to create custom dashed or dotted lines when used with line-gap-size. This will control the size of the visible segment of line. Default Value: 0 Chart types: Boxplot,Treemap |
lineStyle line-style | String | Sets the line style of the object. Accepted Values: ['dashdot', 'dashed', 'dotted', 'solid'] Default Value: '' Chart types: Boxplot,Treemap |
maxChars max-chars | Number | Sets the maximum numbers of characters displayed in the object. The value determines how many characters will be displayed before the text is cut and appended with "..." Default Value: 0 Chart types: Treemap |
mediaRules media-rules | Array.<Object> | Configure media rules. Chart types: Boxplot,Treemap |
offsetX offset-x | Number | Sets an x-offset to apply when positioning the object. Chart types: 3D Toolbar,Treemap |
offsetY offset-y | Number | Sets an y-offset to apply when positioning the object. Chart types: 3D Toolbar,Treemap |
padding | Number | Sets the object's padding around the text. Up to four values can be entered to set the padding for all four sides, with the first value affecting the top padding, the second value affecting the right padding, and so on, in a clockwise direction. Default Value: null Chart types: Treemap |
paddingBottom padding-bottom | Number | Sets the object's bottom padding around the text. Default Value: 2 Chart types: Treemap |
paddingLeft padding-left | Number | Sets the object's left padding around the text. Default Value: 2 Chart types: Treemap |
paddingRight padding-right | Number | Sets the object's right padding around the text. Default Value: 2 Chart types: Treemap |
paddingTop padding-top | Number | Sets the object's top padding around the text. Default Value: 2 Chart types: Treemap |
rectShortcut rect-shortcut | Boolean | Used to force the library to create rectangles using a faster drawing API (instead of painting them like a closed polygon). However, using this would disable effects like rounded borders. It is a performance setting for edge cases. Default Value: false Chart types: Treemap |
rtl | Boolean | Renders text right-to-left. Default value is false. Default Value: false Chart types: Treemap |
textAlign text-align | String | Sets the alignment of the object. Accepted Values: ['center', 'bottom', 'left', 'middle', 'right'] Default Value: 'center' Chart types: Treemap |
textAlpha text-alpha | Number | Sets the opacity on the text, with 0 being fully transparent and 1 being fully opaque. Note that decimal value requires the leading 0. Default Value: true Chart types: Treemap |
textDecoration text-decoration | String | Sets the text's decoration to use underlined characters. Similar to underline. May not display properly in Mozilla Firefox when charts are rendered using SVG. Default Value: 'none' Chart types: Treemap |
tooltip | Object | Configures the tooltip element, which appears when hovering over an object. Introduced in: v2.1.0 Chart types: Boxplot,Treemap |
underline | Boolean | Sets whether the text is displayed with underlined characters or not. Default Value: false Chart types: Treemap |
visible | Boolean | Sets the visibility of the object. Allows you to turn off the object without removing lines of JSON. Default Value: true Chart types: Boxplot,Treemap |
wrapText wrap-text | Boolean | Sets whether the text will wrap, depending on the width of the object. Default Value: false Chart types: Treemap |
zIndex z-index | Number | Sets the z position of the object. Objects with higher z indexes will appear "above" those with lower z index values. Default Value: 1 Chart types: Treemap |