實現matplotlib圖形通過PyQt5+Qt5在GUI中呈現步驟:
第一步,通過matplotlib.backends.backend_qt5agg類來連接PyQt5:
1 import matplotlib 2 matplotlib.use("Qt5Agg") # 聲明使用QT5 3 from matplotlib.backends.backend_qt5agg import FigureCanvasQTAgg as FigureCanvas 4 from matplotlib.figure import Figure
第二步,具體圖形代碼實現部分,例:
1 class Figure_Canvas(FigureCanvas): # 通過繼承FigureCanvas類,使得該類既是一個PyQt5的Qwidget,又是一個matplotlib的FigureCanvas,這是連接pyqt5與matplot lib的關鍵 2 3 def __init__(self, parent=None, width=11, height=5, dpi=100): 4 fig = Figure(figsize=(width, height), dpi=100) # 創建一個Figure,注意:該Figure為matplotlib下的figure,不是matplotlib.pyplot下面的figure 5 6 FigureCanvas.__init__(self, fig) # 初始化父類 7 self.setParent(parent) 8 9 self.axes = fig.add_subplot(111) # 調用figure下面的add_subplot方法,類似於matplotlib.pyplot下面的subplot方法 10 11 def test(self): 12 x = [1,2,3,4,5,6,7,8,9] 13 y = [23,21,32,13,3,132,13,3,1] 14 self.axes.plot(x, y)
第三步,GUI上通過控件呈現matplotlib畫出來的圖形——通過QtWidgets.QGraphicsView控件來實現:(代碼部分僅呈現QtWidgets.QGraphicsView的實現步驟)
1 self.gridLayoutWidget = QtWidgets.QWidget() 2 self.gridLayoutWidget.setGeometry(QtCore.QRect(180, 10, 1100, 500)) # 定義gridLayout控件的大小和位置,4個數字分別為左邊坐標,上邊坐標,長,寬 3 self.gridLayoutWidget.setObjectName("gridLayoutWidget") 4 self.gridLayout_2 = QtWidgets.QGridLayout(self.gridLayoutWidget) 5 self.gridLayout_2.setContentsMargins(0, 0, 0, 0) # 在gridLayoutWidget 上創建一個網格Layout,注意以gridLayoutWidget為參 6 self.gridLayout_2.setObjectName("gridLayout_2") 7 # ===通過graphicview來顯示圖形 8 self.graphicview = QtWidgets.QGraphicsView(self.gridLayoutWidget) # 第一步,創建一個QGraphicsView,注意同樣以gridLayoutWidget為參 9 self.graphicview.setObjectName("graphicview") 10 self.gridLayout_2.addWidget(self.graphicview, 0, 0) 第二步,將該QGraphicsView放入Layout中 11 12 dr = Figure_Canvas() 實例化一個FigureCanvas 13 dr.test() # 畫圖 14 graphicscene = QtWidgets.QGraphicsScene() # 第三步,創建一個QGraphicsScene,因為加載的圖形(FigureCanvas)不能直接放到graphicview控件中,必須先放到graphicScene,然后再把graphicscene放到graphicview中 15 graphicscene.addWidget(dr) # 第四步,把圖形放到QGraphicsScene中,注意:圖形是作為一個QWidget放到QGraphicsScene中的 16 self.graphicview.setScene(graphicscene) # 第五步,把QGraphicsScene放入QGraphicsView 17 self.graphicview.show() # 最后,調用show方法呈現圖形!Voila!!