Qt Charts Vue d'ensemble

Qt Charts Qt 5 permet de créer des interfaces utilisateur élégantes, interactives et centrées sur les données. Qt Charts utilise le Graphics View Framework pour faciliter l'intégration. Les composants graphiques peuvent être utilisés en tant qu'objets QWidget ou QGraphicsWidget ou en tant que types QML.

La classe QChart gère la représentation graphique de différents types de séries et d'autres objets liés au graphique, tels que la légende et les axes. QChart est un QGraphicsWidget qui peut être affiché dans un QGraphicsScene. Une solution plus simple consiste à afficher un graphique dans une mise en page en utilisant la classe de commodité QChartView au lieu de QChart. En QML, les graphiques sont affichés à l'aide du type ChartView.

Certains composants graphiques peuvent également être présentés sous forme de graphiques polaires en utilisant la classe QPolarChart qui est une spécialisation de la classe QChart ou le type PolarChartView QML qui est une spécialisation du type ChartView.

L'aspect et la convivialité des graphiques peuvent être personnalisés en utilisant des thèmes, en modifiant les couleurs et les propriétés, en masquant les composants des graphiques ou en animant les graphiques.

Les mappeurs de modèles permettent d'utiliser un modèle de données dérivé de la classe QAbstractItemModel comme source de données pour un graphique. Les mappes de modèle peuvent être horizontales ou verticales.

Types de graphiques

Le module Qt Charts fournit les types de graphiques suivants :

• Graphiques linéaires et splines
• Graphiques de surface et de dispersion
• Diagrammes à barres
• Graphiques à secteurs
• Graphiques en boîte et à moustaches
• Graphiques en chandeliers
• Graphiques polaires

Chaque type de graphique est représenté par une classe dérivée QAbstractSeries ou un type dérivé AbstractSeries en QML. Les graphiques sont créés en utilisant une instance d'une classe de série et en l'ajoutant à une instance QChart ou ChartView.

Par exemple :

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

Ou, en QML :

ChartView {
    id: chart
    title: "Top-5 car brand shares in Finland"
    anchors.fill: parent
    legend.alignment: Qt.AlignBottom
    antialiasing: true

    property variant othersSlice: 0

    PieSeries {
        id: pieSeries
        PieSlice { label: "Volkswagen"; value: 13.5 }
        PieSlice { label: "Toyota"; value: 10.9 }
        PieSlice { label: "Ford"; value: 8.6 }
        PieSlice { label: "Skoda"; value: 8.2 }
        PieSlice { label: "Volvo"; value: 6.8 }
    }

    Component.onCompleted: {
        // You can also manipulate slices dynamically, like append a slice or set a slice exploded
        othersSlice = pieSeries.append("Others", 52.0);
        pieSeries.find("Volkswagen").exploded = true;
    }
}

import QtQuick

Vous pouvez combiner différents types de séries dans un même graphique.

Graphiques linéaires et splines

Les graphiques linéaires et splines présentent les données sous la forme d'une série de points de données reliés par des lignes. Dans un graphique linéaire, les points de données sont reliés par des lignes droites, tandis que dans un graphique spline, ils sont reliés par une spline. La spline est dessinée à l'aide de QPainterPath.

Un graphique linéaire est implémenté en utilisant la classe QLineSeries ou le type QML LineSeries.

Un graphique en courbes est implémenté en utilisant la classe QSplineSeries qui hérite de QLineSeries ou le type SplineSeries qui hérite de LineSeries.

Pour plus d'informations, voir Création de graphiques linéaires et Création de graphiques splines. Pour un exemple de combinaison d'un graphique à lignes et d'un graphique à barres et d'utilisation d'un axe commun pour les deux, voir Combiner un graphique à lignes et un graphique à barres.

Graphiques à aires et à nuages de points

Les diagrammes de surface présentent les données sous la forme d'une zone délimitée par deux lignes, tandis que les diagrammes de dispersion présentent les données sous la forme d'une collection de points.

Un diagramme de surface est mis en œuvre à l'aide de la classe QAreaSeries ou du type QML AreaSeries. Par défaut, l'axe des x est utilisé comme l'une des limites et QLineSeries ou LineSeries comme l'autre. Toutefois, vous pouvez utiliser QLineSeries ou LineSeries comme les deux limites.

Un diagramme de dispersion est mis en œuvre en utilisant la classe QScatterSeries ou le type QML ScatterSeries.

Pour plus d'informations, voir Création de diagrammes de surface et Création de diagrammes de dispersion.

Diagrammes à barres

Un diagramme à barres présente les données sous forme de barres horizontales ou verticales regroupées par catégorie. La classe QBarSet et le type QML BarSet représentent un ensemble de barres dans un diagramme à barres. La classe QAbstractBarSeries est une classe parentale abstraite pour toutes les classes de séries de barres, et le type AbstractBarSeries est le type parent des types de séries de barres. Le type de série détermine la manière dont les données sont présentées.

