Qt literacy-Qt chart class overview

I. Overview

Qt Charts supports the creation of stylish, interactive, data-centric user interfaces. For easy integration, Qt Charts uses a graphics view framework. Chart widgets are available as QWidget or qgraphicwidget objects or as QML types.

The QChart class manages the graphical representation of different types of series and other chart-related objects such as legends and axes. QChart is a qgraphicwidget that can be displayed in QGraphicsScene. A simpler solution is to display the chart in the layout by using the convenience class QChartView instead of QChart. In QML, charts are displayed using the ChartView type.
Some chart components can also be displayed as polar charts by using the specialization of the QPolarChart class of the QChart class or the specialization of the PolarChartView QML type of the ChartView type.
You can customize the appearance of the chart by using themes, modifying colors and properties, hiding chart components, or animating the chart.
The model mapper allows to use a data model derived from the QAbstractItemModel class as a data source for a chart. Model mappers can be either horizontal or vertical.

2. Chart type

The Qt Charts module provides the following chart types:

• Line and Slick Line Charts
• Area and scatter charts
• histogram
• pie chart
• box plot
• Candlestick chart (similar to the stock limit line)
• Constellation

Each chart type is represented by a QAbstractSeries-derived class or AbstractSeries-derived type in QML.

Charts are created by taking an instance of the Series class and adding it to a QChart or ChartView instance.

For example:

  QLineSeries* series = new QLineSeries();
  series->add(0, 6);
  series->add(2, 4);
  ...
  chartView->chart()->addSeries(series);
  chartView->chart()->createDefaultAxes();

or in QML:

  import QtQuick 2.0
  import QtCharts 2.0

  ChartView {
    
    
      width: 400
      height: 300
      theme: ChartView.ChartThemeBrownSand
      antialiasing: true

      PieSeries {
    
    
          id: pieSeries
          PieSlice {
    
     label: "eaten"; value: 94.9 }
          PieSlice {
    
     label: "not yet eaten"; value: 5.1 }
      }
  }

We can combine different types of series in one chart.

1. Line chart and column chart

Line and smooth line charts represent data as a series of data points connected by lines. In a line chart, the data points are connected by straight lines, while in a slurred line chart, the data points are connected by slurs. Slurs are drawn using QPainterPath.

The effect is as follows:

Line charts are implemented using the QLineSeries class or the LineSeries QML type.

The smooth line chart is implemented by using the QSplineSeries class that inherits QLineSeries or the SplineSeries type that inherits LineSeries.

2. Area chart and scatter chart

An area chart represents data as an area connected by two lines, while a scatter chart represents data as a collection of points.

Area charts are implemented using the QAreaSeries class or the AreaSeries QML type. By default, the x-axis is used as one boundary and the QLineSeries or LineSeries as the other. However, you can use both QLineSeries or LineSeries as boundaries.

Scatterplots are implemented using the QScatterSeries class or the ScatterSeries QML type.

3. Histogram

Bar charts represent data as horizontal or vertical bars grouped by category. The QBarSet class and the BarSet QML type represent a set of bars in a bar chart.

The QAbstractBarSeries class is the abstract parent class of all bar series classes, and the AbstractBarSeries type is the parent class of the bar series types. The sequence type determines how the data is presented.

The QBarSeries class and the BarSeries QML type represent data as vertical bars grouped by category. Similarly, the QHorizontalBarSeries class and the HorizontalBarSeries QML type represent data as horizontal bars.

The QStackedBarSeries class and StackedBarSeries type represent a series of data as vertically stacked bars, one bar for each category. The corresponding horizontal classes and types are QHorizontalStackedBarSeries and HorizontalStackedBarSeries respectively.

The QPercentBarSeries class and the PercentBarSeries QML type represent a series of categorical data as a percentage for each category. The corresponding horizontal classes and types are QHorizontalPercentBarSeries and HorizontalPercentBarSeries respectively.

4. Pie chart

A pie chart represents data as a pie chart composed of pie slices. Pies are implemented using the QPieSeries class or PieSeries QML type, and pie slices are added using the QPieSlice class or PieSlice QML type.
You can turn a pie into a donut by specifying a hole size between 0.0 and 1.0.

5. Box and Whisker Plot

Box-and-whisker plots represent data as quartiles, with extended whiskers showing variability in values. Items in a box plot series are grouped by category, similar to the sets of bars in a bar plot series. For each box-and-whisker entry, the lower bound, lower quartile, median, upper quartile, and upper extremum are specified.
Box-and-whisker plots are implemented using the QBoxPlotSeries and QBoxSet classes or the BoxPlotSeries and BoxSet QML types.

