Line Chart

Configurable options for the line chart.

Line charts are ideal for trend analysis of data. They are particularly suited for the following scenarios:

  • Time-series data: such as stock prices, temperature changes, sales figures, etc., reflecting trends over time.
  • Comparing trends across multiple datasets: for example, comparing performance across different regions or products over the same time period.
  • Identifying fluctuations, periodicity, peaks, inflection points, and other features in the data.

Basic Mode

In basic mode, drawing a line chart requires:

  1. X-axis and Data: select columns via the dropdown menus. These are required.
  2. Color Scheme: select a color scheme from the dropdown. The default is the "Default" color scheme.
  3. Template: select a template using the "Change" button. If not selected, the default template is used.
  4. Visibility: specify whether the X-axis, Y-axis, tooltip, and legend are visible. By default, the X-axis and tooltip triggered by the cursor are displayed.

Advanced Mode

In advanced mode, more option values can be adjusted.

Axis

This includes both X and Y axes.

  • Corresponding Column (X, Y): select columns from the data using the dropdown. X is required, and Y is optional. If no Y column is selected, the chart will automatically adjust.
  • Visibility: controlled via the toggle button above.
  • Line Color: the default is , indicating that the axis line is not displayed. You can click to select a color from the color palette or enter a HEX value to specify your preferred color. indicates using the default color.
  • Line Width: specifies the thickness of the axis line.

Ticks and labels:

  • Label: configure the color, font weight, and rotation angle of the labels.
  • Format: use formulas to process the label text.
  • Line: by default, it is not displayed. When enabled, you can configure the thickness and length of the ticks.
  • Layout: configure the minimum distance between ticks and the spacing between ticks and labels.
  • Numeric: when the axis column corresponds to numeric data, you can specify the number of ticks.
  • Inside: controls whether the ticks and labels are displayed inside or outside the axis.

Chart/Line

A chart can display multiple lines, and you can add or remove lines using the and buttons at the top right corner of the panel.

For each line, the options include:

  • Data: select a column from the data using a dropdown menu.
  • Line: configure the style of the connecting line and the data point outlines. You can configure the line type, including linear, natural, monotone, and step. Additionally, you can set the color, width, and dash type.
  • Dot: configure the style of data points. You can set the fill color, radius, and also independently configure the style when the cursor is focused (Active).
  • Label: by default, the data point labels are not displayed. When enabled, you can configure the color, font size, position, and offset.

Layout

Includes:

  • Margin: configure the top, bottom, left, and right margins of the drawing area (including the axis).
  • Grid: configure whether the horizontal and vertical gridlines are displayed.

Description

Used to configure the display of supplementary information for the chart.

  • Title: configure the title of the chart, located at the top of the chart.
  • Description: configure the description of the chart, located below the title.
  • Footer: configure the footer text of the chart, located at the bottom of the chart.
  • Tooltip: configure whether to display the tooltip, its offset, and whether the cursor line is shown.
  • Legend: configure whether to display the legend, its position on the chart. By default, it is positioned at the bottom of the chart, below the X-axis and above the footer text.