QAreaSeries 类详解

QAreaSeries 类详解（中文翻译）

QAreaSeries 类用于在区域图中展示数据，是 Qt Charts 模块的一部分。区域图是一种填充在两个数据集之间或数据集和 X 轴之间的图表类型，用于表示数值的范围或累积值。QAreaSeries 主要通过一组 QLineSeries（线图）来定义区域。

---

QAreaSeries 的功能和特点

1. 区域绘制：
   • 区域可以位于一条线和 x 轴之间，也可以位于两条线之间。
2. 填充和边框样式：
   • 区域支持填充颜色或渐变，以及边框样式。
3. 灵活的数据设置：
   • 数据通过 QLineSeries 提供，可以对数据进行动态更新。
4. 多种交互方式：
   • 支持悬停、点击等事件响应。

---

QAreaSeries 的常用方法

以下是 QAreaSeries 提供的一些常用方法：

构造函数

• QAreaSeries(QLineSeries *upperSeries, QLineSeries *lowerSeries = nullptr, QObject *parent = nullptr);
  • 用一组 QLineSeries 定义区域。
  • upperSeries 定义上边界线。
  • lowerSeries 定义下边界线（如果为空，则下边界默认为 X 轴）。

设置和获取边界线

• QLineSeries *upperSeries() const;
  • 获取定义区域的上边界线。
• QLineSeries *lowerSeries() const;
  • 获取定义区域的下边界线。

填充样式

• QBrush brush() const;
  • 返回用于填充区域的刷子样式。
• void setBrush(const QBrush &brush);
  • 设置区域的填充样式，例如颜色或渐变。

边框样式

• QPen pen() const;
  • 返回边框线的样式。
• void setPen(const QPen &pen);
  • 设置边框线的样式。

信号和交互

• void clicked(const QPointF &point);
  • 当区域被点击时发出信号。
• void hovered(const QPointF &point, bool state);
  • 当鼠标悬停在区域上时发出信号。

---

QAreaSeries 使用方法示例

以下示例展示如何创建并配置 QAreaSeries：

#include <QtCharts/QChartView>
#include <QtCharts/QAreaSeries>
#include <QtCharts/QLineSeries>
#include <QtCharts/QValueAxis>

using namespace QtCharts;

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    // 创建两条线系列（用于定义区域）
    QLineSeries *upperSeries = new QLineSeries();
    QLineSeries *lowerSeries = new QLineSeries();

    // 设置上边界线的数据点
    upperSeries->append(0, 5);
    upperSeries->append(1, 15);
    upperSeries->append(2, 10);
    upperSeries->append(3, 20);

    // 设置下边界线的数据点
    lowerSeries->append(0, 0);
    lowerSeries->append(1, 5);
    lowerSeries->append(2, 3);
    lowerSeries->append(3, 10);

    // 创建 QAreaSeries（区域图）
    QAreaSeries *areaSeries = new QAreaSeries(upperSeries, lowerSeries);
    areaSeries->setName("示例区域图");

    // 设置填充样式
    QBrush brush(Qt::blue);
    brush.setStyle(Qt::SolidPattern);
    areaSeries->setBrush(brush);

    // 设置边框线样式
    QPen pen(Qt::darkBlue);
    pen.setWidth(2);
    areaSeries->setPen(pen);

    // 创建图表对象
    QChart *chart = new QChart();
    chart->addSeries(areaSeries);
    chart->setTitle("QAreaSeries 示例");
    chart->createDefaultAxes();

    // 设置轴范围
    QValueAxis *axisX = new QValueAxis();
    axisX->setRange(0, 3);
    axisX->setTitleText("X 轴");
    chart->setAxisX(axisX, areaSeries);

    QValueAxis *axisY = new QValueAxis();
    axisY->setRange(0, 20);
    axisY->setTitleText("Y 轴");
    chart->setAxisY(axisY, areaSeries);

    // 创建视图
    QChartView *chartView = new QChartView(chart);
    chartView->setRenderHint(QPainter::Antialiasing);

    // 显示窗口
    QMainWindow window;
    window.setCentralWidget(chartView);
    window.resize(800, 600);
    window.show();

    return app.exec();
}

---

运行效果

1. 区域图显示在窗口中，填充为蓝色。
2. 上边界由 upperSeries 定义，下边界由 lowerSeries 定义。
3. 边框显示为深蓝色，边框宽度为 2。

---

信号和事件交互

鼠标悬停和点击事件

可以连接 QAreaSeries 的信号，实现交互功能。例如：

QObject::connect(areaSeries, &QAreaSeries::hovered, [](const QPointF &point, bool state) {
    if (state) {
        qDebug() << "Mouse over point:" << point;
    } else {
        qDebug() << "Mouse left point:" << point;
    }
});

QObject::connect(areaSeries, &QAreaSeries::clicked, [](const QPointF &point) {
    qDebug() << "Area clicked at point:" << point;
});

---

常见场景

1. 展示范围数据：
   适用于天气图表（例如最高温度和最低温度之间的范围）、股票图表（如波动区间）。
2. 展示累积数据：
   将累积值直观地表示为填充区域。
3. 动态更新：
   数据可以动态更新，适合实时图表。

---

其他有用的设置

填充颜色渐变

通过 QBrush 可以实现渐变填充：

QLinearGradient gradient(QPointF(0, 0), QPointF(0, 1));
gradient.setColorAt(0.0, Qt::blue);
gradient.setColorAt(1.0, Qt::white);
areaSeries->setBrush(QBrush(gradient));

自定义轴范围

使用 QValueAxis 或 QCategoryAxis 自定义轴的刻度和范围。

---

参考链接

• QAreaSeries 文档
• Qt Charts 模块

通过以上详解，您可以充分理解 QAreaSeries 的用法，并灵活应用于不同的图表场景！