| Qt实现柱状图、饼状图、折线图、曲线图 | 您所在的位置：网站首页 › 怎么制作两个饼状图 › Qt实现柱状图、饼状图、折线图、曲线图 |
Qt实现柱状图、饼状图、折线图、曲线图
|
文章目录
前言1.介绍2.效果
一、实现（以下代码必要部分都已加注释）1.集成后的CMyChart2.柱状图实现3.饼状图实现4.折线图实现5.曲线图实现
二、使用
前言
项目源码： 传送门 |版本声明：山河君，未经博主允许，禁止转载 1.介绍Qt图标（Qt Charts）出现晚于QWT、QCustomPlot，界面看起来也很优美，最主要的是要比后两种实现起来方便许多，当然，在自主灵活性上面就差了一点。 QChart已经集成在Qt5.7中，使用时在项目文件中加QT += charts即可，不过在安装Qt过程中，QChart默认时不勾选的，在安装时需要用户自行勾选。 柱状图：可设置标题栏，X轴标题， Y轴标题，柱形颜色，轴刻度，是否显示提示信息（柱形颜色含义）等 由于我的负责的项目中，以上四种图形都需要使用，所以使用开闭将这四种集成了一下，如果只使用一种，那么这一部分可以过滤不看，只需要将项目中的文件单独拿出来即可。 调用顺序：GetChartWithType->SetAxisXRange/SetAxisYRange/SetDateTimeAxisX->SetAxisXTitle/SetAxisYTitle->AppendSeries 头文件 #ifndef CMYCHART_H #define CMYCHART_H #include #include QT_CHARTS_USE_NAMESPACE struct BarDateInfo { QString qsKey; QVector vecVal; }; class CMyChart : public QObject { Q_OBJECT public: enum EType { eInvalid, //无效 eBarChart, //柱状图 ePieChart, //饼状图 eLineChart, //折线图 eSplineChart //曲线图 }; enum EColor { eBlue, //蓝色 eGreen, //绿色 eYellow, //黄色 ePurple, //紫色 eRed, //红色 eLightBlue, //淡蓝色 eLightGreen, //淡绿色 eLightYellow, //淡黄色 eLightPurple, //淡紫色 }; public: CMyChart(const CMyChart::EType& type, QChartView* pView, QObject *parent = nullptr); virtual ~CMyChart(); public: //根据选择的图形，返回CMyChart static CMyChart* GetChartWithType(const EType& eType, QChartView* pView); //根据传入颜色转换成QColor QColor toQColor(const EColor& eColor); public: //清空界面上显示的图形 virtual void ClearGraphical() = 0; //设置提示信息是否显示 void SetLegend(bool bLegend = true); //设置标题栏 void SetTitle(const QString& qsTitle); //设置X轴坐标、刻度尺，柱状图、饼状图调此接口无用 virtual void SetAxisXRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5){}; //设置Y轴坐标、刻度尺，柱状图、饼状图调此接口无用 virtual void SetAxisYRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5){}; //设置时间坐标轴，柱状图、饼状图调此接口无用 virtual void SetDateTimeAxisX(const QDateTime& dtStart, const QDateTime& dtEnd, const QString& qsFormat = "yyyy-MM-dd", const int& nTickCount = 5){}; //设置X轴标题，饼状图调此接口无用 virtual void SetAxisXTitle(const QString& qsAxisXTitle){}; //设置Y轴标题，柱状图调此接口无用 virtual void SetAxisYTitle(const QString& qsAxisYTitle){}; //柱状图添加一组数据 virtual void AppendSeries(const QString& qsAxisXName, QMap& mapData, const QVector& vecColors = m_vecDefCol){}; //饼状图添加数据 virtual void AppendSeries(QMap& mapData, const QVector& vecColors = m_vecDefCol){}; //折线图、曲线图添加一条线 virtual void AppendSeries(const QString& name, QMap mapVal){}; //折线图、曲线图添加坐标轴为时间的一条线 virtual void AppendSeries(const QString& name, QMap mapVal){}; public: EType m_eType; QChart* m_pChart; QChartView* m_pChartView; static QVector m_vecDefCol; //默认颜色顺序 }; #endif // CMYCHART_H源文件： #include "CMyChart.h" #include "CMyBarChart.h" #include "CMyPieChart.h" #include "CMyLineChart.h" #include "CMySplineChart.h" QVector CMyChart::m_vecDefCol = {eBlue, eGreen, eYellow, ePurple, eRed, eLightBlue, eLightGreen, eLightYellow, eLightPurple}; CMyChart::CMyChart(const CMyChart::EType& type, QChartView* pView, QObject *parent) : QObject (parent), m_eType(type), m_pChartView(pView) { m_pChart = new QChart; m_pChart->setAnimationOptions(QChart::SeriesAnimations); m_pChart->legend()->setVisible(true); //设置提示打开（默认打开） m_pChart->legend()->show(); //显示提示 m_pChart->layout()->setContentsMargins(0, 0, 0, 0); //设置布局边距 m_pChart->setMargins(QMargins(0, 0, 0, 0)); //设置控件边距 m_pChart->setBackgroundRoundness(0); //保存图表背景角上的圆角的直径。 m_pChartView->setChart(m_pChart); m_pChartView->setRenderHint(QPainter::Antialiasing); //防图形走样 } CMyChart::~CMyChart() { } CMyChart* CMyChart::GetChartWithType(const EType &eType, QChartView *pView) { if(pView == NULL) return NULL; switch (eType) { case eInvalid: return NULL; case eBarChart: return new CMyBarChart(eType, pView); case ePieChart: return new CMyPieChart(eType, pView); case eLineChart: return new CMyLineChart(eType, pView); case eSplineChart: return new CMySplineChart(eType, pView); default: return NULL; } } QColor CMyChart::toQColor(const EColor &eColor) { switch (eColor) { case eBlue: return QColor(0, 122, 255); case eGreen: return QColor(27, 201, 133); case eYellow: return QColor(255,168, 0); case ePurple: return QColor(37, 217, 255); case eRed: return QColor(252, 79, 76); case eLightBlue: return QColor(104, 153, 255); case eLightGreen: return QColor(37, 217, 255); case eLightYellow: return QColor(255, 211, 35); case eLightPurple: return QColor(212, 139, 250); default: return QColor(0, 122, 255); } } void CMyChart::SetLegend(bool bLegend) { if(bLegend) m_pChart->legend()->show(); else m_pChart->legend()->hide(); } void CMyChart::SetTitle(const QString &qsTitle) { m_pChart->setTitle(qsTitle); } 2.柱状图实现头文件： #ifndef CMYBARCHART_H #define CMYBARCHART_H #include #include "CMyChart.h" class CMyBarChart : public CMyChart { Q_OBJECT public: explicit CMyBarChart(const CMyChart::EType& type, QChartView* pView, QObject *parent = nullptr); virtual ~CMyBarChart(); public: virtual void ClearGraphical(); virtual void SetAxisXTitle(const QString& qsAxisXTitle); virtual void SetAxisYTitle(const QString& qsAxisYTitle); virtual void SetAxisYRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5); virtual void AppendSeries(const QString& qsAxisXName, QMap& mapData, const QVector& vecColors = m_vecDefCol); private: QValueAxis* m_pBarAxisY; QBarSeries* m_pBarSeries; QVector m_vecBarSet; QBarCategoryAxis* m_pBarAxisX; }; #endif // CMYBARCHART_H源文件 #include "CMyBarChart.h" CMyBarChart::CMyBarChart(const CMyChart::EType& type, QChartView* pView, QObject *parent) : CMyChart(type, pView, parent) { m_pBarSeries = new QBarSeries; //创建分组系列 m_pBarSeries->setLabelsVisible(true); //设置显示柱形图值 m_pBarSeries->setLabelsPosition(QAbstractBarSeries::LabelsInsideEnd); //设置值位置 m_pChart->addSeries(m_pBarSeries); //将分组放入chart容器 m_pChart->createDefaultAxes(); //创建默认坐标轴 m_pChart->legend()->setAlignment(Qt::AlignBottom); //设置提示说明位置 m_vecBarSet.fill(NULL, 10); //默认最多只能有10个柱子 } CMyBarChart::~CMyBarChart() { delete m_pBarSeries; delete m_pBarAxisX; delete m_pBarAxisY; } void CMyBarChart::ClearGraphical() { for(QVector::iterator it = m_vecBarSet.begin(); it != m_vecBarSet.end(); it++) { if(*it != NULL) delete *it; } m_vecBarSet.fill(NULL, 10); //默认最多只有10种类型的柱子 m_pBarAxisX->clear(); m_pBarSeries->clear(); } void CMyBarChart::SetAxisXTitle(const QString &qsAxisXTitle) { m_pBarAxisX->setTitleText(qsAxisXTitle); } void CMyBarChart::SetAxisYTitle(const QString &qsAxisYTitle) { m_pBarAxisY->setTitleText(qsAxisYTitle); } void CMyBarChart::SetAxisYRange(const qreal& qMin, const qreal& qMax, const int& nTickCount) { m_pBarAxisX = new QBarCategoryAxis; //创建X轴 m_pBarAxisY = new QValueAxis; //创建Y轴 m_pBarAxisX->setLabelsAngle(-45); //设置X轴坐标倾斜 m_pBarAxisY->setGridLineVisible(false); //设置网格不可见 m_pBarAxisY->setRange(qMin, qMax); m_pBarAxisY->setTickCount(nTickCount); m_pChart->setAxisX(m_pBarAxisX, m_pBarSeries); //将X坐标轴和分组进行统一 m_pChart->setAxisY(m_pBarAxisY, m_pBarSeries); //将Y坐标轴和分组进行统一 } /* * 一个QBarSet代表的是同一颜色的柱形，里面存放多个柱子的值 * 此接口先将一组数据作为柱子类型数的最大大小，然后根据先后顺序给柱子添加数据 */ void CMyBarChart::AppendSeries(const QString &qsAxisXName, QMap& mapData, const QVector &vecColors) { QMap::iterator it = mapData.begin(); for(int i = 0; i m_vecBarSet[i] = new QBarSet(it.key()); m_vecBarSet[i]->setColor(toQColor(vecColors[i])); } m_vecBarSet[i]->append(it.value()); m_pBarSeries->append(m_vecBarSet[i]); it++; } m_pBarAxisX->append(qsAxisXName); } 3.饼状图实现头文件 #ifndef CMYPIECHART_H #define CMYPIECHART_H #include #include "CMyChart.h" class CMyPieChart : public CMyChart { Q_OBJECT public: explicit CMyPieChart(const CMyChart::EType& type, QChartView* pView, QObject *parent = nullptr); virtual ~CMyPieChart(); public: virtual void ClearGraphical(); virtual void AppendSeries(QMap& mapData, const QVector& vecColors = m_vecDefCol); private slots: //点击扇形槽函数 void ClickedSector(QPieSlice* pSlice); private: QPieSeries* m_pPieSeries; }; #endif // CMYPIECHART_H源文件 #include "CMyPieChart.h" CMyPieChart::CMyPieChart(const CMyChart::EType& type, QChartView* pView, QObject *parent) : CMyChart(type, pView, parent) { m_pPieSeries = new QPieSeries; m_pPieSeries->setHoleSize(0.5); //设置空心占比 m_pPieSeries->setPieSize(0.8); //设置圆形占比 m_pChart->addSeries(m_pPieSeries); //将饼图放入容器 m_pChart->legend()->setAlignment(Qt::AlignRight); //设置提示说明位置 connect(m_pPieSeries, SIGNAL(clicked(QPieSlice*)), this, SLOT(ClickedSector(QPieSlice*))); //点击扇形 } CMyPieChart::~CMyPieChart() { delete m_pPieSeries; } void CMyPieChart::ClearGraphical() { m_pPieSeries->clear(); } void CMyPieChart::ClickedSector(QPieSlice* pSlice) { if(pSlice->isExploded()) //判断扇形有没有弹出 { pSlice->setExploded(false); pSlice->setLabelVisible(false); } else { pSlice->setExploded(true); //设置扇形弹出 pSlice->setLabelVisible(true); //设置扇形提示 } } void CMyPieChart::AppendSeries(QMap &mapData, const QVector &vecColors) { m_pPieSeries->clear(); QMap::iterator it = mapData.begin(); for(int i = 0; i Q_OBJECT public: explicit CMyLineChart(const CMyChart::EType& type, QChartView* pView, QObject *parent = nullptr); ~CMyLineChart(); public: virtual void ClearGraphical(); virtual void SetAxisXRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5); virtual void SetAxisYRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5); virtual void SetAxisXTitle(const QString& qsAxisXTitle); virtual void SetAxisYTitle(const QString& qsAxisYTitle); virtual void SetDateTimeAxisX(const QDateTime& dtStart, const QDateTime& dtEnd, const QString& qsFormat = "yyyy-MM-dd", const int& nTickCount = 5); virtual void AppendSeries(const QString& name, QMap mapVal); virtual void AppendSeries(const QString& name, QMap mapVal); private: bool m_bIsDateTime; QValueAxis* m_pLineAxisX; QValueAxis* m_pLineAxisY; QDateTimeAxis* m_pAxisDateTime; QVector m_vecLineSeries; }; #endif // CMYLINECHART_H源文件 #include "CMyLineChart.h" CMyLineChart::CMyLineChart(const CMyChart::EType& type, QChartView* pView, QObject *parent) : CMyChart(type, pView, parent) { m_bIsDateTime = false; } CMyLineChart::~CMyLineChart() { for(QVector::iterator it = m_vecLineSeries.begin(); it != m_vecLineSeries.end(); it++) delete *it; } void CMyLineChart::ClearGraphical() { for(QVector::iterator it = m_vecLineSeries.begin(); it != m_vecLineSeries.end(); it++) delete *it; m_vecLineSeries.clear(); } void CMyLineChart::SetAxisXRange(const qreal &qMin, const qreal &qMax, const int &nTickCount) { m_pLineAxisX = new QValueAxis; m_pLineAxisX->setRange(qMin, qMax); m_pLineAxisX->setTickCount(nTickCount); m_pChart->addAxis(m_pLineAxisX, Qt::AlignBottom); } void CMyLineChart::SetAxisYRange(const qreal &qMin, const qreal &qMax, const int &nTickCount) { m_pLineAxisY = new QValueAxis; m_pLineAxisY->setRange(qMin, qMax); m_pLineAxisY->setTickCount(nTickCount); m_pLineAxisY->setGridLineVisible(false); m_pChart->addAxis(m_pLineAxisY, Qt::AlignLeft); } void CMyLineChart::SetDateTimeAxisX(const QDateTime &dtStart, const QDateTime &dtEnd, const QString &qsFormat, const int &nTickCount) { m_bIsDateTime = true; m_pAxisDateTime = new QDateTimeAxis; m_pAxisDateTime->setFormat(qsFormat); m_pAxisDateTime->setRange(dtStart, dtEnd); m_pAxisDateTime->setTickCount(nTickCount); m_pChart->addAxis(m_pAxisDateTime, Qt::AlignBottom); } void CMyLineChart::SetAxisXTitle(const QString &qsAxisXTitle) { if(m_bIsDateTime) m_pAxisDateTime->setTitleText(qsAxisXTitle); else m_pLineAxisX->setTitleText(qsAxisXTitle); } void CMyLineChart::SetAxisYTitle(const QString &qsAxisYTitle) { m_pLineAxisY->setTitleText(qsAxisYTitle); } void CMyLineChart::AppendSeries(const QString &name , QMap mapVal) { QLineSeries* pLineSeries = new QLineSeries; pLineSeries->setName(name); pLineSeries->setPointsVisible(true); pLineSeries->setPointLabelsVisible(true); //设置显示点位 m_pChart->addSeries(pLineSeries); for(QMap::iterator it = mapVal.begin(); it != mapVal.end(); it++) pLineSeries->append(it.key(), it.value()); m_vecLineSeries.push_back(pLineSeries); pLineSeries->attachAxis(m_pLineAxisX); pLineSeries->attachAxis(m_pLineAxisY); } void CMyLineChart::AppendSeries(const QString &name, QMap mapVal) { QLineSeries* pLineSeries = new QLineSeries; pLineSeries->setName(name); pLineSeries->setPointsVisible(true); pLineSeries->setPointLabelsVisible(false); //设置显示点位 m_pChart->addSeries(pLineSeries); for(QMap::iterator it = mapVal.begin(); it != mapVal.end(); it++) pLineSeries->append(it.key().toMSecsSinceEpoch(), it.value()); m_vecLineSeries.push_back(pLineSeries); pLineSeries->attachAxis(m_pAxisDateTime); pLineSeries->attachAxis(m_pLineAxisY); } 5.曲线图实现头文件 #ifndef CMYSPLINECHART_H #define CMYSPLINECHART_H #include #include "CMyChart.h" class CMySplineChart : public CMyChart { Q_OBJECT public: explicit CMySplineChart(const CMyChart::EType& type, QChartView* pView, QObject *parent = nullptr); ~CMySplineChart(); public: virtual void ClearGraphical(); virtual void SetAxisXRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5); virtual void SetAxisYRange(const qreal& qMin = 0, const qreal& qMax = 10, const int& nTickCount = 5); virtual void SetAxisXTitle(const QString& qsAxisXTitle); virtual void SetAxisYTitle(const QString& qsAxisYTitle); virtual void SetDateTimeAxisX(const QDateTime& dtStart, const QDateTime& dtEnd, const QString& qsFormat = "yyyy-MM-dd", const int& nTickCount = 5); virtual void AppendSeries(const QString& name, QMap mapVal); virtual void AppendSeries(const QString& name, QMap mapVal); signals: public slots: private: bool m_bIsDateTime; QValueAxis* m_pLineAxisX; QValueAxis* m_pLineAxisY; QDateTimeAxis* m_pAxisDateTime; QVector m_vecSplineSeries; }; #endif // CMYSPLINECHART_H源文件 #include "CMySplineChart.h" CMySplineChart::CMySplineChart(const CMyChart::EType& type, QChartView* pView, QObject *parent) : CMyChart(type, pView, parent) { m_bIsDateTime = false; } CMySplineChart::~CMySplineChart() { for(QVector::iterator it = m_vecSplineSeries.begin(); it != m_vecSplineSeries.end(); it++) delete *it; } void CMySplineChart::ClearGraphical() { for(QVector::iterator it = m_vecSplineSeries.begin(); it != m_vecSplineSeries.end(); it++) delete *it; m_vecSplineSeries.clear(); } void CMySplineChart::SetAxisXRange(const qreal &qMin, const qreal &qMax, const int &nTickCount) { m_pLineAxisX = new QValueAxis; m_pLineAxisX->setRange(qMin, qMax); m_pLineAxisX->setTickCount(nTickCount); m_pChart->addAxis(m_pLineAxisX, Qt::AlignBottom); } void CMySplineChart::SetAxisYRange(const qreal &qMin, const qreal &qMax, const int &nTickCount) { m_pLineAxisY = new QValueAxis; m_pLineAxisY->setRange(qMin, qMax); m_pLineAxisY->setTickCount(nTickCount); m_pLineAxisY->setGridLineVisible(false); m_pChart->addAxis(m_pLineAxisY, Qt::AlignLeft); } void CMySplineChart::SetDateTimeAxisX(const QDateTime &dtStart, const QDateTime &dtEnd, const QString &qsFormat, const int &nTickCount) { m_bIsDateTime = true; m_pAxisDateTime = new QDateTimeAxis; m_pAxisDateTime->setFormat(qsFormat); m_pAxisDateTime->setRange(dtStart, dtEnd); m_pAxisDateTime->setTickCount(nTickCount); m_pChart->addAxis(m_pAxisDateTime, Qt::AlignBottom); } void CMySplineChart::SetAxisXTitle(const QString &qsAxisXTitle) { if(m_bIsDateTime) m_pAxisDateTime->setTitleText(qsAxisXTitle); else m_pLineAxisX->setTitleText(qsAxisXTitle); } void CMySplineChart::SetAxisYTitle(const QString &qsAxisYTitle) { m_pLineAxisY->setTitleText(qsAxisYTitle); } void CMySplineChart::AppendSeries(const QString &name , QMap mapVal) { QSplineSeries* pSplineSeries = new QSplineSeries; pSplineSeries->setName(name); pSplineSeries->setPointsVisible(true); pSplineSeries->setPointLabelsVisible(true); //设置显示点位 m_pChart->addSeries(pSplineSeries); for(QMap::iterator it = mapVal.begin(); it != mapVal.end(); it++) pSplineSeries->append(it.key(), it.value()); m_vecSplineSeries.push_back(pSplineSeries); pSplineSeries->attachAxis(m_pLineAxisX); pSplineSeries->attachAxis(m_pLineAxisY); } void CMySplineChart::AppendSeries(const QString &name, QMap mapVal) { QSplineSeries* pSplineSeries = new QSplineSeries; pSplineSeries->setName(name); pSplineSeries->setPointsVisible(true); pSplineSeries->setPointLabelsVisible(false); //设置显示点位 m_pChart->addSeries(pSplineSeries); for(QMap::iterator it = mapVal.begin(); it != mapVal.end(); it++) pSplineSeries->append(it.key().toMSecsSinceEpoch(), it.value()); m_vecSplineSeries.push_back(pSplineSeries); pSplineSeries->attachAxis(m_pAxisDateTime); pSplineSeries->attachAxis(m_pLineAxisY); } 二、使用使用QChart需要对于widget进行提升 码字不易，各位观众老爷，如果觉得有点用，还请点个赞，让我涨涨积分哈！ |
饼状图：可设置空心圆、实心圆、点击扇形弹出（信息可编辑）、提示信息（扇形颜色含义）、空心大小比例，图形名称等 
折线图：可多条线一起显示、X轴名称、刻度尺，Y轴名称、刻度尺，提示信息，图形名称，X轴为时间轴等 
曲线图：可多条线一起显示、X轴名称、刻度尺，Y轴名称、刻度尺，提示信息，图形名称，X轴为时间轴等 
项目源码：传送门【本文地址】
公司简介
联系我们