QT与ECharts交互，绘制曲线图,X轴显示日期时间

我使用的是QWebengineView,在pro文件内添加：

QT       += webenginewidgets

然后在设计窗口添加一个widget控件提升为QWebengineView：

.cpp 代码如下：

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QDebug>
#include <QJsonArray>
#include <QJsonDocument>
#include <QByteArray>
 
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
 
    ui->widget->load(QUrl("file:///" + qApp->applicationDirPath()+"/html/line.html"));
}
 
MainWindow::~MainWindow()
{
    delete ui;
}
 
 
void MainWindow::on_pushButton_clicked()
{
    QStringList list_Date;
    QStringList list_PD;
    QStringList list_QX;
    QStringList list_DK;
    QStringList list_ZJ;
    QStringList list_CF;
 
    QJsonArray num_josn;
    QJsonArray num_josnPD;
    QJsonArray num_josnQX;
    QJsonArray num_josnDK;
    QJsonArray num_josnZJ;
    QJsonArray num_josnCF;
 
    QJsonDocument num_document;
    QJsonDocument num_documentPD;
    QJsonDocument num_documentQX;
    QJsonDocument num_documentDK;
    QJsonDocument num_documentZJ;
    QJsonDocument num_documentCF;
 
    QByteArray num_byteArray;
    QByteArray num_byteArrayPD;
    QByteArray num_byteArrayQX;
    QByteArray num_byteArrayDK;
    QByteArray num_byteArrayZJ;
    QByteArray num_byteArrayCF;
 
    QDateTime tim = QDateTime::currentDateTime();
 
    QString aa = tim.toString("yyyy-MM-dd");
    QString aa_2 = tim.addDays(-1).toString("yyyy-MM-dd");
    QString aa_3 = tim.addDays(-2).toString("yyyy-MM-dd");
    QString aa_4 = tim.addDays(-3).toString("yyyy-MM-dd");
    QString aa_5 = tim.addDays(-4).toString("yyyy-MM-dd");
    QString aa_6 = tim.addDays(-5).toString("yyyy-MM-dd");
    QString aa_7 = tim.addDays(-6).toString("yyyy-MM-dd");
    QString aa_8 = tim.addDays(-7).toString("yyyy-MM-dd");
 
    QDateTime timeDate;
    timeDate = QDateTime::fromString(aa,"yyyy-MM-dd");
    int time_Int = timeDate.toTime_t();
 
    QDateTime timeDate_2;
    timeDate_2 = QDateTime::fromString(aa_2,"yyyy-MM-dd");
    int time_Int_2 = timeDate_2.toTime_t();
 
    QDateTime timeDate_3;
    timeDate_3 = QDateTime::fromString(aa_3,"yyyy-MM-dd");
    int time_Int_3 = timeDate_3.toTime_t();
 
    QDateTime timeDate_4;
    timeDate_4 = QDateTime::fromString(aa_4,"yyyy-MM-dd");
    int time_Int_4 = timeDate_4.toTime_t();
 
    QDateTime timeDate_5;
    timeDate_5 = QDateTime::fromString(aa_5,"yyyy-MM-dd");
    int time_Int_5 = timeDate_5.toTime_t();
 
    QDateTime timeDate_6;
    timeDate_6 = QDateTime::fromString(aa_6,"yyyy-MM-dd");
    int time_Int_6 = timeDate_6.toTime_t();
 
    QDateTime timeDate_7;
    timeDate_7 = QDateTime::fromString(aa_7,"yyyy-MM-dd");
    int time_Int_7 = timeDate_7.toTime_t();
 
    QDateTime timeDate_8;
    timeDate_8 = QDateTime::fromString(aa_8,"yyyy-MM-dd");
    int time_Int_8 = timeDate_8.toTime_t();
 
    QString time_List = QString::number(time_Int);
    QString time_List_2 = QString::number(time_Int_2);
    QString time_List_3 = QString::number(time_Int_3);
    QString time_List_4 = QString::number(time_Int_4);
    QString time_List_5 = QString::number(time_Int_5);
    QString time_List_6 = QString::number(time_Int_6);
    QString time_List_7 = QString::number(time_Int_7);
    QString time_List_8 = QString::number(time_Int_8);
 
    list_Date << time_List_8<<time_List_7<< time_List_6<<time_List_5
              << time_List_4<<time_List_3<< time_List_2<<time_List;
 
    list_PD   << "5"<<"8"<<"10"<<"12"<<"2"<<"9"<<"20"<<"5";
    list_QX   << "10"<<"3"<<"15"<<"22"<<"5"<<"8"<<"12"<<"8";
    list_DK   << "20"<<"5"<<"1"<<"1"<<"12"<<"3"<<"10"<<"3";
    list_ZJ   << "12"<<"11"<<"2"<<"3"<<"19"<<"4"<<"15"<<"8";
    list_CF   << "2"<<"17"<<"13"<<"8"<<"14"<<"11"<<"1"<<"7";
 
    if(list_Date.size() <= 10)
    {
        for(int i=0;i<list_Date.size();i++)
        {
            num_josn.append(list_Date.at(i).toDouble());
            num_josnPD.append(list_PD.at(i).toDouble());
            num_josnQX.append(list_QX.at(i).toDouble());
            num_josnDK.append(list_DK.at(i).toDouble());
            num_josnZJ.append(list_ZJ.at(i).toDouble());
            num_josnCF.append(list_CF.at(i).toDouble());
        }
    }
    else if(list_Date.size() > 10)
    {
        for(int i=list_Date.size()-10;i<list_Date.size();i++)
        {
            num_josn.append(list_Date.at(i).toDouble());
            num_josnPD.append(list_PD.at(i).toDouble());
            num_josnQX.append(list_QX.at(i).toDouble());
            num_josnDK.append(list_DK.at(i).toDouble());
            num_josnZJ.append(list_ZJ.at(i).toDouble());
            num_josnCF.append(list_CF.at(i).toDouble());
        }
    }
 
    num_document.setArray(num_josn);
    num_documentPD.setArray(num_josnPD);
    num_documentQX.setArray(num_josnQX);
    num_documentDK.setArray(num_josnDK);
    num_documentZJ.setArray(num_josnZJ);
    num_documentCF.setArray(num_josnCF);
 
    num_byteArray = num_document.toJson(QJsonDocument::Compact);
    num_byteArrayPD = num_documentPD.toJson(QJsonDocument::Compact);
    num_byteArrayQX = num_documentQX.toJson(QJsonDocument::Compact);
    num_byteArrayDK = num_documentDK.toJson(QJsonDocument::Compact);
    num_byteArrayZJ = num_documentZJ.toJson(QJsonDocument::Compact);
    num_byteArrayCF = num_documentCF.toJson(QJsonDocument::Compact);
 
    QString numJos(num_byteArray);
    QString numJosPD(num_byteArrayPD);
    QString numJosQX(num_byteArrayQX);
    QString numJosDK(num_byteArrayDK);
    QString numJosZJ(num_byteArrayZJ);
    QString numJosCF(num_byteArrayCF);
 
    QString command = QString("addX(\"%1\")").arg(numJos);
    QString commandPD = QString("addPD(\"%1\")").arg(numJosPD);
    QString commandQX = QString("addQX(\"%1\")").arg(numJosQX);
    QString commandDK = QString("addDC(\"%1\")").arg(numJosDK);
    QString commandZJ = QString("addZJ(\"%1\")").arg(numJosZJ);
    QString commandCF = QString("addCF(\"%1\")").arg(numJosCF);
 
    ui->widget->page()->runJavaScript(command);
    ui->widget->page()->runJavaScript(commandPD);
    ui->widget->page()->runJavaScript(commandQX);
    ui->widget->page()->runJavaScript(commandDK);
    ui->widget->page()->runJavaScript(commandZJ);
    ui->widget->page()->runJavaScript(commandCF);
}

运行如图：

源码下载链接： https://download.csdn.net/download/qq_43510515/12753432

个人感觉echarts图形会美观很多。