Docs

Intelligent Data Insight

Chart Introduction

Line Chart

1. Overview

Line charts are plotted on a graph corresponding to points and connected by straight lines, which show the increase or decrease of data over time or other variables through the rise or fall of the lines. This product provides a variety of line chart components, allowing users to flexibly configure line styles, legends, labels, etc. of line charts to more clearly analyze and present data changes.

2. Quick start

2.1 Common usage scenarios

The line chart can clearly show the trend of data increase or decrease, the speed of increase or decrease, the law of increase or decrease, and the peak value, etc. It is suitable for showing the trend of data changing with a certain dimension. For example, [sales——price] change with [sale_province].
Table example

2.2 Example of use process

Step 1: set up dimensions, metrics, and filters
Select [sale_province] as the dimension and [price] as the metric.

Step 2: select Chart Panel - Line Chart

Step 3: modify the chart format as needed

3. Function introduction

3.1 Line chart icon

3.2 Configuration rules

Line charts support plotting after setting one or more dimensions and one or more metrics.
Dimensions: Supports one or more dimensions.

The first dimension will be the x-axis.
If there is more than one dimension, the second and more dimensions will generate multiple polylines for display, using different colors to distinguish them.

Metrics: Supports one or more metrics.

The metric value will be displayed as a line.
If there is more than one metric. The second and more metrics will generate multiple polylines for display, using different colors to distinguish, and you can adjust the line style configuration yourself.

Example 1: 1 dimension, 2 metrics.

Example 2: 2 dimensions, 1 metric.

3.3 Editing Colors

You can set the corresponding color for the line chart, and the product has a variety of built-in color schemes.

Support Custom Color Schemes.

3.4 Line style

Effective scope: You can set different display styles for a specified piece of data.

Line type: you can choose polyline, smooth, thick and thin lines, as well as solid lines, dotted lines, dotted lines;
Mark: You can choose no marking point, hollow circle, solid circle, square, rhombus, and choose the size of the marking (1-5 optional). At the same time, it supports the selection of "follow line width" and "custom":

Follow the line width: the diameter of the marking point is consistent with the line width. When adjusting the line width, the diameter of the marking point changes synchronously.
Customization: Manually set the diameter of the marker point, support the input of values greater than 0 (including decimals), the unit is px.

Example: Line type smooth, thickness = 5, dotted line; mark hollow circle, size = 5.

3.5 X-axis/Y-axis

See 3.5 X axis/Y axis.

3.6 Grid lines

See 3.6 Grid lines.

3.7 Special value

See 3.7 Special values.

3.8 Legends and labels

Legend:

You can click the switch button on the right to choose to display or not to display the legend information;
You can set the display position of the legend in the chart, above, below, left, and right.
You can set the alignment of the legend: top/left alignment, center alignment, bottom/right alignment.
You can set the maximum number of columns, font, and color for the legend.
You can set the way to display the legend. When there are too many legends, you can choose two display effects: page flipper or scroll bar.

Label:

You can click the switch button on the right to choose to display or not to display the label information;

Support selecting default styles and custom styles.

Custom style support to set the display position;

Custom style supports setting the display mode;

Note: Only one can be selected between "Sparse display" and "Allow overlap". If one of them is selected, the other is grey out, prompting "Allow overlap and Sparse display cannot be selected at the same time". When the label display is crowded by default, it is recommended to select "sparse display".