从零开始实现一个三维绘图系统

本文主要是介绍从零开始实现一个三维绘图系统，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

文章目录

- 框架
- 布局
- 绘图函数
- 源代码

框架

本文的目标是实现一个下图所示的系统，通过指定 $x, y, z$ 的表达式，以实现三维绘图的目的。这个需求其实此前也实现过，见此文，但其内容比较驳杂，并不利于快速实现，相比之下，本文直指核心问题，代码也进一步精简，更加适合学习。

在这里插入图片描述

为此，需要经历三个过程

实现将matplotlib的绘图窗口嵌入到tkinter的窗口中
实现对 $x, y, z$ 数据的读取
实现三维绘图

关于第一个问题，matplotlib中的图窗和工具栏分别是FigureCanvasTkAgg和NavigationToolbar2Tk对象，只需将二者押入到tkinter的布局窗口，即可实现二者的融合。

对于第二个问题，只需使用eval函数便可轻松实现，唯一的难点，则是 $x, y, z$ 三者之间的联系。

而只要第二个问题解决，那么第三个问题也就不是问题了，只需通过一个绘图函数，便可轻松解决。

下面代码给出了实现这个需求需要导入的模块，以及整个系统的基本框架

import tkinter as tk
import tkinter.ttk as ttkimport matplotlib as mpl
mpl.use('TkAgg')
from matplotlib.backends.backend_tkagg import (FigureCanvasTkAgg, NavigationToolbar2Tk)
from matplotlib.figure import Figureimport numpy as npclass DarwSystem():def __init__(self):self.root = tk.Tk()self.root.title("数据展示工具")self.data = {}self.setFrmCtrl()self.setFrmFig()self.root.mainloop()def setFrmCtrl(self): passdef setFrmFig(self): passdef setFrmAxis(self, frm, flag): passdef setCtrlButtons(self, frm): passdef readEntrys(self): passdef btnDrawImg(self): pass

其中，各函数含义如下

setFrmCtrl 用于右侧工具栏的组件布局
setFrmFig 用于左侧绘图窗口的嵌入，解决第一个问题
setFrmAxis 工具栏中的坐标输入框相似度很高，可以封装成专门的函数
readEntrys 读取输入窗口的数据，解决第二个问题
btnDrawImg 绘图函数，解决第三个问题

下面逐个讲解每个函数的实现过程，这些函数都是DataSystem类的成员，所以在书写时注意缩进。

布局

考虑matplotlib绘图窗口的嵌入是一个相对较难的问题，故而先行实现setFrmFig函数

def setFrmFig(self):frmFig = ttk.Frame(self.root)frmFig.pack(side=tk.LEFT,fill=tk.BOTH,expand=tk.YES)self.fig = Figure()self.canvas = FigureCanvasTkAgg(self.fig,frmFig)self.canvas.get_tk_widget().pack(side=tk.TOP,fill=tk.BOTH,expand=tk.YES)self.toolbar = NavigationToolbar2Tk(self.canvas,frmFig,pack_toolbar=False)self.toolbar.update()self.toolbar.pack(side=tk.RIGHT)

其中self.fig就是绘图窗口，后续若要画图，都要在这里设置坐标轴。canvas即绘图画布，toolbar则是画布下方的工具栏。在这里，可以将二者直接视为平平无奇的痛苦inter组件。

另一个和布局相关的函数是setFrmCtrl，其中又将 $x, y, z$ 三个坐标轴的设置封装成了一个函数，以简化代码。唯一的绘图按钮，绑定了btnDrawImg函数，将在后续实现。

def setFrmCtrl(self):frmCtrl = ttk.Frame(self.root,width=320)frmCtrl.pack(side=tk.RIGHT, fill=tk.Y)frm = ttk.Frame(frmCtrl, width=320)frm.pack(side=tk.TOP, fill=tk.X)ttk.Button(frm, text="绘图",width=5,command=self.btnDrawImg).pack(side=tk.LEFT)self.entrys = {}for flag in 'xyz':frm = ttk.Frame(frmCtrl)frm.pack(side=tk.TOP, fill=tk.X)self.setFrmAxis(frm, flag)def setFrmAxis(self, frm, flag):tk.Label(frm, text=flag).pack(side=tk.LEFT)self.entrys[flag] = tk.Entry(frm)self.entrys[flag].pack(side=tk.LEFT, fill=tk.X)

