Introduction au Module Qt Charts
Le module Qt Charts fournit un ensemble de composants de visualisation de données prêts à l'emploi. Basé sur le framework Graphics View de Qt, il permet une intégration fluide dans les interfaces utilisateur modernes. Les graphiques peuvent être instanciés sous forme de QWidget, de QGraphicsWidget ou de types QML. L'apparence peut être personnalisée via des thèmes prédéfinis ou des modifications manuelles des propriétés visuelles.
Configuration du Projet
Pour utiliser les classes C++ de Qt Charts, il est nécessaire d'inclure l'en-tête principal et d'utiliser l'espace de noms associé :
#include <QtCharts>
using namespace QtCharts;
Remarque importante : Si vous utilisez Qt Quick, assurez-vous que votre application hérite de QApplication et non de QGuiApplication, car le rendu de Qt Charts dépend du framework Graphics View.
Pour lier le module, ajoutez la directive suivante dans votre fichier .pro (qmake) :
QT += charts
Ou, si vous utilisez CMake :
find_package(Qt6 COMPONENTS Charts REQUIRED)
target_link_libraries(mon_projet PRIVATE Qt6::Charts)
Types de Graphiques Disponibles
La bibliothèque prend en charge une grande variété de représentations graphiques :
- Courbes linéaires (Line Chart)
- Courbes splines (Spline Chart)
- Graphiques en aires (Area Chart)
- Nuages de points (Scatter Chart)
- Diagrammes à barres (Bar Chart)
- Diagrammes circulaires (Pie Chart)
- Boîtes à moustaches (Box-and-Whisker Chart)
- Graphiques en chandeliers (Candlestick Chart)
- Graphiques polaires (Polar Chart)
Architecture du Framework
L'architecture de Qt Charts s'inspire fortement du framework Graphics View, bien qu'elle soit simplifiée pour la visualisation de données. Contrairement à Graphics View qui nécessite une scène (QGraphicsScene), Qt Charts peut s'affihcer directement via un widget dédié.
- Séries de données : Représentent les points ou segments de données (équivalent aux items graphiques).
- QChart : Agit comme un conteneur qui gère les séries, les axes et la légende.
- QChartView : Le widget de rendu qui affiche le
QChart.
La Classe QChart
QChart orchestre la représentation graphique des différentes séries, des légendes et des axes. Bien qu'il s'agisse techniquement d'un QGraphicsWidget pouvant être ajouté à une scène, il est généralement utilisé via QChartView pour simplifier la gestion de la mise en page. Il existe également QPolarChart pour les représentations en coordonnées polaires.
La Classe QChartView
QChartView est un widget autonome conçu pour afficher un objet QChart. Il gère les interactions utilisateur, comme le zoom et le déplacement, et ne nécessite pas de QGraphicsScene pour fonctionner.
La Classe QLegend
QLegend est responsable de l'affichage de la légende du graphique. Son état est automatiquement mis à jour lorsque les séries sont modifiées. Par défaut, elle est rattachée au graphique, mais elle peut être détachée pour être positionnée lbirement dans l'interface.
La Classe QValueAxis
QValueAxis permet d'ajouter un axe de valeurs numériques au graphique. Il est hautement configurable : il est possible de définir la plage de valeurs, le nombre de graduations, le format des étiquettes, ainsi que l'apparence de la ligne d'axe et de la grille.
Exemple d'Implémentation : Nuage de Points avec Axes Personnalisés
L'exemple suivant illustre la création d'un nuage de points avec des axes X et Y configurés pour afficher des données environnementales :
void EnvironmentalDataWidget::setupScatterPlot()
{
m_chart->removeAllSeries();
auto temperatureSeries = new QScatterSeries();
temperatureSeries->setName("Capteurs environnementaux");
temperatureSeries->setMarkerShape(QScatterSeries::MarkerShapeCircle);
temperatureSeries->setMarkerSize(8.5);
temperatureSeries->setColor(QColor("#E74C3C"));
temperatureSeries->append(18.2, 42.5);
temperatureSeries->append(21.4, 47.8);
temperatureSeries->append(24.9, 53.1);
m_chart->addSeries(temperatureSeries);
// Configuration de l'axe horizontal (Température)
auto axisX = new QValueAxis();
axisX->setTitleText("Température (°C)");
axisX->setRange(15.0, 30.0);
axisX->setTickCount(6);
axisX->setGridLineColor(QColor("#ECF0F1"));
m_chart->addAxis(axisX, Qt::AlignBottom);
temperatureSeries->attachAxis(axisX);
// Configuration de l'axe vertical (Humidité)
auto axisY = new QValueAxis();
axisY->setTitleText("Humidité (%)");
axisY->setRange(40.0, 60.0);
axisY->setTickCount(5);
axisY->setGridLineColor(QColor("#ECF0F1"));
m_chart->addAxis(axisY, Qt::AlignLeft);
temperatureSeries->attachAxis(axisY);
}