Story Builder is an interactive navigation widget in Quick BI dashboards. It links multiple charts in a logical sequence based on analytical perspectives or business scenarios, helping report authors control the flow and pacing of content to improve narrative clarity and structure.
Prerequisites
A dashboard has been created. For more information, see Create a dashboard.
Scenarios
Story Builder is ideal for presenting a cohesive analytical narrative within a single report. For example, in a Monthly Business Review report, you can organize analysis views step by step—such as “Target vs. Actual → Gap Analysis → Root Cause → Improvement Recommendations”—to create a continuous data story from problem identification to actionable insights.
Step 1: Add the Story Builder widget
On the dashboard editing page, click the 
icon in the top menu bar to add a Story Builder widget.
Step 2: Configure the Style
In the Story Builder panel, use the Basic Settings section to define visual styles, such as component layout and background fill. Use the Story Nodes section to set the node mode and edit node descriptions.
Basic Settings
The available options vary depending on the selected component position.
-
When Component Position is set to Top Horizontal, you can configure the following options:
Configuration Content
Description
Component Style
Choose from Progress Bar (①), Rounded Progress Bar (②), Chapter List (③), Data Model (④), or Minimalist (⑤).
Page Navigation Style
Choose between Horizontal Flip and Vertical Scroll:
-
Horizontal Flip
-
Vertical Scroll
Custom Background Fill
If checked, select a background fill color for the Story Builder widget under Card Color. Choose either Solid Color or Gradient.
Border Radius
Set the border radius value for the Story Builder widget.
Show Title
If checked, display a title in the Story Builder widget. Customize the title text and its style—including font color, size, weight, and italicization.
Story Line Style
Click the
icon to customize text and background colors for nodes. When enabled, these settings override the theme color scheme.You can set the text styles for the node title (①) and node description (②) in their selected and unselected states, and the color of the node color block (③) in its selected state.
-
-
When Component Position is set to Right Vertical, you can configure the following options:
Setting
Description
Component Style
Choose between Menu Tree and Tab.
-
Tabbed
-
Menu Tree
Default Status
Choose Hide by Default or Show by Default. The setting takes effect immediately on the dashboard preview page.
-
Hide by Default
-
Show by Default
Custom Background Fill
If checked, select a background fill color for the Story Builder widget under Card Color.
Component Width
If checked, set the width of the Story Builder widget.
Story Line Style
Click the
icon to customize text and background colors for nodes. When enabled, these settings override the theme color scheme.You can set the text style of the node title (①) for its selected and unselected states, and the color of the node color block (②) for its selected state.
-
Story Nodes
The Story Nodes section lets you set the node mode and edit node descriptions.
-
Node Mode supports two options: Auto Select and Manual Select.
-
When Node Mode is set to Auto Select, the system automatically generates a story node list based on the dashboard layout. The node order is updated automatically if the chart positions change.
-
When Node Mode is set to Manual Select, you can manually select charts from the thumbnail view to include them as story nodes. Charts that are not selected, or are added after the configuration, will not appear in the story node list.
-
-
In the Edit Story Node Text section, you can rename story nodes.
On the story node editing page, you can attach query controls and add annotations, as shown below.
NoteThe story node list supports a maximum of 20 nodes. Each node name can contain a maximum of 50 characters.
Step 3: Manage Storylines
The following management actions are available for the Story Builder widget.
-
If the component position is set to Top Horizontal:
-
Click the Story Builder widget (①) to open the Story Builder panel for editing. For more information, see Step 2: Configure the Style.
-
Click ② to delete the Story Builder widget.
-
-
If Component Position is set to Right Vertical:
-
Click ① to open the Story Builder panel for editing. For more information, see Step 2: Configure the Style.
-
Click ② to expand the story node list.
-
Click ③ to edit story nodes.
-
Click ④ to delete the Story Builder widget.
-
FAQ
1. What are the differences between BI portal, Tab widget, and Story Builder?
BI portal, Tab widget, and Story Builder are all interactive navigation features in Quick BI, but they serve different purposes:
-
BI portal: Organizes multiple report objects according to business logic. Typically used when you need to present multiple reports. For more information, see BI portal.
-
Tab widget: Groups multiple charts into a single tab for centralized viewing. Ideal for organizing multiple charts within a limited dashboard space. For more information, see Tab.
-
Story Builder: Presents the analytical flow within a single report as a storyline. Best suited for showcasing a complete analytical narrative in one report. The Story Builder can be placed in the top horizontal or right vertical position. For more information, see this topic.
-
Top horizontal
-
Right vertical
-
2. Why are some charts in my dashboard not appearing in the story node list?
Only one chart per row can appear in the story node list:
-
If a row contains only one chart, it appears in the story node list, regardless of its position in the row (left, center, or right).
-
If a row contains two or more charts, only the leftmost chart appears in the story node list.