Pyside2中嵌入Matplotlib的绘图的实现
近期遇到一个需求，就是用PySide2做出一个GUI，并且要将后台使用Matplotlib绘制的图显示在界面上。自己琢磨了蛮久，网上也搜了不少资料，但都感觉参差不齐，所以就自己总结一下。
我们使用QGraphicsView插件来显示Matplotlib里绘制的图片。这里演示的功能为：打开时界面默认绘制cos函数的图像，点击按钮后，绘制sin函数的图像。
1.界面设计
简单创建一个界面：一个GraphicsView和一个PushButton
2.定义一个类，继承FigureCanvas
importmatplotlib
frommatplotlib.backends.backend_qt5aggimportFigureCanvasQTAggasFigureCanvas
#frommatplotlib.figureimportFigure
importmatplotlib.pyplotasplt
matplotlib.use("Qt5Agg")#声明使用QT5
classMyFigureCanvas(FigureCanvas):
'''
通过继承FigureCanvas类，使得该类既是一个PyQt5的Qwidget，又是一个matplotlib的FigureCanvas，这是连接pyqt5与matplotlib的关键
'''
def__init__(self,parent=None,width=10,height=5,xlim=(0,2500),ylim=(-2,2),dpi=100):
#创建一个Figure
fig=plt.Figure(figsize=(width,height),dpi=dpi,tight_layout=True)#tight_layout:用于去除画图时两边的空白
FigureCanvas.__init__(self,fig)#初始化父类
self.setParent(parent)
self.axes=fig.add_subplot(111)#添加子图
self.axes.spines['top'].set_visible(False)#去掉绘图时上面的横线
self.axes.spines['right'].set_visible(False)#去掉绘图时右面的横线
self.axes.set_xlim(xlim)
self.axes.set_ylim(ylim)
然后就可以开始绘图了。
3.绘图并显示
3.1先初始化一下我们定义的类
这里 self.ui.graphicsView.width()/101的作用：
- 因为直接使用默认绘制出来的图的大小，一般都会与我们窗口里GraphicsView的大小不一致，会造成图像显示不完全，需要拖动滚动条看图像。这里我们将绘图的大小设置为与GraphicsView相匹配的大小，就可以显示出全部图像。之所以 "/101"，我感觉可能是 graphicsView.width()得到的结果和plt的figsize里设置图大小的参数的单位是不一样的，所以要除以一个数，让图像能刚好全部显示在GraphicsView里
#初始化gv_visual_data的显示 self.gv_visual_data_content=MyFigureCanvas(width=self.ui.graphicsView.width()/101, height=self.ui.graphicsView.height()/101, xlim=(0,2*np.pi), ylim=(-1,1))#实例化一个FigureCanvas
3.2接着就开始用Matplotlib绘制cos函数的图像并显示在GraphicsView里
x=np.arange(0,2*np.pi,np.pi/100)
y=np.cos(x)
self.gv_visual_data_content.axes.plot(x,y)
self.gv_visual_data_content.axes.set_title('cos()')
#加载的图形（FigureCanvas）不能直接放到graphicview控件中，必须先放到graphicScene，然后再把graphicscene放到graphicview中
self.graphic_scene=QGraphicsScene()#创建一个QGraphicsScene
self.graphic_scene.addWidget(self.gv_visual_data_content)#把图形放到QGraphicsScene中，注意：图形是作为一个QWidget放到放到QGraphicsScene中的
self.ui.graphicsView.setScene(self.graphic_scene)#把QGraphicsScene放入QGraphicsView
self.ui.graphicsView.show()#调用show方法呈现图形
到这里，已经可以运行看到初步效果了
3.3接下来实现点击按钮，切换为sin函数图像的功能
先将信号与槽连接好
self.ui.btn_sin.clicked.connect(self.plot_sin)
编写槽函数
defplot_sin(self):
x=np.arange(0,2*np.pi,np.pi/100)
y=np.sin(x)
self.gv_visual_data_content.axes.clear()#由于图片需要反复绘制，所以每次绘制前清空，然后绘图
self.gv_visual_data_content.axes.plot(x,y)
self.gv_visual_data_content.axes.set_title('sin()')
self.gv_visual_data_content.draw()#刷新画布显示图片，否则不刷新显示
好了，看看效果
大功告成。
完整代码：
注意：导包时，要将PySide2和UI的包放在matplotlib相关包的前面，不然里面的self.graphic_scene.addWidget(self.gv_visual_data_content) 这里会报如下的错！！！
TypeError:'PySide2.QtWidgets.QGraphicsScene.addWidget'calledwithwrongargumenttypes:
PySide2.QtWidgets.QGraphicsScene.addWidget(MyFigureCanvas)
Supportedsignatures:
PySide2.QtWidgets.QGraphicsScene.addWidget(PySide2.QtWidgets.QWidget,PySide2.QtCore.Qt.WindowFlags=Default(Qt.WindowFlags))
至于为什么呢？我也不大清楚，不过好像如果使用的是PyQt5的话就没这种问题，玄学吧！！！
fromPySide2.QtWidgetsimportQApplication,QMainWindow,QGraphicsScene,QFileDialog,QMessageBox
fromUI.testimportUi_MainWindow
importsys
importnumpyasnp
importmatplotlib
frommatplotlib.backends.backend_qt5aggimportFigureCanvasQTAggasFigureCanvas
#frommatplotlib.figureimportFigure
importmatplotlib.pyplotasplt
matplotlib.use("Qt5Agg")#声明使用QT5
classMyFigureCanvas(FigureCanvas):
'''
通过继承FigureCanvas类，使得该类既是一个PyQt5的Qwidget，又是一个matplotlib的FigureCanvas，这是连接pyqt5与matplotlib的关键
'''
def__init__(self,parent=None,width=10,height=5,xlim=(0,2500),ylim=(-2,2),dpi=100):
#创建一个Figure
fig=plt.Figure(figsize=(width,height),dpi=dpi,tight_layout=True)#tight_layout:用于去除画图时两边的空白
FigureCanvas.__init__(self,fig)#初始化父类
self.setParent(parent)
self.axes=fig.add_subplot(111)#调用figure下面的add_subplot方法，类似于matplotlib.pyplot下面的subplot方法
self.axes.spines['top'].set_visible(False)#去掉上面的横线
self.axes.spines['right'].set_visible(False)
self.axes.set_xlim(xlim)
self.axes.set_ylim(ylim)
classMainWindow(QMainWindow):
def__init__(self):
super().__init__()
self.ui=Ui_MainWindow()
self.ui.setupUi(self)
#初始化gv_visual_data的显示
self.gv_visual_data_content=MyFigureCanvas(width=self.ui.graphicsView.width()/101,
height=self.ui.graphicsView.height()/101,
xlim=(0,2*np.pi),
ylim=(-1,1))#实例化一个FigureCanvas
self.plot_cos()
self.ui.btn_sin.clicked.connect(self.plot_sin)
defplot_cos(self):
x=np.arange(0,2*np.pi,np.pi/100)
y=np.cos(x)
self.gv_visual_data_content.axes.plot(x,y)
self.gv_visual_data_content.axes.set_title('cos()')
#加载的图形（FigureCanvas）不能直接放到graphicview控件中，必须先放到graphicScene，然后再把graphicscene放到graphicview中
self.graphic_scene=QGraphicsScene()#创建一个QGraphicsScene
self.graphic_scene.addWidget(self.gv_visual_data_content)#把图形放到QGraphicsScene中，注意：图形是作为一个QWidget放到放到QGraphicsScene中的
self.ui.graphicsView.setScene(self.graphic_scene)#把QGraphicsScene放入QGraphicsView
self.ui.graphicsView.show()#调用show方法呈现图形
defplot_sin(self):
x=np.arange(0,2*np.pi,np.pi/100)
y=np.sin(x)
self.gv_visual_data_content.axes.clear()#由于图片需要反复绘制，所以每次绘制前清空，然后绘图
self.gv_visual_data_content.axes.plot(x,y)
self.gv_visual_data_content.axes.set_title('sin()')
self.gv_visual_data_content.draw()#刷新画布显示图片，否则不刷新显示
if__name__=="__main__":
app=QApplication(sys.argv)
win=MainWindow()
win.show()
sys.exit(app.exec_())
到此这篇关于Pyside2中嵌入Matplotlib的绘图的实现的文章就介绍到这了,更多相关Pyside2嵌入Matplotlib内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。