How to add a Tornado Chart Custom Widget in Bold BI?
Bold BI allows you to enhance your dashboard with a variety of custom widgets, including Tornado Chart custom widget. This guide provides step-by-step instructions on how to:
- Download the Custom Widget
- Publish the Custom Widget
- Locate the Custom Widget
- Configure the Widget
Download the Widget
- To begin, download the Tornado Chart custom widget Custom Widget from the Bold BI website or the widget library within the Bold BI application.
Publish the Widget
- After downloading, you must publish the widget to the Bold BI application. This step makes it available for use in your dashboards. You can refer to our detailed guide on publishing custom widgets for additional assistance.
Locate the Widget in Designer
Once published, the widget will appear in the Designer Panel. Follow these steps to add it to your dashboard:
- Search for
Tornado Chartin the widget search bar. - Drag and drop the widget from the Designer Panel to your desired location on the dashboard.
Configure the Widget
To display data effectively in the Tornado chart, ensure you configure at least one value. Follow these steps for configuration:
- Drag and drop the custom Tornado chart onto the canvas and resize it as needed.
- Assign data to the widget.
- Once configured, the chart will display your data accordingly.
Formatting the Chart Widget
You can enhance the appearance of the Tornado chart using settings in the Properties tab.
Basic Settings
Enable Drill-Down
- This option enables the rendering of multiple levels of data within the same view. If you bind more than one column in the Columns section, you can switch to a drill-down view by enabling this setting.
- Once you’ve drilled down into the data, you can easily return to the previous view using the breadcrumb navigator located at the top of the widget.
Show Tooltip
- Toggle the visibility of Tooltip options.
Show Data Label
- Toggle the visibility of data value labels.
- Disabling this option also hides related properties such as Data Label Color and Display Format.
Data Label Color
- Customize the color of data labels.
Data Label Rotation
- Customize the rotation of data labels.
Data Label Positions
- Change the position of the data label (Value: Auto, Top, Middle, or Bottom).
Legend Settings
Show Legend
- Toggle the visibility of the legend.
Interactivity
- Control whether legends are clickable. Disabling interactivity ensures that users cannot toggle data visibility.
Color
- Customize legend text color.
Position
- Set the legend position to Top, Left, Right, or Bottom.
- Change the legend position using a dropdown menu.
Shape
Change the legend shape to:
- Circle: Display legend markers as circles.
- Series Type: Match legend shape with the series type.
Title
- Add a title to the legend.
Grid Lines
Show Axis Border
- Enable the option to show axis border around the X and Y axes.
Primary Value Axis
- Enable the display of the primary value axis to show data scale.
Category Axis
- Enable the category axis to show labels for each data group along the Y-axis.
Axis Settings
Title Color
- Customize the title color.
Label Color
- Customize the label color.
Show Category Axis
- Enable the category axis to show labels for each data group along the Y-axis.
Show Category Axis Title
- Enable the category axis title to show axis title along the Y-axis.
Axis Title
- Customize the Axis title name.
Label Rotation
- Customize the rotation of data labels.
Label Overflow Mode
- Set the overflow mode to None, Hide, Trim, or Wrap.
- Change the overflow mode using a dropdown menu.
Show Primary Axis
- Enable the primary axis to show labels for each data group along the X-axis.
Show Primary Axis Title
- Enable the primary axis title to show axis title along the X-axis.
Interval
- Set the spacing between values displayed on the primary axis to control the interval.
Minimum
- Set the minimum value for the primary axis to define where the axis scale begins.
Maximum
- Set the maximum value for the primary axis to define where the axis scale ends.
Axis Label Formatting
Type
- Set the type to Number or Currency.
- Change the type using a dropdown menu.
Representation
- Set the representation to Auto, Ones, Thousands, Millions or Billions.
- Change the representation using a dropdown menu.
Decimal Places
- Change the decimal places values.
Conditional Formatting
This enhancement to the Tornado custom widget that brings greater flexibility and control to your data visualizations. This feature, now available in the Property Panel under the Formatting section, introduces Conditional Formatting for bar values.
You can now customize the color of bar values based on specific conditions. This means that instead of relying solely on the default Positive and Negative color settings, you can define rules that dynamically change the bar color when certain criteria are met.
How It Works:
- Default Behavior: Bar values are colored using the predefined Positive and Negative color options.
- Conditional Formatting Enabled: When a condition is met, the bar color changes accordingly.
- Fallback: If the condition is not met, the bar reverts to the default Positive/Negative color scheme.
This functionality allows for more intuitive and visually impactful data representation, helping users quickly identify key insights.
By following these steps, you can effectively add, configure, and customize the Tornado Custom Chart widget in your dashboard.
References
