PYQT charts in tabs

[frohr]

Hi, I need draw charts in two tabs. It there any easy way how to do it? Thank you for help.

This is my code.

import sys
from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton, QWidget, QAction, QTabWidget,QVBoxLayout
from PyQt5.QtGui import QIcon
from PyQt5.QtCore import pyqtSlot
from PyQt5.QtWidgets import QLabel

class App(QMainWindow):

    def __init__(self):
        super().__init__()
        self.title = 'CHART'
        self.left = 0
        self.top = 0
        self.width = 800
        self.height = 600
        self.setWindowTitle(self.title)
        self.setGeometry(self.left, self.top, self.width, self.height)
        self.table_widget = MyTableWidget(self)
        self.setCentralWidget(self.table_widget)
        self.show()
   
class MyTableWidget(QWidget):

    def __init__(self, parent):
        super(QWidget, self).__init__(parent)
        self.layout = QVBoxLayout(self)
        
        # Initialize tab screen
        self.tabs = QTabWidget()
        self.tab1 = QWidget()
        self.tab2 = QWidget()
        self.tabs.resize(300,200)
        
        # Add tabs
        self.tabs.addTab(self.tab1,"Tab 1")
        self.tabs.addTab(self.tab2,"Tab 2")
        
        # Create first tab
        self.tab1.layout = QVBoxLayout(self)
        self.l = QLabel()
        self.l.setText("Line chart 1")
        self.tab1.layout.addWidget(self.l)
        self.tab1.setLayout(self.tab1.layout)
     
        # Create second tab
        self.tab2.layout = QVBoxLayout(self)
        self.l = QLabel()
        self.l.setText("Line chart 2")
        self.tab2.layout.addWidget(self.l)
        self.tab2.setLayout(self.tab2.layout)
        
        # Add tabs to widget
        self.layout.addWidget(self.tabs)
        self.setLayout(self.layout)
 
if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_())

[Axel_Erfurt]

You can use QtChart from PyQt5.

import sys
from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton, QWidget, QAction, QTabWidget,QVBoxLayout
from PyQt5.QtGui import QIcon, QPainter
from PyQt5.QtCore import pyqtSlot, Qt, QPointF
from PyQt5.QtWidgets import QLabel
from PyQt5.QtChart import QBarSet, QChart, QBarSeries, QLineSeries, QBarCategoryAxis, QChartView
 
class App(QMainWindow):
 
    def __init__(self):
        super().__init__()
        self.title = 'CHART'
        self.left = 0
        self.top = 0
        self.width = 800
        self.height = 600
        self.setWindowTitle(self.title)
        self.setGeometry(self.left, self.top, self.width, self.height)
        self.table_widget = MyTableWidget(self)
        self.setCentralWidget(self.table_widget)
        self.show()
    
class MyTableWidget(QWidget):
 
    def __init__(self, parent):
        super(QWidget, self).__init__(parent)
        self.layout = QVBoxLayout(self)
         
        # Initialize tab screen
        self.tabs = QTabWidget()
        self.tab1 = QWidget()
        self.tab2 = QWidget()
        self.tabs.resize(300,200)
         
        # Add tabs
        self.tabs.addTab(self.tab1,"Tab 1")
        self.tabs.addTab(self.tab2,"Tab 2")
         
        # Create first tab
        ### chart example 1
        set0 = QBarSet("Jane")
        set1 = QBarSet("John")
        set2 = QBarSet("Axel")
        set3 = QBarSet("Mary")
        set4 = QBarSet("Samantha")
        set5 = QBarSet("Mike")
        
        set0.append([1 , 2 , 3 , 4 , 5 , 6])
        set1.append([5 , 0 , 0 , 4 , 0 , 7])
        set2.append([3 , 5 , 8 , 11.67 , 8 , 5])
        set3.append([5 , 6 , 7 , 3 , 4 , 5])
        set4.append([9 , 7 , 5 , 3 , 1 , 2])
        set5.append([11 , 5 , 8 , 3 , 9 , 12])
        
        series = QBarSeries()
        series.append(set0)
        series.append(set1)
        series.append(set2)
        series.append(set3)
        series.append(set4)
        series.append(set5)
        
        chart = QChart()
        chart.addSeries(series)
        chart.setTitle("Simple barchart example")
        chart.setAnimationOptions(QChart.SeriesAnimations)
        
        categories =[ "Jan." , "Feb." , "März" , "Apr." , "Mai" , "Juni", "Juli", "Aug.", "Sep.", "Okt.", "Nov.", "Dez."]
        axis = QBarCategoryAxis()
        axis.append(categories)
        chart.createDefaultAxes()
        chart.setAxisX(axis, series)
        
        chart.legend().setVisible(True)
        chart.legend().setAlignment(Qt.AlignBottom)
        
        chartView = QChartView(chart)
        chartView.setRenderHint(QPainter.Antialiasing)        
        ###
        self.tab1.layout = QVBoxLayout(self)
        self.tab1.layout.addWidget(chartView)
        self.tab1.setLayout(self.tab1.layout)
      
        # Create second tab
        ### chart example 2
        series = QLineSeries(self)
 
        series << QPointF( 1, 91.9) << QPointF( 2, 89.5) << QPointF( 3, 84.6) << QPointF( 4, 92.0) << QPointF( 5, 87.6) << QPointF( 6, 89.4) << QPointF( 7, 83.9) << QPointF( 8, 90.1) << QPointF( 9, 89.7) << QPointF( 10, 89.6) << QPointF( 11, 86.1) << QPointF( 12, 85.3) << QPointF( 13, 91.3) << QPointF( 14, 89.0) << QPointF( 15, 85.3) << QPointF( 16, 91.6) << QPointF( 17, 91.1) << QPointF( 18, 91.3) << QPointF( 19, 88.3) << QPointF( 20, 84.1) << QPointF( 21, 88.9) << QPointF( 22, 91.1) << QPointF( 23, 86.6) << QPointF( 24, 88.2) << QPointF( 25, 90.3) << QPointF( 26, 89.3) << QPointF( 27, 85.0) << QPointF( 28, 88.6) << QPointF( 29, 86.0) << QPointF( 30, 87.1) << QPointF( 31, 84.3)
 
        chart =  QChart()
 
        chart.addSeries(series)
        chart.createDefaultAxes()
        chart.setAnimationOptions(QChart.SeriesAnimations)
        chart.setTitle("Line Chart Example")
 
        chart.legend().setVisible(True)
        chart.legend().setAlignment(Qt.AlignBottom)
 
 
        chartview = QChartView(chart)
        chartview.setRenderHint(QPainter.Antialiasing)        
        ###
        self.tab2.layout = QVBoxLayout(self)
        self.tab2.layout.addWidget(chartview)
        self.tab2.setLayout(self.tab2.layout)
         
        # Add tabs to widget
        self.layout.addWidget(self.tabs)
        self.setLayout(self.layout)
  