绘图函数

绘图包括两个过程，一是读取输入内容，将其转换可供绘图的数据；二则是将这些数据绘制成图。

首先，第一步实现如下

def readEntrys(self):self.data = {}for flag in 'xyz':label = self.entrys[flag].get()if label=="": continueself.data[flag] = eval(self.entrys[flag].get())if flag =='x' : x = self.data['x']elif flag =='y' : y = self.data['y']

首先，定义一个全局字典 $se l f . d a t a$ 用于绘图。

然后简单起见，用eval函数直接读取python表达式。但需要注意的是，由于循环顺序是 $x\to y\to z$ ，所以 $x$ 的表达式中不能出现 $y, z$ ； $y$ 的表达式中只能出现 $x$ ； $z$ 的表达式中 $x, y$ 都可以出现。

最后是绘图，这里需要实现给定 $x, y$ 和 $x, y, z$ 这两种情况的绘图代码，前者是二维坐标系，后者是三维的。而canvas的绘图逻辑与plt如出一辙，都是先创建一个坐标轴，然后在坐标轴上绘图，最后也只需把plt.draw改为canvas.draw，代码如下

def btnDrawImg(self):self.readEntrys()self.fig.clf()if 'z' in self.data:ax = self.fig.add_subplot(projection='3d')ax.plot(self.data['x'], self.data['y'], self.data['z'])else:ax = self.fig.add_subplot()ax.plot(self.data['x'], self.data['y'])self.fig.subplots_adjust(left=0.1, right=0.95, top=0.95, bottom=0.08)self.canvas.draw()

源代码

最后，将所有代码附在后面

import tkinter as tk
import tkinter.ttk as ttkimport matplotlib as mpl
mpl.use('TkAgg')
from matplotlib.backends.backend_tkagg import (FigureCanvasTkAgg, NavigationToolbar2Tk)
from matplotlib.figure import Figureimport numpy as npdef setEntry(e, text):e.delete(0, "end")e.insert(0, text)def detectArray(s):return s.rstrip('0123456789:, ')==''class DarwSystem():def __init__(self):self.root = tk.Tk()self.root.title("数据展示工具")self.data = {}self.setFrmCtrl()self.setFrmFig()self.root.mainloop()def setFrmCtrl(self):frmCtrl = ttk.Frame(self.root,width=320)frmCtrl.pack(side=tk.RIGHT, fill=tk.Y)frm = ttk.Frame(frmCtrl, width=320)frm.pack(side=tk.TOP, fill=tk.X)ttk.Button(frm, text="绘图",width=5,command=self.btnDrawImg).pack(side=tk.LEFT)self.entrys = {}for flag in 'xyz':frm = ttk.Frame(frmCtrl)frm.pack(side=tk.TOP, fill=tk.X)self.setFrmAxis(frm, flag)def setFrmAxis(self, frm, flag):tk.Label(frm, text=flag).pack(side=tk.LEFT)self.entrys[flag] = tk.Entry(frm)self.entrys[flag].pack(side=tk.LEFT, fill=tk.X)def readEntrys(self):self.data = {}for flag in 'xyz':label = self.entrys[flag].get()if label=="": continueself.data[flag] = eval(self.entrys[flag].get())if flag =='x' : x = self.data['x']elif flag =='y' : y = self.data['y']def btnDrawImg(self):self.readEntrys()self.fig.clf()if 'z' in self.data:ax = self.fig.add_subplot(projection='3d')ax.plot(self.data['x'], self.data['y'], self.data['z'])else:ax = self.fig.add_subplot()ax.plot(self.data['x'], self.data['y'])self.fig.subplots_adjust(left=0.1, right=0.95, top=0.95, bottom=0.08)self.canvas.draw()def setFrmFig(self):frmFig = ttk.Frame(self.root)frmFig.pack(side=tk.LEFT,fill=tk.BOTH,expand=tk.YES)self.fig = Figure()self.canvas = FigureCanvasTkAgg(self.fig,frmFig)self.canvas.get_tk_widget().pack(side=tk.TOP,fill=tk.BOTH,expand=tk.YES)self.toolbar = NavigationToolbar2Tk(self.canvas,frmFig,pack_toolbar=False)self.toolbar.update()self.toolbar.pack(side=tk.RIGHT)if __name__ == "__main__":test = DarwSystem()