La classe QBarSeries et le type QML BarSeries présentent les données sous forme de barres verticales regroupées par catégorie. De même, la classe QHorizontalBarSeries et le type HorizontalBarSeries QML présentent les données sous forme de barres horizontales.

La classe QStackedBarSeries et le type StackedBarSeries présentent une série de données sous forme de barres empilées verticalement, avec une barre par catégorie. La classe et le type horizontaux correspondants sont respectivement QHorizontalStackedBarSeries et HorizontalStackedBarSeries.

La classe QPercentBarSeries et le type PercentBarSeries QML présentent une série de données catégorisées sous forme de pourcentage de chaque catégorie. La classe et le type horizontaux correspondants sont respectivement QHorizontalPercentBarSeries et HorizontalPercentBarSeries.

Pour plus d'informations, voir Création de diagrammes à barres, Création de diagrammes à barres empilées horizontales, Création de diagrammes à barres horizontales et Création de diagrammes à barres horizontales en pourcentage.

Diagrammes circulaires

Les diagrammes circulaires présentent les données sous la forme d'une tarte composée de parts de tarte. Le camembert est implémenté à l'aide de la classe QPieSeries ou du type QML PieSeries et les parts de camembert sont ajoutées à l'aide de la classe QPieSlice ou du type QML PieSlice.

La tarte peut être transformée en beignet en spécifiant une taille de trou comprise entre 0,0 et 1,0.

Pour plus d'informations, voir Graphiques avec la galerie de widgets, Création d'un graphique de ventilation en beignet et Création de graphiques en beignet imbriqués.

Graphiques en boîte et moustaches

Les diagrammes en boîte et moustaches présentent les données sous forme de quartiles prolongés par des moustaches qui montrent la variabilité des valeurs. Les éléments des séries de diagrammes en boîte sont regroupés par catégorie, de la même manière que les ensembles de barres dans les séries de barres. Pour chaque élément du diagramme en boîte et moustaches, la valeur extrême inférieure, le quartile inférieur, la médiane, le quartile supérieur et la valeur extrême supérieure sont spécifiés.

Un graphique de type boîte et moustaches est mis en œuvre à l'aide des classes QBoxPlotSeries et QBoxSet ou des types QML BoxPlotSeries et BoxSet.

Pour plus d'informations, voir Création de graphiques en boîte et moustaches.

Graphiques en chandelier

Les graphiques en chandeliers présentent une série de données sous forme de chandeliers.

Un graphique en chandelier est mis en œuvre à l'aide des classes QCandlestickSeries et QCandlestickSet ou des types QML CandlestickSeries et CandlestickSet.

Graphiques polaires

Les graphiques polaires présentent les données dans un graphique circulaire, où l'emplacement des données est basé sur l'angle et la distance par rapport au centre du graphique, le pôle.

La classe QPolarChart est une spécialisation de la classe QChart. Elle prend en charge les séries de lignes, de splines, d'aires et de nuages de points, ainsi que tous les types d'axes qu'elles prennent en charge. L'axe peut être utilisé comme axe radial ou angulaire. En QML, le type correspondant est PolarChartView.

Pour plus d'informations, voir Création de diagrammes polaires et Utilisation de diagrammes polaires avec QML.

Les axes

Qt Charts prend en charge les types d'axes suivants :

• Axe des valeurs
• Axe de catégorie
• Axe des catégories de barres
• Axe des dates et heures
• Axe des valeurs logarithmiques

Un axe peut être configuré pour afficher une ligne avec des points de contrôle, des lignes de grille et des nuances. Les valeurs de l'axe sont dessinées à l'emplacement des marques de pointage. Tous les types d'axes sont des spécialisations de la classe QAbstractAxis ou du type QML AbstractAxis.

Un axe de valeur ajoute des valeurs réelles à l'axe d'un graphique. Il est implémenté à l'aide de la classe QValueAxis ou du type QML ValueAxis.

Un axe de catégorie est implémenté à l'aide de la classe QCategoryAxis ou du type QML CategoryAxis. Il possède des plages nommées et des largeurs de plage réglables.

L'axe des catégories de barres est similaire à l'axe des catégories, mais la largeur de la plage est la même pour toutes les plages. Un axe de catégorie de barres est mis en œuvre à l'aide de la classe QBarCategoryAxis ou du type QML BarCategoryAxis.

Un axe de date et d'heure ajoute des dates et des heures à l'axe d'un graphique. Il est implémenté à l'aide de la classe QDateTimeAxis ou du type QML DateTimeAxis.

