Configure chart fields

Updated at:

This topic explains how to configure the fields, style, and advanced options for a chart on a dashboard.

Use the Field tab on the dashboard edit page to add dimension and measure fields, and configure chart styles and analysis settings:

Note

Available field types, chart styles, and analysis options vary by data source and chart type. The options in the product interface may differ from the descriptions in this article.

Configure measure data

This section explains how to configure a measure field, using the order quantity field as an example:

  1. Hover the pointer over the measure field and click the image.png icon on the right.

    image.png

  2. Configure the following parameters based on your business requirements:

    image

    • Data display format

      • automatic

      • None (displays the original value)

      • Integer

      • 1 decimal place

      • 2 decimal places

      • Percentage

      • Percentage (1 decimal place)

      • Percentage (2 decimal places)

      • Custom

        If the preset options do not meet your needs, select Custom for advanced data display formatting. In the Data Display Format Settings dialog box, configure the format type and its related settings. The supported types are Auto-adaptive, Numeric, Percentage, and Manual Input. The settings are described in the following table:

        Format

        Parameter

        Description

        Auto-adaptive

        image

        Adaptation method

        Automatically adapts the number format for different locales. You can set the format to adapt to Chinese, Traditional Chinese, or English, or you can select Follow system language. The system then applies the appropriate numeral system and decimal places for the selected language to ensure a consistent format.

        Numeric

        image

        Magnitude

        Sets the magnitude unit for the data. The default is None. You can switch to Auto, Thousand, Ten thousand, Million, Ten million, Hundred million, K, k, M, mn, or bn.

        Note
        • K and k represent thousand; M and mn represent million; bn represents billion.

        • When you select Auto, the system uses the most appropriate data unit for the actual value and automatically adapts the unit based on the system language. For example, a Chinese system displays units such as Wan and Yi, while an English system displays units such as K and M.

        Hide magnitude unit

        Specifies whether to hide the magnitude unit. This option is unavailable when Magnitude is set to None or Auto.

        Decimal places

        Sets the number of decimal places to display. You can enter an integer from 0 to 10.

        Negative numbers

        Sets the display style for negative numbers. The following options are available:

        • -1234: Displays the number with a minus sign. This is the default option.

        • (1234): Displays the number in parentheses.

        Prefix/Suffix

        Adds a prefix or suffix to the data. For example, if you set the prefix to "¥" and the suffix to "yuan", the data is displayed as "¥xxx yuan".

        Currency symbol mode

        Controls the position of the prefix for negative values. This option is available only when the negative number format is "-1234".

        When enabled, the prefix appears after the minus sign for negative numbers (for example, -¥5).

        Use thousands separator

        Specifies whether to insert a thousands separator in numbers.

        If you select this option, a separator is inserted every three digits.

        Percentage

        image

        Decimal places

        Sets the number of decimal places to display. You can enter an integer from 0 to 10.

        Negative numbers

        Sets the display style for negative numbers. The following options are available:

        • -1234: Displays the number with a minus sign. This is the default option.

        • (1234): Displays the number in parentheses.

        Prefix/Suffix

        Adds text before or after the data.

        Use thousands separator

        Specifies whether to insert a thousands separator in numbers.

        If you select this option, a separator is inserted every three digits.

        Manual Input

        image

        Format code

        Manually enter a format code composed of special characters such as 0, #, ,, ., E, %, , ;, and '. For example: #,##0.00. The length cannot exceed 50 characters.

        For more information about the rules for manual input, see Manual input syntax and capabilities.

    • Alignment

      Horizontal alignment: Auto, Left, Center, Right.

      Vertical alignment: Auto, Top, Middle, Bottom.

    • Sort

      Unsort, Ascend, Descend, Ascend within group, Descend within group, Advanced sort.

    • Aggregation method

      Supported methods include SUM, AVG, COUNT, COUNT DISTINCT, MAX, MIN, Median, Percentile, Population Standard Deviation, Sample Standard Deviation, Population Variance, Sample Variance, First, and Last.

      The following are common use cases for the First and Last aggregation methods:

      • First/Last:

        • When analyzing product order data for each month, to view the amount at the start time and the ending inventory amount, set the aggregation method to First and Last, respectively.

          image.png

        • When you use a query control to query the order amount for a specific time period and need to view the amount at the start time and the ending inventory amount for that period, you can set the aggregation method to First and Last respectively, as shown in the following figure:

          image..png

        • When you analyze the inventory quantity for different product types in each region and need to view the inventory quantity at the time of the latest order, you can set the aggregation method to Last, as shown in the following figure:

          image.png

        The following table describes the aggregation methods supported by different types of data sources.

        Data source

        Aggregation method

        All types of data sources that can connect to Quick BI

        SUM, AVG, COUNT, COUNT DISTINCT, MAX, MIN, First, and Last.

        MySQL, Vertica, SAP IQ (formerly known as Sybase IQ), SQL Server, Presto, PolarDB for Oracle, PostgreSQL, Oracle, MaxCompute, Hive, SAP HANA, AnalyticDB for PostgreSQL, Gbase, IBM DB2 for LUW, Clivia, ClickHouse, and AnalyticDB for MySQL V2.0

        Population Standard Deviation, Sample Standard Deviation, Population Variance, and Sample Variance

        SAP IQ (formerly known as Sybase IQ), Oracle, MaxCompute, SAP HANA, and IBM DB2 for LUW

        Median

        SAP IQ (formerly known as Sybase IQ), Oracle, MaxCompute, SAP HANA, and IBM DB2 for LUW

        Percentile

    • Advanced calculation

      • Date cumulative total: calculates the sum of data from the initial date to the current date. For more information, see Date cumulative total.

      • Running total: Calculates a cumulative total, allowing you to observe the incremental growth of a measure. For more information, see Running total.

        Note
        • Running total cannot be used if period-over-period analysis is already configured for the measure field.

        • Running total can be configured only for fields aggregated by SUM (marked with the image.png icon).

        • Cumulative calculation is supported only when the dimension contains one date field and the time granularity of the date field is year, quarter, month, week, or day.

      • Percentage

        • % of Grand Total

        • % of Column Grand Total

        • % of Row Grand Total

        • % of Parent Column Grand Total

        • % of Parent Row Grand Total

        Percentage is supported only in cross tables. For more information, see Cross table (new version).

      • Ranking

        • Ascend

        • Descend

        • Ascend within group

        • Descend within group

        • None

        For more information, see Data ranking.

      • TopN

        TopN (quick filter) filters the results returned from the database based on value. It helps you quickly pick the largest or smallest N records.

        For more information, see TopN.

      • Percentile

        Calculates the percentile rank for the results returned from the database. It helps you see where a value sits within the full dataset.

        For more information, see Percentile.

      • Period-over-period analysis

        The available values vary depending on the dimension fields. For more information about how to configure this feature, see Period-over-period analysis.

      • None

    • Null value display style

      Set the display style for null values.

    • Field display settings

      Set the display name and field description for the field.

      • Display name: The name of the field displayed in the chart.

      • Field description: A description for the field, which can be formatted as Text or a Link.

        • For text, enter the description.

          image

          After the configuration is complete, you can view the text by hovering over the icon to the right of the field.

          image

        • For a link, configure the link description, icon style, and URL.

          image

          The default icon style is image. You can select other icon styles as needed.

          image

          Click the image icon on the right to visit the link. imageAfter the configuration is complete, you can click the icon to the right of the field to navigate to the corresponding link.

          image

          Note

          The link can be opened in a new window, a centered pop-up window, or the current window. The link's opening behavior is determined by the Field description setting in the report configuration.

          image

    • Hide field

      If you hide a field, it no longer appears in the report. You can also unhide it.

      image

      Delete field

      Hover the pointer over the measure field and click the image.png icon on the right.

