1、绘制多条曲线
上一节中简单介绍了如何使用QCustomPlot绘制一条简单的曲线,下面将介绍如何通过QCustomPlot绘制多条曲线。
如下是参考官网的代码,绘制两条曲线,代码如下:
void MainWindow::plotDemo2()
{
plot=this->ui->widget;
//添加第一条曲线
plot->addGraph();
plot->graph(0)->setPen(QPen(Qt::blue));
plot->graph(0)->setBrush(QBrush(QColor(0,0,255,20)));
//第二条曲线
plot->addGraph();
plot->graph(1)->setPen(QPen(Qt::red));
//模拟数据点(x,y1)代表第一条曲线,(x,y2)代表第二条曲线
QVector<double> x(251),y1(251),y2(251);
for(int i=0;i<251;i++)
{
x[i]=i;
y1[i]=qExp(-i/150.0) * qCos(i/10.0);
y2[i]=qExp(-i/150.0);
}
//显示上面和右面的坐标轴,但不显示值
plot->xAxis2->setVisible(true);
plot->xAxis2->setTickLabels(false);
plot->yAxis2->setVisible(true);
plot->yAxis2->setTickLabels(false);
//设置数据曲线的值
plot->graph(0)->setData(x,y1);
plot->graph(1)->setData(x,y2);
//自动调整X,Y坐标范围
plot->graph(0)->rescaleAxes(true);
plot->graph(1)->rescaleAxes(true);
//设置曲线的特性:支持鼠标拖拽、图层缩放、鼠标左键选择图层
plot->setInteractions(QCP::iRangeDrag | QCP::iRangeZoom | QCP::iSelectPlottables);
//刷新
plot->replot();
}
如下是效果图:
每一条曲线都是通过addGraph()来实现的,当我们没有手动设置坐标轴范围时,可以通过rescaleAxes()来自动调整坐标轴范围。
2、绘制柱状图
如下是通过QCPBars来绘制柱状图,代码如下:
void MainWindow::plotDemo3()
{
//柱状图的X.Y坐标
QCPAxis *xAxis=this->ui->widget->xAxis;
QCPAxis *yAxis=this->ui->widget->yAxis;
QCPBars *bars=new QCPBars(xAxis,yAxis);
bars->setAntialiased(true); //设置抗锯齿
bars->setName("柱状图实例");
bars->setVisible(true);
//设置画笔和画刷
bars->setPen(QPen(QColor("#B2F63D")));
bars->setBrush(QBrush(QColor("#95EC00")));
//坐标轴刻度范围与文字
QVector<double>ticks;
QVector<QString>labels;
ticks<<1<<2<<3<<4<<5<<6<<7;
labels<<"C"<<"Python"<<"C++"<<"Java"<<"GO"<<"Rust"<<"VB";
QSharedPointer<QCPAxisTickerText> tickerText(new QCPAxisTickerText);
tickerText->addTicks(ticks,labels);
xAxis->setTicker(tickerText); //设置坐标轴文字
xAxis->setTickLabelRotation(60); //设置坐标轴文字旋转
xAxis->setSubTicks(false); //不显示子刻度
xAxis->setRange(0,8);
xAxis->setLabel("编程语言");
xAxis->setUpperEnding(QCPLineEnding::esSpikeArrow);
yAxis->setRange(0,10000); //设置y轴范围
yAxis->setPadding(35); //设置y轴内边距
yAxis->setLabel("学习人数");
yAxis->setUpperEnding(QCPLineEnding::esSpikeArrow);
QVector<double>dataNum;
dataNum<<9500<<8790<<8678<<8437<<4985<<3490<<2920;
bars->setData(ticks,dataNum); //给柱状图设置值
}
效果图如下: