Qt

QChartデュアルY軸リアルタイム更新グラフ



Qchart Dual Y Axis Real Time Update Graph



QChartデュアルY軸リアルタイム更新グラフ

序文

作業では、Y軸の二重折れ線グラフを作成する必要があります。また、QT関連のクラスのドキュメントを確認するだけでなく、情報があまりないため、記録してください。

準備ができました

まず、QChart、QSplineSeries(または他のシリーズ)、QValueAxis、および他のクラスの説明を理解するためのQTのヘルプドキュメントを通じて、翻訳は一種のオンライン翻訳であり、不快な場所を少し変更します。
QChart
QChartクラスは、グラフの系列、凡例、および軸のグラフィック表現を管理します。
QChartクラスは、グラフ内の線、凡例、および軸のグラフィック表現を管理します。
QChartは、QGraphicsSceneに表示できるQGraphicsWidgetです。さまざまなタイプのシリーズや、凡例や軸などの他のチャート関連オブジェクトのグラフィック表現を管理します。チャートをレイアウトで簡単に表示するには、QChartの代わりにコンビニエンスクラスQChartViewを使用できます。さらに、線、スプライン、面積、および散乱の系列は、QPolarChartクラスを使用して極座標チャートとして表示できます。
QChartは、QGraphicsSceneに表示できるQGraphicsWidgetです。さまざまなタイプのシリーズおよびその他のチャート関連オブジェクト(画像と軸)のグラフィック表現を管理します。チャートをレイアウトに表示するだけで、QChartの代わりにコンビニエンスクラスQChartViewを使用できます。さらに、直線、滑らかな曲線、面積、および散布図は、QPolarChartクラスによって極座標プロットとして表すことができます。
QSplineSeries
QSplineSeriesクラスは、データをスプライングラフとして表示します。
QSplineSeriesクラスは、データを滑らかなグラフとして表します。
スプラインシリーズは、スプラインを描画するためにQPainterPathに必要なデータポイントとセグメントコントロールポイントを格納します。コントロールポイントは、データが変更されると自動的に計算されます。アルゴリズムは、法線スプラインを描画できるように点を計算します。
スプラインシリーズは、滑らかな曲線を描くためにQPainterPathに必要なデータポイントとセグメントコントロールポイントを格納します。データが変更されると、コントロールポイントが自動的に計算されます。アルゴリズムは、滑らかな曲線を描くためにポイントを計算します。
QValueAxis
QValueAxisクラスは、グラフの軸に値を追加します。
QValueAxisクラスは、グラフの軸に値を追加します。
値軸は、目盛り、グリッド線、および陰影のある軸線を表示するように設定できます。軸の値は目盛りの位置に描かれています。
値軸を設定して、マーカー、グリッド線、および影で軸を表示できます。軸の値は、マークされた位置に描画されます。
QDateTimeAxis
QDateTimeAxisクラスは、グラフの軸に日付と時刻を追加します。
QDateTimeAxisクラスは、チャートの軸に日付と時刻を追加します。
QDateTimeAxisは、目盛り、グリッド線、および陰影のある軸線を表示するように設定できます。ラベルは、適切なDateTime形式を設定することで構成できます。 QDateTimeAxisは、西暦前4714年から西暦287396年までの日付で正しく機能します。 QDateTimeに関連するその他の制限については、QDateTimeのドキュメントを参照してください。
QDateTimeAxisを設定して、マーカーマーク、グリッド線、および影のある軸を表示できます。軸に表示される値は、適切な日時形式を設定することで構成できます。 QDateTimeAxisは、紀元前4714年から西暦287396年までの時間を表すことができます。 QDateTimeに関連するその他の情報については、QDateTimeのドキュメントを参照してください。
注意 :QDateTimeAxisは、qrealをfloatとして定義するプラットフォームでは無効になっています。
注意 :qrealがfloatとして定義されているプラ​​ットフォームでQDateTimeAxisを無効にします。
二重Y軸を設定するためのより重要な機能はQChartです。 addSeriesaddAxis 前者はQChartに線を追加する機能、後者は指定された位置に軸を追加する機能の2つです。そしてまた QSplineSeriesattachAxis 関数。 QTドキュメントの説明は次のとおりです。
void QChart :: addSeries(QAbstractSeries * シリーズ)
シリーズシリーズをチャートに追加し、所有権を取得します。
シリーズをチャートに追加すると、チャートがシリーズの所有権を取得します。つまり、チャートがシリーズの親になります。
注意 :新しく追加されたシリーズは、デフォルトではどの軸にもアタッチされません。シリーズがチャートに追加される前にcreateDefaultAxes()を使用してチャート用に作成されたものも含まれません。チャートが表示される前に新しく追加されたシリーズに軸がアタッチされていない場合、シリーズは、チャートのプロット領域にシリーズに正確に適合する範囲の軸があるかのように描画されます。同じグラフに軸が適切にアタッチされている他のシリーズも表示される場合、これは混乱を招く可能性があるため、シリーズが追加された後にcreateDefaultAxes()を呼び出すか、シリーズの軸を明示的にアタッチしてください。
注意 :デフォルトでは、新しく追加されたシリーズは、シリーズがチャートに追加される前にチャートのcreateDefaultAxes()関数によって作成されたものであっても、どの軸にもアタッチされません。チャートが表示される前に新しく追加されたシリーズに軸がアタッチされていない場合、シーケンスは、シリーズがチャートの描画領域に対応するのとまったく同じ範囲の軸であるかのように描画されます。同じチャートに他の一連の軸がアタッチされていることも示されている場合、混乱を招く可能性があるため、シリーズを追加した後に必ずcreateDefaultAxes()を呼び出すか、軸をシリーズに明示的に追加してください。
* void QChart :: addAxis(QAbstractAxis * 軸、Qt ::アライメントアライメント)
軸軸を、alignmentで指定されたとおりに整列されたチャートに追加します。チャートは軸の所有権を取得します。
チャートの指定された位置(左、下、右、上)に軸を追加します。このチャートは、軸の所有権を取得します。
bool QAbstractSeries :: attachAxis(QAbstractAxis * 軸)
軸で指定した軸をシリーズにアタッチします。
指定した軸をシリーズに追加します。
軸が正常に接続された場合はtrueを返し、そうでない場合はfalseを返します。
成功した場合はtrueを返し、そうでない場合はfalseを返します。
注意 :同じ方向の複数の軸が同じシリーズに接続されている場合、それらの最小値と最大値は同じになります。
注意 :同じシリーズの同じ方向に複数の軸がある場合、それらの最小値と最大値は同じです。



コードの実装

次に、コードの記述を開始し、QTを開きます。私のものはQT5.11で、新しいプロジェクトを作成し、.proファイルを追加します。

QT+=charts

QChartヘッダーファイルをソースファイルに追加します



#include #include

.cppファイルに名前空間を追加します

QT_CHARTS_USE_NAMESPACE //or using namespace QtCharts

次に、グラフィックスビューをQTデザイナのウィンドウに追加し、QChartViewにプロモートします。
画像
次に、ソースファイルを編集します。ここではコードを直接参照しています。コードはコメント付きで記述されています。
mainwindow.h

#ifndef MAINWINDOW_H #define MAINWINDOW_H #include #include #include #include namespace Ui { class MainWindow } class MainWindow : public QMainWindow { Q_OBJECT public: explicit MainWindow(QWidget *parent = 0) ~MainWindow() /*menbers**************************************************************************************/ / / Declare an instance of QChart, an instance of QSplineSeries QChart *chart QSplineSeries *series1 QSplineSeries *series2 / / Declare timer QTimer *timer /*funcions **************************************************************************************/ //Declare the function of the line and the function that initializes QChart void drawLine() void initChart() public slots: /*slot function**********************************************************************************/ / / Declare the timer slot function void timerDeal() private: Ui::MainWindow *ui } #endif // MAINWINDOW_H

mainwindow.cpp

#include 'mainwindow.h' #include 'ui_mainwindow.h' #include #include QT_CHARTS_USE_NAMESPACE MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this) / / Initialize QChart initChart() / / Set the timer, the slot is connected to timer = new QTimer() timer->setInterval(400) connect(timer,SIGNAL(timeout()),this,SLOT(timerDeal())) timer->start() } MainWindow::~MainWindow() { delete ui } / / Realize the initialization function of QChart void MainWindow::initChart() { / / Initialize the instance of QChart chart = new QChart() / / Initialize two instances of QSplineSeries series1 = new QSplineSeries() series2 = new QSplineSeries() / / Set the name of the two curves series1->setName('series1') series2->setName('series2') / / Add the curve to the QChart instance chart chart->addSeries(series1) chart->addSeries(series2) / / Declare and initialize the X axis, two Y axis QDateTimeAxis *axisX = new QDateTimeAxis() // QValueAxis *axisX = new QValueAxis() QValueAxis *axisY_1 = new QValueAxis() QValueAxis *axisY_2 = new QValueAxis() / / Set the range of the axis display axisX->setMin(QDateTime::currentDateTime().addSecs(-60 * 1)) axisX->setMax(QDateTime::currentDateTime().addSecs(0)) axisY_1->setMin(0) axisY_1->setMax(18) axisY_2->setMin(0) axisY_2->setMax(18) / / Set the grid points on the axis axisY_1->setTickCount(7) axisY_2->setTickCount(11) / / Set the name of the axis display axisX->setTitleText('X axis') axisY_1->setTitleText('axisY_1-series1') axisY_2->setTitleText('axisY_2-series2') / / Set the color of the axis, thickness, set the grid does not display axisY_1->setLinePenColor(QColor(Qt::darkBlue)) axisY_1->setGridLineColor(QColor(Qt::darkBlue)) axisY_2->setLinePenColor(QColor(Qt::darkGreen)) axisY_2->setGridLineColor(QColor(Qt::darkGreen)) axisY_1->setGridLineVisible(false) axisY_2->setGridLineVisible(false) QPen penY1(Qt::darkBlue, 3, Qt::SolidLine, Qt::RoundCap, Qt::RoundJoin) QPen penY2(Qt::darkGreen, 3, Qt::SolidLine, Qt::RoundCap, Qt::RoundJoin) axisY_1->setLinePen(penY1) axisY_2->setLinePen(penY2) / / Add the axis to the chart, // The second parameter of the addAxis function is to set the position of the axis. // There are only four options, below: Qt::AlignBottom, left: Qt::AlignLeft, right: Qt::AlignRight, top: Qt::AlignTop chart->addAxis(axisX, Qt::AlignBottom) chart->addAxis(axisY_1, Qt::AlignLeft) chart->addAxis(axisY_2, Qt::AlignRight) / / Associate the curve to the axis series1->attachAxis(axisX) series1->attachAxis(axisY_1) series2->attachAxis(axisX) series2->attachAxis(axisY_2) / / Display the chart to the window ui->graphicsView->setChart(chart) } / / Realize the line function, dynamic update void MainWindow::drawLine() { / / Each additional point changes the range of the X axis to achieve the dynamic update effect of the curve QDateTime bjtime = QDateTime::currentDateTime() qsrand(QTime(0,0,0).secsTo(QTime::currentTime())) chart->axisX()->setMin(QDateTime::currentDateTime().addSecs(-60 * 1)) chart->axisX()->setMax(QDateTime::currentDateTime().addSecs(0)) //When the earliest point on the curve exceeds the range of the X axis, the oldest point is removed. if(series1->count() > 119) { series1->removePoints(0,series1->count() - 119) } if(series2->count() > 119) { series2->removePoints(0,series2->count() - 119) } Int Y1 = qrand()%9 // randomly generate random numbers from 0 to 9 Int Y2 = 9 + qrand()%9// randomly generate 9 to 18 random numbers //Add a new point to the end of the curve series1->append(bjtime.toMSecsSinceEpoch(), Y1) series2->append(bjtime.toMSecsSinceEpoch(), Y2) } / / Implement the timer slot function void MainWindow::timerDeal() { / / Timing curve drawLine() }

最終的な効果、曲線、およびX軸の範囲は、時間の経過とともにリアルタイムで更新されます。
画像
画像

総括する

それを理解した後、この効果を達成することは難しくないと感じています。主な機能はほんの数例です。難しいことではありませんが、問題として解決して成長させることができます。

ステートメント

この記事のコードは私が書いたものです。この記事も私のオリジナルです。ソースを示してください。