QT中使用图表之QChart绘制X轴为日期时间轴的折线图

显然X轴是日期时间轴的话，那么我们使用的轴类就得是QDateTimeAxis

QChart中日期时间轴的精度是毫秒

因此图表里面的数据的x值需要是一个毫秒数，才能显示出来

---------------------------------------------------------------------------------------------------------------------------------

步骤和画折线图一模一样，只不过使用的轴是日期时间轴QDateTimeAxis

1、创建图表视图

QChartView* view=new QChartView(this);

2、创建图表

QChart* chart=new QChart();

3、将图表设置给图表视图

view->setChart(chart);

4、构建x轴-日期时间轴，设置轴的属性，并将轴添加到图表中

在设置轴的范围时，传入的是2个QDateTime

QDateTimeAxis * axisX = new QDateTimeAxis(this);
axisX -> setTitleText("时间轴"); //设置轴的标题
axisX -> setRange(QDateTime(QDate(2000, 01, 01), QTime(0, 0, 0)),
    			  QDateTime(QDate(2000, 12, 31), QTime(0, 0, 0))); //设置时间轴的范围,参数是两个时期时间QDateTime
axisX -> setTickCount(13); //设置刻度个数
axisX -> setFormat("MM月dd日"); //设置刻度值的格式，和格式化时间字符串一样
axisX -> setLabelsAngle(45);
chart -> addAxis(axisX, Qt::AlignBottom); //添加轴

5、构建y轴-数值轴，设置轴的属性，并将轴添加到图表中

QValueAxis * axisY = new QValueAxis(this);
axisY -> setRange(1000, 2000);
axisY -> setTickCount(11);
axisY -> setTitleText("Y轴");
chart -> addAxis(axisY, Qt::AlignLeft);

6、构建图标里的系列（具体的图），将系列添加到图表中

在追加数据点时，x轴的是需要的是一个毫秒数，才能显示出来

QLineSeries * line = new QLineSeries(this);
line -> setName("时间轴"); //设置图例文本
//要调用毫米精度的这个函数toMSecsSinceEpoch()转成时间戳,否则显示不出来
line -> append(QDateTime(QDate(2000, 01, 01), QTime(0, 0, 0)).toMSecsSinceEpoch(), 1200);
line -> append(QDateTime(QDate(2000, 02, 01), QTime(0, 0, 0)).toMSecsSinceEpoch(), 1400);
line -> append(QDateTime(QDate(2000, 03, 01), QTime(0, 0, 0)).toMSecsSinceEpoch(), 1100);
line -> append(QDateTime(QDate(2000, 04, 01), QTime(0, 0, 0)).toMSecsSinceEpoch(), 1600);
line -> append(QDateTime(QDate(2000, 05, 01), QTime(0, 0, 0)).toMSecsSinceEpoch(), 1300);
chart -> addSeries(line);

7、将轴附加到系列，是点显示在正确的位置上

line->attachAxis(axisX);
line->attachAxis(axisY);

完整代码

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include<QtCharts>
#include<QHBoxLayout>

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr) : QWidget(parent)
    {
        resize(800,600);
        QHBoxLayout* h_box=new QHBoxLayout(this);

        DrawLineOfTime();

    }
    ~Widget()=default;

    //绘制横坐标为时间的折线图
    void DrawLineOfTime()
    {
        //1、创建图表视图
        QChartView* view=new QChartView(this);

        this->layout()->addWidget(view);

        //2.创建图表
        QChart* chart=new QChart();

        //3.将图表设置给图表视图
        view->setChart(chart);

        //设置标题
        chart->setTitle("时间图");
        chart->legend()->show();//显示或者隐藏图例（默认显示）

        //4.构建x轴-日期时间轴
        QDateTimeAxis* axisX=new QDateTimeAxis(this);
        axisX->setTitleText("时间轴");//设置轴的标题
        axisX->setRange(QDateTime(QDate(2000,01,01),QTime(0,0,0)),
                        QDateTime(QDate(2000,12,31),QTime(0,0,0)));//设置时间轴的范围,参数是两个时期时间QDateTime
        axisX->setTickCount(13);//设置刻度个数
        axisX->setFormat("MM月dd日");//设置刻度值的格式，和格式化时间字符串一样
        axisX->setLabelsAngle(45);
        chart->addAxis(axisX,Qt::AlignBottom);//添加轴

        //5.构建y轴-数值轴
        QValueAxis* axisY=new QValueAxis(this);
        axisY->setRange(1000,2000);
        axisY->setTickCount(11);
        axisY->setTitleText("Y轴");
        chart->addAxis(axisY,Qt::AlignLeft);

        //6.构建折线系列
        QLineSeries* line=new QLineSeries(this);
        line->setName("时间轴");//设置图例文本
        //要调用毫米精度的这个函数toMSecsSinceEpoch()转成时间戳,否则显示不出来
        line->append(QDateTime(QDate(2000,01,01),QTime(0,0,0)).toMSecsSinceEpoch(),1200);
        line->append(QDateTime(QDate(2000,02,01),QTime(0,0,0)).toMSecsSinceEpoch(),1400);
        line->append(QDateTime(QDate(2000,03,01),QTime(0,0,0)).toMSecsSinceEpoch(),1100);
        line->append(QDateTime(QDate(2000,04,01),QTime(0,0,0)).toMSecsSinceEpoch(),1600);
        line->append(QDateTime(QDate(2000,05,01),QTime(0,0,0)).toMSecsSinceEpoch(),1300);
        chart->addSeries(line);

        //7、将xy轴附加到折线
        line->attachAxis(axisX);
        line->attachAxis(axisY);

    }

  

   
};
#endif // WIDGET_H

QT中使用图表之QChart绘制X轴为日期时间轴的折线图

悦读