Un axe logarithmique ajoute une échelle logarithmique à l'axe d'un graphique. Une échelle logarithmique est une échelle non linéaire basée sur des ordres de grandeur, de sorte que chaque marque de pointage sur l'axe correspond à la marque de pointage précédente multipliée par une valeur. Un axe logarithmique est mis en œuvre à l'aide de la classe QLogValueAxis ou du type QML LogValueAxis.

Plusieurs axes peuvent être définis pour un même graphique. Les axes peuvent être placés en bas, en haut, à gauche ou à droite du graphique. En outre, les axes peuvent être de types différents. Toutefois, il n'est pas possible de mélanger des types d'axes qui donneraient lieu à des domaines différents, par exemple en spécifiant QValueAxis et QLogValueAxis sur la même orientation.

Pour plus d'informations, voir Graphiques linéaires avec axes de date et d'heure, Utilisation d'axes de valeurs logarithmiques, Utilisation d'axes multiples et Utilisation d'axes avec QML.

Légende

Une légende est un objet graphique qui affiche la légende d'un graphique. Les objets de légende ne peuvent pas être créés ou supprimés, mais ils peuvent être référencés via la classe QChart ou le type QML ChartView. L'état de la légende est mis à jour par QChart ou ChartView lorsque les séries changent.

Une légende peut être positionnée en dessous ou au-dessus du graphique, ainsi qu'à gauche ou à droite de celui-ci. Par défaut, la légende est attachée à la vue du graphique, mais elle peut être détachée pour former un élément graphique distinct qui peut être déplacé librement.

Il est possible de masquer soit des marqueurs individuels de la légende, soit l'ensemble de la légende.

Les marqueurs de légende peuvent être modifiés en utilisant la classe de base QLegendMarker et les sous-classes pour chaque type de série : QAreaLegendMarker, QBarLegendMarker, QBoxPlotLegendMarker, QCandlestickLegendMarker, et QXYLegendMarker.

En QML, les marqueurs de légende peuvent être modifiés en créant des légendes personnalisées, comme l'illustre l'exemple de personnalisation des légendes.

Interaction avec les graphiques

Les utilisateurs finaux peuvent interagir avec les graphiques en y ajoutant dynamiquement des valeurs, en explorant les données, en effectuant des zooms avant et arrière, en faisant défiler les graphiques, en cliquant sur des éléments dans les graphiques ou en passant la souris au-dessus d'eux.

Dessiner des données de manière dynamique

Il est possible d'ajouter des données aux graphiques de manière dynamique et de faire en sorte que la vue du graphique défile automatiquement pour afficher les nouvelles données.

Pour plus d'informations, voir Création de graphiques Spline.

Exploration des données

Des effets d'exploration peuvent être appliqués aux diagrammes à barres ou à secteurs, par exemple. Lorsque les utilisateurs sélectionnent un élément du graphique, une vue plus détaillée de cet élément s'affiche. Pour ce faire, il suffit de supprimer la première série et d'en ajouter une autre.

Pour plus d'informations, voir Mise en œuvre de l'exploration.

Zoom et défilement

Les utilisateurs peuvent utiliser le clavier pour effectuer des zooms et des défilements. Ils peuvent faire défiler les graphiques à l'aide des touches fléchées et effectuer un zoom avant ou arrière sur les graphiques à l'aide des touches plus et moins. En outre, QRubberBand peut être utilisé pour sélectionner la zone à agrandir.

Sur les appareils tactiles, des gestes peuvent être utilisés pour effectuer des panoramiques et des zooms.

Pour plus d'informations, voir Exemple de ligne de zoom.

Cliquer et survoler

Vous pouvez connecter des slots aux signaux émis lorsque les utilisateurs finaux cliquent sur des éléments dans les graphiques ou les survolent avec la souris. Cela vous permet d'ajouter des éléments aux graphiques, tels que des callouts.

Pour plus d'informations, voir Dessiner un texte d'appel au-dessus d'un graphique.

Thèmes

Un thème est une collection intégrée de paramètres liés au style de l'interface utilisateur et appliqués à tous les éléments visuels d'un graphique, tels que les couleurs, les stylos, les pinceaux et les polices de caractères des séries, ainsi que les axes, le titre et la légende.

Qt Charts Le logiciel est livré avec les thèmes prédéfinis suivants :

• Thème clair, qui est le thème par défaut
• Thème bleu céruléen
• Thème foncé
• Thème brun sable
• Thème bleu du système de couleurs naturelles (NCS)
• Thème à fort contraste
• Thème bleu glacial
• Thème Qt

Les thèmes peuvent être personnalisés en changeant les couleurs, les stylos, les brosses et les polices. De nouveaux thèmes peuvent être ajoutés en modifiant le code source de Qt Charts.

Pour plus d'informations, voir la section Création de graphiques avec des thèmes.