QtCharts 数据游标 鼠标选中数据 散点图

QtCharts 数据游标

鼠标左键选中数据后，显示该点的坐标值，效果图如下。

实现方法

利用QtCharts实现散点图的绘制，数据游标功能。

• 包含头文件，声明命名空间

#include <QtCharts>
QT_CHARTS_USE_NAMESPACE

• 在pro文件中添加

QT += charts

绘制散点图

    QChart *chart =ui->chartwindow->chart();
    chart->setTitle("y=sin(x)");            //设置图表标题
    chart->setTitleFont(QFont("Times",16)); //设置标题字体
    chart->legend()->setVisible(false);     //隐藏图例

    QScatterSeries *series = new QScatterSeries();
    QPen pen;
    pen.setColor(Qt::blue);
    pen.setWidth(1);
    series->setPen(pen);

    for (double i=-8;i<=8;i+=1)
    {
        double x = i;
        double y = sin(i);
        series->append(x,y);
    }

    chart->addSeries(series);
    chart->createDefaultAxes();
    chart->axisX()->setRange(-9,9);//设置坐标轴范围
    chart->axisY()->setRange(-2,2);

实现数据游标功能

利用QGraphicsSimpleTextItem显示数据点的坐标值，利用信号与槽的机制实现数据游标的鼠标跟随与显示。

• 创建数据游标文本

QGraphicsSimpleTextItem *cursorData;
cursorData = new QGraphicsSimpleTextItem(chart);

• 使用到的信号

void QXYSeries::clicked(const QPointF &point)

信号含义：当用户单击图表中的点触发鼠标事件时，会发出此信号。

• 实现槽函数

void DataCursorWidget::showCursorData(const QPointF &point){
    QPoint curPos = mapFromGlobal(QCursor::pos());
    cursorData->setPos(curPos.x(),curPos.y());
    cursorData->setText(QString("%1,%2").arg(point.x()).arg(point.y()));
}

• 信号与槽函数的连接

connect(series, &QScatterSeries::clicked, this,&DataCursorWidget::showCursorData);