Boxplot Chart
Boxplot Chart, also known as box-and-whisker plot, is a type of chart that displays the distribution of continuous variables. Boxplots can show the center and spread of data, as well as serve as an intuitive tool to check normality or identify potential outliers, reflecting the characteristics of the original data distribution and identifying data anomalies.
Boxplots are suitable for comparing the distribution characteristics of multiple groups of data, mostly used in numerical statistics. They can provide key information about the position and dispersion of data, especially when comparing different population data to show their differences. When using boxplots, please check if there are extreme values in the data. If the dataset is small, use with caution; if there are categorical or nominal variables, use charts like bar charts.
Advantages: Not affected by outliers, can describe the discrete distribution of data in a relatively stable way.
Disadvantages: Cannot accurately measure the skewness and tail weight of the data distribution, and for large batches of data, the information it reflects is more vague.
Key Data Points
- Minimum: The smallest value in the data.
- Lower Quartile (Q1): The median of the data below the median.
- Median (Q2): The center point of the data.
- Upper Quartile (Q3): The median of the data above the median.
- Maximum: The largest value in the data.
Settings
Data Settings
| Setting | Description |
|---|---|
| Data Source | Select the data source for the boxplot. You can also add X-axis and Y-axis field options through aggregate queries in the Data Source menu |
| Name Field | Select a field returned by the data source. This field is used for displaying boxplot label names, usually in conjunction with the Hover Display menu |
| X-axis Field | In the Cartesian coordinate system, select a field from the field list returned in the Data Source menu and set it as the X-axis of the boxplot |
| Y-axis Field | In the Cartesian coordinate system, select a field from the field list returned in the Data Source menu and set it as the Y-axis of the boxplot |
Chart Settings
| Setting | Description |
|---|---|
| X-axis | Select the X-axis where the boxplot is located. You can add multiple X-axes in the X-axis menu |
| Y-axis | Select the Y-axis where the boxplot is located. You can add multiple Y-axes in the Y-axis menu |
| Color Allocation Type | Configure the color effect of the graphics in the boxplot. Options: Allocate colors in the palette according to the chart, Allocate colors in the palette according to the data item.When multiple charts are aggregated, you can choose to allocate by chart. For a single chart, you can choose to allocate by data item. Specific color values can be adjusted in the Style menu palette |
| Layout | Configure the display mode of boxes in the chart. Options: Empty, Arrange boxes horizontally, Arrange boxes vertically |
| Minimum Box Width | Set the minimum adaptive width of boxplot boxes |
| Maximum Box Width | Set the maximum adaptive width of boxplot boxes |
Label Settings
| Setting | Description |
|---|---|
| Display Label | Turn on or off the display of labels on the boxplot graphics |
| Display Content Expression | Supports custom editing of expression syntax to achieve complex scene content display, with lower display priority than [Display Content] |
| Display Content | Editable label display content, does not support complex expression syntax except for prompt content, with higher display priority than [Display Content Expression] |
| Position | You can choose the display position of the label on the boxplot graphics |
| Distance from Graphic | Set the distance of the label from the graphics in the boxplot |
| Label Rotation | Set the rotation angle of the label |
| Text Offset X | Set the distance of the label text from the X-axis |
| Text Offset Y | Set the distance of the label text from the Y-axis |
| Color | Set the color of the label text |
| Background Color | Set the background color of the label text. It needs to be used together with parameters such as line height, padding, width, and height in the text style to take effect |
| Text Style | Set the label text to italic or normal mode |
| Font Weight | Set the label font weight. Options: Default, Bold, Very Bold, Light |
| Font | Set the label font style. Options: sans-serif, serif, monospace, Arial, Courier NEW |
| Font Size | Set the label font size. The font size is not less than 12 and not more than 100 |
| Horizontal Alignment | Set the horizontal alignment of the label text, including four methods: auto, left-aligned, centered, and right-aligned |
| Vertical Alignment | Set the vertical alignment of the label text, including four methods: auto, top, centered, and bottom |
| Line Height | Set the line height of the label text. It takes effect when Exceed Width Handling is set to wrap |
| Padding | Set the distance of the label text within the background box |
| Width | Set the maximum display width of the label text. It is generally used together with Exceed Width Handling for wrapping and other configurations |
| Height | Set the display height of the label text. It only affects the text background height and does not affect the display of the text itself |
| Exceed Width Handling | Processing method after the label exceeds the maximum width, including two methods: wrap and truncate with ellipsis. If set to none, the maximum width will not take effect |
| Stroke Width | Set the stroke width of the label background image. It takes effect only after setting the stroke color |
| Stroke Color | Set the stroke color value of the label background |
| Stroke Radius | Set the stroke radius angle of the label background |
| Shadow Color | Set the shadow color of the label background. It takes effect only after setting the label background color and shadow size |
| Shadow Size | Set the shadow size of the label background |
| Shadow Horizontal Offset | Set the horizontal offset distance of the label background shadow |
| Shadow Vertical Offset | Set the vertical offset distance of the label background shadow |
Bar Style
| Setting | Description |
|---|---|
| Color | Set the color effect of the bars |
| Border Color | Set the color effect of the bar borders |
| Stroke Type | Configure the stroke type of the bars. Options: Solid Line, Dashed Line, Dotted Line |
| Stroke Width | Set the stroke width of the bars |
| Stroke Color | Set the stroke color of the bars |
| Stroke Radius | Set the stroke radius angle of the bars |
| Shadow Color | Set the shadow color of the bars |
| Shadow Size | Set the shadow size of the bars |
| Shadow Horizontal Offset | Set the horizontal position of the bar shadow |
| Shadow Vertical Offset | Set the vertical position of the bar shadow |
| Opacity | Set the opacity of the bars, with values ranging from 0 to 1 |
Label Layout
| Setting | Description |
|---|---|
| Hide Overlapping Labels | When enabled, labels that overlap in content will be hidden |
| Overlapping Offset Direction | When labels overlap, you can choose the direction of label displacement, with options for horizontal or vertical displacement |
Highlight Settings
| Setting | Description |
|---|---|
| Disable Highlight | After disabling highlight, the label will no longer be highlighted when the mouse moves to the label position |
| Highlight Behavior | Set the interactive style of highlight display |
| Fade Range | Set the selection range for interactive interface fade-out during highlight, providing three methods: fade-out coordinate system, fade-out chart, or global fade-out |
Events
| Setting | Description |
|---|---|
| Non-clickable | After enabling, all label data in the chart cannot be clicked. After closing, you can set the corresponding data click interaction event |
| Call Automation After Click | You can implement related data label click interaction events by selecting the corresponding automation, such as opening the corresponding data form details or opening other web links after clicking |
| Call Automation After Double Click | The function is the same as click call, but the interaction is triggered by double-click instead of single-click. Click and double-click events can be set at the same time |
Usage Example
To simulate a boxplot configuration, we need to prepare a data table with the following specific data structure:
| Field Name | Field Type |
|---|---|
| Name | String |
| Minimum | Decimal |
| Lower Quartile | Decimal |
| Median | Decimal |
| Upper Quartile | Decimal |
| Maximum | Decimal |
Configuration Example
Note: The Y-axis fields must be configured in the order of Minimum, Lower Quartile, Median, Upper Quartile, Maximum otherwise it will not display correctly