PySide/PyQt中如何设置QChart网格线的自定义频率与颜色

需求说明 #

• 设置自定义的网格线颜色
• X轴刻度每5个点显示一次，网格线每20个点显示一次（打破默认网格线与刻度一一对应的关联）

现有代码 #

from PySide6.QtWidgets import QVBoxLayout, QApplication
from PySide6.QtCharts import QLineSeries, QChart, QChartView, QValueAxis
from PySide6.QtGui import QColor, QBrush
import sys
import math


class Chart1(QChart):
    def __init__(self):
        super().__init__()
        series = QLineSeries()
        x_axis = QValueAxis()
        y_axis = QValueAxis()
        self.setAxisX(x_axis)
        self.setAxisY(y_axis)
        self.legend().setVisible(False)
        for i in range (0, 100, 1):
            series.append(i, math.sin(i))
        self.addSeries(series)
        self.axisX().setRange(0, 100)
        self.axisY().setRange(-1,1)
        x_axis.setTickType(QValueAxis.TickType.TicksDynamic)
        x_axis.setTickInterval(20)
        y_axis.setTickType(QValueAxis.TickType.TicksDynamic)
        y_axis.setTickInterval(0.2)
        axis_brush = QBrush(QColor("white"))
        y_axis.setLabelsBrush(axis_brush)
        x_axis.setLabelsBrush(axis_brush)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    c1 = Chart1()
    chart_view = QChartView(c1)
    chart_view.chart().setBackgroundBrush(QBrush("black"))
    chart_view.show()
    sys.exit(app.exec())

目标效果示例 #

解决方案 #

1. 设置自定义网格线颜色 #

QValueAxis提供setGridLineColor()方法，可直接指定网格线的颜色，示例中设置为深灰色：

x_axis_grid.setGridLineColor(QColor("#666666"))
y_axis.setGridLineColor(QColor("#666666"))

2. 实现刻度与网格线分离 #

Qt Charts默认网格线与刻度绑定，要实现X轴刻度每5点显示、网格线每20点显示的效果，需添加双X轴：一个负责显示刻度，另一个负责绘制网格线（隐藏刻度和标签）。

修改后的完整代码 #

from PySide6.QtWidgets import QApplication
from PySide6.QtCharts import QLineSeries, QChart, QChartView, QValueAxis
from PySide6.QtGui import QColor, QBrush
from PySide6.QtCore import Qt
import sys
import math


class Chart1(QChart):
    def __init__(self):
        super().__init__()
        series = QLineSeries()
        # 创建两个X轴：一个用于显示刻度，一个用于绘制网格线
        x_axis_ticks = QValueAxis()  # 主刻度轴（每5个点显示一次刻度）
        x_axis_grid = QValueAxis()   # 辅助网格轴（每20个点显示一次网格线）
        y_axis = QValueAxis()

        # 设置主刻度轴为X主轴
        self.setAxisX(x_axis_ticks)
        self.setAxisY(y_axis)
        # 将辅助网格轴添加到图表底部
        self.addAxis(x_axis_grid, Qt.AlignBottom)
        # 将数据系列关联到辅助网格轴，确保网格线与数据对齐
        series.attachAxis(x_axis_grid)

        self.legend().setVisible(False)
        for i in range(0, 100, 1):
            series.append(i, math.sin(i))
        self.addSeries(series)

        # 统一设置轴范围，保证对齐
        x_axis_ticks.setRange(0, 100)
        x_axis_grid.setRange(0, 100)
        y_axis.setRange(-1, 1)

        # 配置主刻度轴：每5个点显示一次刻度
        x_axis_ticks.setTickType(QValueAxis.TickType.TicksDynamic)
        x_axis_ticks.setTickInterval(5)
        # 配置辅助网格轴：每20个点显示一次网格线，隐藏刻度和标签
        x_axis_grid.setTickType(QValueAxis.TickType.TicksDynamic)
        x_axis_grid.setTickInterval(20)
        x_axis_grid.setLabelsVisible(False)
        x_axis_grid.setTicksVisible(False)

        # Y轴配置
        y_axis.setTickType(QValueAxis.TickType.TicksDynamic)
        y_axis.setTickInterval(0.2)

        # 设置标签颜色
        axis_brush = QBrush(QColor("white"))
        y_axis.setLabelsBrush(axis_brush)
        x_axis_ticks.setLabelsBrush(axis_brush)

        # 设置自定义网格线颜色
        x_axis_grid.setGridLineColor(QColor("#666666"))
        y_axis.setGridLineColor(QColor("#666666"))


if __name__ == '__main__':
    app = QApplication(sys.argv)
    c1 = Chart1()
    chart_view = QChartView(c1)
    chart_view.chart().setBackgroundBrush(QBrush("black"))
    chart_view.show()
    sys.exit(app.exec())

关键说明 #

• 双轴核心：通过addAxis()添加辅助轴，并用attachAxis()将数据系列关联到辅助轴，确保网格线与数据对齐
• 辅助轴仅保留网格线：通过setLabelsVisible(False)和setTicksVisible(False)隐藏刻度和标签，只显示网格线
• 自定义颜色：直接调用setGridLineColor()设置网格线的目标颜色

内容的提问来源于stack exchange，提问作者Garp