Configure dimension fields

Text fields

This example shows how to configure the product_type field as a dimension field.

  1. Hover over the dimension field and click the image.png icon on the right.

    image

  2. Configure the Sort parameter based on your business requirements. Valid values:

    image

    • Alignment

      Horizontal alignment: Auto, Left, Center, Right.

      Vertical alignment: Auto, Top, Middle, Bottom.

    • Sort

      Unsort, Ascend, Descend, Ascend within group, Descend within group, Custom, Field sort, Advanced sort.

      Select Custom to drag the field to the specified area.

      Untitled.gif

    • Advanced calculation

      None, TopN.

      For more information, see TopN.

    • Null value display style

      You can set the display style for null values or empty strings.

      • Null value:

        • Display as '-'

      • Empty string:

        • Display as '-'

    • Field display settings

      Set the field's display name and field description.

      • Display name: The field name that appears in the chart.

      • Field description: A description for the field that supports both text and link formats.

        • For text, enter the description.

          image

          After adding a description, click the icon to the right of the field to view it.

          image

        • To use a link, configure the link text and URL.

          image

          The default icon style is image. You can select other icon styles.

          image

          Click the image icon on the right to open the link.

          image

          After you configure the link, you can click the icon to the right of the field to open the link.

          image

          Note

          You can open the link in one of the following ways: Open in new window, Open in a centered pop-up window, or Open in current window. The opening method is determined by the field description settings in the report configuration.

          image

    • Hide field

      After you hide a field, it does not appear in the report. You can also unhide it.

  3. Drill down the dimension field.

    Hover over the dimension field and click the image.png icon on the right.

  4. Delete the dimension field.

    Hover over the dimension field and click the image.png icon on the right.

Date fields

If your field is a date type, in addition to the standard dimension field settings, you can also configure the date display format. Take the order date (day) field as an example:

  1. Move the pointer over the field and configure the date display format for the field by following instructions shown in the following figure.

    image.png

    Configuration effect

    Untitled.gif

Syntax and capabilities

