Search code examples
pythonpython-3.xpyside2qtcharts

How to scroll view when plot reaches a QChartView border


I'd like to create a dynamic chart which will move the chart view when plot reaches its visible border. Unfortunately, I can't figure out how to detect when the view should be moved.

By the way, scroll method should work for moving the view (as far as I know), but there's no visible result, even if I try scroll(1000, 0)

here's my widget class

from PySide2 import QtGui, QtWidgets, QtCore
from PySide2.QtCharts import QtCharts
from psutil import cpu_percent
import sys


class cpu_chart(QtCharts.QChart):
    def __init__(self, input_data=None, parent=None):
        super().__init__(parent)

        self.axisX = QtCharts.QValueAxis()
        self.axisY = QtCharts.QValueAxis()

        self.axisX.setVisible(False)

        self.step = 0
        self.x = 0
        self.y = 0

        self.timer = QtCore.QTimer()
        self.timer.setInterval(100)
        self.timer.timeout.connect(self.onTimeout)

        self.m_series = QtCharts.QSplineSeries()

        pen = QtGui.QPen(QtCore.Qt.green)
        pen.setWidth(1)

        self.m_series.setPen(pen)
        self.m_series.append(self.x, self.y)

        self.addSeries(self.m_series)
        self.addAxis(self.axisX, QtCore.Qt.AlignBottom)
        self.addAxis(self.axisY, QtCore.Qt.AlignLeft)

        self.m_series.attachAxis(self.axisX)
        self.m_series.attachAxis(self.axisY)


        self.axisX.setRange(0, 100)
        self.axisY.setTickCount(5)
        self.axisY.setRange(0, 100)

        self.timer.start()

    def onTimeout(self):
        self.x += 1
        self.y = cpu_percent()

        self.m_series.append(self.x, self.y)
        self.scroll(10, 0)

if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    window = QtWidgets.QMainWindow()

    chart = cpu_chart()
    chart.legend().hide()
    chart.setAnimationOptions(QtCharts.QChart.AllAnimations)

    chart_view = QtCharts.QChartView(chart)
    chart_view.setRenderHint(QtGui.QPainter.Antialiasing)

    window.setCentralWidget(chart_view)
    window.resize(400, 300)
    window.show()

    sys.exit(app.exec_())

Solution

  • You must change the range of the X axis.

    • If you want to show all the data:
    def onTimeout(self):
        self.x += 1
        self.y = cpu_percent()
        self.m_series.append(self.x, self.y)
        self.axisX.setRange(0, self.x)
    
    • If you want to show the latest N data:
    def onTimeout(self):
        self.x += 1
        self.y = cpu_percent()
        self.m_series.append(self.x, self.y)
        N = 100
        self.axisX.setRange(max(0, self.x - N), self.x)