中文 EN

折线图

Line Chart 折线图

折线图用于展示连续数据趋势，适合监控曲线、业务指标走势、历史对比和时序数据分析。

基类与类图

QOpenGLWidget
  └─ UIGQChartBase
      └─ UIGQLineChart + IUIGQWidgetBase

UIGQLineChart 继承 UIGQChartBase 的主题、动画、图例和 tooltip 能力，并通过 IUIGQWidgetBase 接入 Qt-UI 控件体系。

数据结构

struct UIGQLineChartSeries
{
    QString name;
    QVector<double> values;
    QColor lineColor;
    QColor areaColor;
    bool showSymbol = true;
    bool smooth = false;
    bool showArea = false;
    bool visible = true;
    qreal lineWidth = 2.0;
    qreal areaOpacity = 0.22;
};

常用方法

方法 说明 参数 返回值
setTitle(const QString& title) 设置标题。 title：标题文本。 void
getTitle() 读取标题。 无。 QString
setCategories(const QStringList& categories) 设置分类标签。 categories：横轴分类列表。 void
getCategories() 读取分类标签。 无。 QStringList
setValues(const QVector<double>& values) 设置默认单序列数值。 values：数值列表。 void
getValues() 读取默认单序列数值。 无。 QVector<double>
setSeries(const QString& name, const QVector<double>& values, const QColor& color) 快速设置单条折线。 name：序列名称；values：数值列表；color：线条颜色，可使用默认值。 void
setSeries(const QVector<UIGQLineChartSeries>& series) 设置多条折线及每条线的显示参数。 series：折线序列数组。 void
getSeries() 读取当前折线序列。 无。 QVector<UIGQLineChartSeries>
clearSeries() 清空所有折线数据。 无。 void
setShowSymbol(bool show) 全局控制数据点符号。 show：是否显示数据点符号。 void
getShowSymbol() 读取数据点符号显示状态。 无。 bool
setSmooth(bool smooth) 全局控制是否使用平滑曲线。 smooth：是否平滑。 void
getSmooth() 读取平滑曲线状态。 无。 bool
setShowArea(bool show) 全局控制是否显示面积填充。 show：是否显示面积。 void
getShowArea() 读取面积填充状态。 无。 bool
setSeriesVisible(int index, bool visible) 控制指定序列显示或隐藏。 index：序列索引；visible：是否显示。 void
isSeriesVisible(int index) 判断指定序列是否显示。 index：序列索引。 bool
setTooltipMode(UIGQChartTooltipMode mode) 设置 tooltip 模式。 mode：tooltip 模式枚举。 void
getTooltipMode() 读取 tooltip 模式。 无。 UIGQChartTooltipMode
setTooltipVisible(bool visible) 设置 tooltip 是否显示。 visible：是否显示。 void
getTooltipVisible() 读取 tooltip 显示状态。 无。 bool
setHoverEnabled(bool enabled) 开启或关闭 hover 交互。 enabled：是否启用 hover。 void
getHoverEnabled() 读取 hover 交互状态。 无。 bool
initDemoData() 初始化演示数据。 无。 void

单序列调用

using namespace UIGQtLib;

auto* chart = new UIGQLineChart(parent);
chart->setTitle("CPU Usage");
chart->setCategories({"00:00", "00:05", "00:10", "00:15"});
chart->setSeries("CPU", {22.0, 35.0, 31.0, 48.0}, QColor(35, 128, 224));
chart->setSmooth(true);
chart->setShowSymbol(true);
chart->setThemePreset(kChartThemeMacarons);
chart->setTooltipMode(kChartTooltipAxis);
chart->setTooltipVisible(true);

调用说明：

  • setCategories(...) 设置横轴标签。
  • setSeries(...) 设置折线名称、数值和颜色。
  • setSmooth(true) 适合趋势类图表；精确折线可保持默认 false。
  • kChartTooltipAxis 适合按横轴位置查看同一时刻的值。

多序列调用

QVector<UIGQLineChartSeries> series;

UIGQLineChartSeries cpu;
cpu.name = "CPU";
cpu.values = {22, 35, 31, 48};
cpu.lineColor = QColor(35, 128, 224);
cpu.showSymbol = true;
series.append(cpu);

UIGQLineChartSeries memory;
memory.name = "Memory";
memory.values = {58, 60, 63, 61};
memory.lineColor = QColor(62, 180, 98);
memory.showArea = true;
memory.areaColor = QColor(62, 180, 98, 80);
series.append(memory);

chart->setSeries(series);

调用说明：

  • 多序列使用 QVector<UIGQLineChartSeries> 一次性设置。
  • showArea 与 areaColor 用于面积趋势图。
  • visible 可配合 setSeriesVisible(...) 做图例筛选。