You can enter a custom format pattern for the data display format. This table describes the special symbols available in the pattern.

Symbol

Name

Description

0

Number placeholder (zero-padding)

Displays a 0 for a missing digit. For example, 000

pads a number with leading zeros to ensure it is at least three digits long.

#

Number placeholder (optional digit)

Displays a digit if present; otherwise, it displays nothing.

.

Decimal point

Separates the integer and decimal parts of a number. The . symbol is always used as the decimal point, regardless of locale.

,

Thousands separator

Inserts a separator between groups of three digits (for example, 1,000,000). Note: This is a group separator, not a decimal point.

E

Scientific notation

Displays a number in scientific (exponential) notation. Follow this symbol with at least one 0 or # to format the exponent.

%

Percentage

Multiplies the number by 100 and appends a % symbol. Consecutive % symbols (for example, %%) are not supported.

Per mille

Multiplies the number by 1,000 and appends a ‰ symbol. Consecutive ‰ symbols (for example, ‰‰) are not supported.

;

Positive/negative format separator

Separates the format into two sections. The first section applies to positive numbers and zero, and the second section applies to negative numbers.

'

Single quote

Encloses text to display it as a literal string.

Note

Any characters not in the table above (for example, letters, Chinese characters, or parentheses) are treated as literal text and output as-is. To treat a special symbol as a literal character, enclose it in single quotes.

Symbol details and examples

Number placeholders: 0 and #

The difference between these placeholders is their padding behavior:

  • 0: Pads with zeros to meet the specified number of digits. This is useful for fixed-length displays, such as IDs.

  • #: Displays only significant digits and suppresses non-significant zeros.

Note
  • Do not insert any characters between # and 0 except for ., ,, and E. Other characters are treated as literals and appended to the end of the number.

  • When # and 0 are used together: in the integer part, 0 must be to the right of #, and in the decimal part, 0 must be to the left of #.

Pattern

Input

Output

Description

000

5

005

Pads with leading zeros to meet the three-digit minimum.

###

5

5

Does not pad with zeros.

0.00

1234.501

1234.50

Displays at least one integer digit; rounds to two decimal places, padding with a zero if necessary.

#.##

1234.501

1234.5

Displays at least one integer digit; rounds to a maximum of two decimal places and omits trailing zeros.

#.00

5

5.00

Forces the display of two decimal places.

0000.000

12.3

0012.300

Pads the integer part to four digits and the decimal part to three digits.

Thousands separator: ,

Pattern

Input

Output

Description

,##0

1234567

1,234,567

Adds a thousands separator.

#,##0.00

1234.567

1,234.57

Commonly used for currency formats.

#,###0

12345.67

12,346

Adds a thousands separator and rounds the number to an integer.

Decimal point: .

Pattern

Input

Output

Description

0.00

123.4

123.40

Fixed to two decimal places.

0.####

123.456

123.456

Up to four decimal places, omitting trailing zeros.

Scientific notation: E

Pattern

Input

Output

Description

0.00E0

12345.67

1.23E4

Displays in scientific notation with an integer exponent.

0.00E00

12345.67

1.23E04

Exponent has at least two digits.

0.######E0

0.000123

1.23E-4

Adjusts decimal places and exponent.

Percentage: %

Pattern

Input

Output

Description

0%

0.123

12%

Displays as a percentage with no decimal places.

0.00%

0.123

12.30%

Displays as a percentage with two decimal places.

Note

Consecutive % symbols (for example, %%) are not supported.

Per mille:

Pattern

Input

Output

Description

0‰

0.1234

123‰

Displays as per mille with no decimal places.

0.00‰

0.1234

123.40‰

Displays as per mille with two decimal places.

Note

Consecutive symbols (for example, ‰‰) are not supported.

Positive/negative format separator: ;

Pattern

Input

Output

Description

0.00;▼0.00

123.45

123.45

Applies the positive format (0.00).

-123.45

▼123.45

Applies the negative format (▼0.00).

Profit:+0.00;Loss:-0.00

123.45

Profit:+123.45

Custom prefixes for positive and negative numbers.

-123.45

Loss:-123.45

Note

A ; with no content before or after it is not supported, for example: ;0.00m.

Single quote: '

Pattern

Input

Output

Description

'Result:'0.00

123.45

Result:123.45

Inserts a text prefix.

'#'000

5

#005

Escapes a special character to treat it as a literal.

Note

To display special formatting characters as literals (for example, #, 0, ., or ,), enclose them in single quotes. Otherwise, parsing errors or unexpected formatting can occur.

Common format quick reference

Requirement

Recommended pattern

Retain two decimal places

0.00

Thousands separator with two decimal places

#,##0.00

Percentage with two decimal places

0.00%

Scientific notation

0.00E0

Show negative numbers in parentheses

0.00;(0.00)

Display units (e.g., currency, meters)

¥#,##0.00

0.00m

Fixed-width zero-padding (e.g., 5 digits)

00000

Optional decimals (up to 4 places)

#.####