Sequence Chart
Introduction
In social media, behavior monitoring, and other scenarios, it is often necessary to display different behaviors of different users at different times in the form of nodes and edges in linear time evolution. In order to better discover users' behavior preferences, it is also necessary to display behavior statistical information in the form of bar charts. The sequence chart based on linear time mapping can display data in this scenario.
Chart Structure
The sequence chart is essentially a combination of specific series and components.
The sequence chart is a chart type used to display time series data, which can show the changes in data over time. In a sequence chart, we recommend configuring at least one pair of event link series, while the bar series can be configured with 0 or several as needed:
- Bar Series: Represents the total count of time series data within a specific time interval in the form of a bar chart.
- dot series: Represents events occurring at a specific time point in the form of dots.
- link series: Represents the relationships between events in the form of edges.
Note: link series must be bound to the dot series through the 'dotSeriesIndex'
attribute because its drawing data and some configurations depend on the dot series.
Sequence charts typically also include the following components:
- Time Axis: The x-axis shared by all series, and the medium for mapping time-series data to graphic attributes.
- Zoom Axis: When the sequence data is too dense, the zoom axis component will be bound to the time axis to "control the zoom of time."
- Scrollbar: When there are too many parallel event series, i.e., too many categories in the y-direction, the scrollbar can be configured to "control the scrolling of the dot series and link series."
Quick Start
Key Configurations
Global configurations:
- The
appendPadding
attribute is used to configure the chart's padding. It is recommended that this be configured, otherwise, the dot and link series' title will overlap with the grid.
Time Axis Configuration:
- The
type
attribute is used to configure the axis type. Here, it is recommended to configuretime
to map time series data; note that the time axis only supports timestamp data. - The
layers
attribute is used to configure the parent and child axis configurations for the time axis, which is effective only when the axis is a time axis. The 0th item represents the parent axis, i.e., the bottom axis; the 1st item represents the child axis, i.e., the top axis. Configure the time format of the label throughtimeFormat
. Configure the interval in seconds through tickStep.
dot series configuration:
- The
xField
attribute declares the horizontal coordinate field for the dot series. - The
yField
attribute declares the vertical coordinate field for the dot series. - The
title
attribute declares the title field for the dot series; the title is located to the left of the timeline. - The
subTitle
attribute declares the subtitle field for the dot series; the subtitle is located below the title. - The
dotTypeField
attribute declares the event point grouping field for the dot series; event points in the same group have the same color. - The
highLightSeriesGroup
attribute declares the highlight group configuration for the dot series; when configuring theseriesGroupField
, you can specify a specific attribute group to be highlighted. - The
clipHeight
attribute declares the visible height of the dot series.
link series configuration: The link series data depends on the event series data.
- The
dotSeriesIndex
attribute declares the index of the associated dot series. - The
fromField
attribute declares the starting position field. - The
toField
attribute declares the ending position field. - The
dotTypeField
attribute declares the relationship type field.
Sequence Chart Features
Data
The sequence chart is mentioned above, including the bar series, dot series, and link series, which display different data and structures in the sequence chart.
Bar Series Data
For the bar series, it is necessary to display the total count of time series data within a specific time interval, which belongs to a type of frequency statistics, so its structure is similar to histograms.
- Two
numeric
fields, such as:start_time
end_time
- One
numeric
field, such as:value
The data is defined as follows:
dot series data
For the dot series, it needs to display a sequence of events made up of title
subTitle
grid
and other graphics, as well as specific events in the form of dot
graphics, so it is a nested data type.
link series data
For the link series, two fields need to be specified to specify the beginning and end of the link.
Note: The start field and end field data must correspond one-to-one with the node_name
data in the dot series data so that the link graphic can find the corresponding start and end positions when drawing.
Tooltip Configuration
As mentioned above, events or event relationships will come with some additional information,