6. Candlestick Charts

Candlestick charts present a series of data in the form of candlesticks.

Candlestick charts are implemented by using the QCandlestickSeries and QCandlestickSet classes or the CandlestickSeries and CandlestickSet QML types.

7. Constellation Charts

A polar plot displays data as a circular graph where the location of the data is based on the angle and distance from the center (pole) of the graph.

The QPolarChart class is a specialization of the QChart class. It supports line, spline, area and scatter series, and all axis types they support. Axes can be used as both radial and angular axes. In QML, the corresponding type is PolarChartView.
See Polar Plot Example and Qml Polar Plot for more information.
#

Three, the coordinate axis Axes

Qt Charts supports the following axis types:

• value axis
• category axis
• bar category axis
• date-time axis
• log value axis

Qt Charts supports axes that can be set to display lines with markers, gridlines and shading. Values ​​on the axis are plotted at the marked positions. All axis types are specializations of the QAbstractAxis class or the AbstractAxis QML type.

Axes can be set to tick marks, grid lines and hatching. The values ​​on the axis are plotted at the locations of the tick marks. All axis types are specializations of the QAbstractAxis class or the AbstractAxis QML type.

A value axis adds actual values ​​to the axis of the chart. It is implemented using the QValueAxis class or the ValueAxis QML type.

Category axes are implemented using the QCategoryAxis class or the CategoryAxis QML type . It has named ranges and adjustable range widths.

A bar category axis is similar to a category axis, but all ranges have the same range width. The bar category axis is implemented using the QBarCategoryAxis class or the BarCategoryAxis QML type.

Date-Time Axis adds dates and times to chart axes. It is implemented using the QDateTimeAxis class or the DateTimeAxis QML type.

Log axis adds a logarithmic scale to the axes of the chart. A logarithmic scale is a magnitude-based, non-linear scale, so each tick on the axis is the previous tick multiplied by a value. Log axes are implemented using the QLogValueAxis class or the LogValueAxis QML type.

Multiple axes can be defined for a chart. Axes can be placed at the top, bottom, left, and right of the chart. Also, axes can be of different types. However, mixing axis types is not supported, which would result in different domains, such as specifying QValueAxis and QLogValueAxis in the same direction.

4. Legend

Legend is a graphics object that displays a legend for the chart. Legend objects cannot be created or deleted, but they can be referenced through the QChart class or the ChartView QML type. The legend state is updated by QChart or ChartView when the series changes.
The legend can be positioned below or above the graph, or to the left or right of the graph. By default, the legend is attached to the graph view, but it can be detached to a separate graph item that can be moved freely.
Individual markers in the legend can be hidden, or the entire legend can be hidden.
Legend markers can be modified by using the QLegendMarker base class and subclasses for each of the series types: QAreaLegendMarker, QBarLegendMarker, QBoxPlotLegendMarker, QCandlestickLegendMarker, and QXYLegendMarker.

5. Interact with the chart

Users can interact with the chart by dynamically adding values ​​to the chart, focusing deeply on data, zooming in and out on the chart, scrolling the chart, clicking on items in the chart, or hovering over the chart.

1. Dynamically plot data

You can dynamically add data to the chart and have the chart view automatically scroll to display the new data .

2. Dive into the data

For example, the drill-down effect can be implemented as a bar chart or a pie chart. When the user selects an item in the chart, a more detailed view of that item is displayed.
For example, you can implement a drill-down effect on a bar chart or a pie chart. When the user selects an item in the diagram, a more detailed view of that item is displayed. This is achieved by removing the first sequence and adding another sequence.

3. Zoom and Scroll

Users can use the keyboard to zoom and scroll. They can scroll the chart with the arrow keys, and zoom in or out with the plus and minus keys. Additionally, QRubberBand can be used to select an area to zoom in.
On touch devices, gestures can be used to pan and zoom.

4. Mouseover

Slots can be connected to signals emitted when the end user clicks an item in the chart or hovers the mouse over the chart. This enables you to add elements, such as callouts, to the diagram.

6. Theme

A theme is a built-in collection of UI style-related settings applied to all visual elements of a chart, such as colors, pens, brushes, and font families, as well as axes, titles, and legends.

Qt charts have the following predefined themes:

• Light theme, which is the default theme
• sky blue theme
• dark theme
• Sand Theme
• Natural Color System (NCS) blue theme
• High contrast theme
• Ice Blue Theme
• Qt theme

Themes can be customized by changing colors, pens, brushes and fonts. New themes can be added by modifying the source code of Qt Charts .

It is to set the coordinate line and the line for saving the graph.

Note: Changing the theme will overwrite any customizations previously applied to the series.