WT Bar Chart

Pattern

The pattern configuration of a WT bar chart is similar to that of a bar chart. For details, see Pattern.

Data

The data structure of the WT bar chart is as follows:

[
  {
"x": "Type A",
    "y1": 40,
    "y2": 20,
    "y3": 10
  },
  {
"x": "Type B",
    "y1": 50,
    "y2": 30,
    "y3": 20
  },
  {
"x": "Type C",
    "y1": 60,
    "y2": 40,
    "y3": 30
  },
  {
"x": "Type D",
    "y1": 70,
    "y2": 50,
    "y3": 40
  },
  {
"x": "Type E",
    "y1": 80,
    "y2": 60,
    "y3": 50
  },
  {
"x": "Type F",
    "y1": 85,
    "y2": 83,
    "y3": 60
  }
]

• The x field indicates the category.
• The y field indicates the data series (group). Y maps different fields to indicate different data series (groups). Data is displayed in groups based on the fields mapped by y.
  • Add a data series: Click next to y to add a data series. To delete an added series, click on the right of the series.

    Add a series as follows:

    • Series Value: field name in the mapped source data.
    • Series Name: self-definable. If the series name is empty, the series value is used as the series name by default.
    • Color: color of the column in the series.
    • Stack: stack name. You can enter a user-defined name. If the same stack name is set for different series of the same category (with the same x value), the series data is displayed in the stack.
    • Link: target link to which the web page points when a data item in component widget is clicked.
    • Link Mode:
      • New window: The target link opens a new browser window.
      • Current page: The target link opens a window in the current browser window.
      • Floating panel: The target link opens a floating window in the center of the current screen.
  • Configure a data series: Click in front of the data series, and then configure the specified style (such as the series name and color) of the series on the expanded panel.

Interaction

For details about whether the component supports the interaction function and how to use the interaction function, see Configuring Component Interaction.