if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_())

[frohr]

[quote="Axel_Erfurt" pid='153292' dateline='1644608919']
You can use QtChart from PyQt5.

Hi, thanks a lot. I am very new with QtChart, and no clue how start. Your code seems clear but if I am looking for example zoom in/out X axis or autoscale Y axis or how is possible to add 3 text field with custom values, I am not able to find it or understand. Maybe you can guide me.
Once again, thank you.

[Axel_Erfurt]

There is a tutorial at geekscoders

[frohr]

There is a tutorial at geekscoders

Yes, nice, clear tutorial, unfortunately no information how to zoom, etc.
If I try PyQtGraph, there is zooming by mouse wheel.
I am searching long time about QtPyChart but I found not to so much tutorials/examples.

For me is the best solution to have two buttons for zoom in/out and two buttons for X axis moving. But I guess it will be not easy with PyQtChart, right?

[Axel_Erfurt]

You can use chart.zoomIn() and chart.zoomOut()

[Axel_Erfurt]

Example using mousewheel

from PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout
import sys
from PyQt5.QtChart import QChart, QChartView, QLineSeries
from PyQt5.QtCore import QPointF

class Window(QWidget):
    def __init__(self):
        super().__init__()


        self.setGeometry(200,200,600,400)
        self.setWindowTitle("LineChart")

        series = QLineSeries()

        series.append(0,6)
        series.append(3,5)
        series.append(3,8)
        series.append(7,3)
        series.append(12,7)

        series << QPointF(11,1) << QPointF(13,3)\
        << QPointF(17,6) << QPointF(18,3) << QPointF(20,20)


        self.chart = QChart()
        self.chart.addSeries(series)
        self.chart.setAnimationOptions(QChart.SeriesAnimations)
        self.chart.setTitle("Line Chart")
        self.chart.setTheme(QChart.ChartThemeBlueCerulean)


        chartview = QChartView(self.chart)

        vbox = QVBoxLayout()
        vbox.addWidget(chartview)
        self.setLayout(vbox)
        
    def wheelEvent(self,event):
        if event.angleDelta().y() > 0:
            self.chart.zoomIn()
        else:
            self.chart.zoomOut()
            
            
App = QApplication(sys.argv)
window = Window()
window.show()
sys.exit(App.exec())

[frohr]

Example using mousewheel

And I hope final question - is possible to put inside PYQT5 tab the matplotlib chart which can be zoomed, moved, etc.?
Thanks!

[Axel_Erfurt]

https://www.pythonguis.com/tutorials/plo...atplotlib/

[frohr]

https://www.pythonguis.com/tutorials/plo...atplotlib/

Great tutorial, thank you.

Now I am able create tabs in PYQT5 and insert Matplotlib to PYQT5.
But I am not able to combine both to add matplotlib to tab

If I understand well, I have to add tabs into:

class MainWindow(QtWidgets.QMainWindow):

I have to add there

# Add tabs
        self.tabs.addTab(self.tab1,"Tab 1")
        self.tabs.addTab(self.tab2,"Tab 2")
         
        # Create first tab
        self.tab1.layout = QVBoxLayout(self)
        self.l = QLabel()
        self.l.setText("Line chart 1")
        self.tab1.layout.addWidget(self.l)
        self.tab1.setLayout(self.tab1.layout)

?