使用 PyQt5 和 Echarts 打造股票数据看板

点击上方“编程派”，选择设为“设为星标”

优质文章，第一时间送达！

2、如果对数据交互性要求高，需要点击图表查看数据，首推 pyecharts;如果还喜欢二次元可爱风的话，可以用 cutecharts, cutecharts 和 pycharts 均基于百度主导的 JavaScript 可视化框架 Echarts。

如上图所示，界面可细分为三大块，左上角的昨日股票涨跌行情饼状图，右上角的展示股票排行榜的 QTabWidget 表格，以及下方的某只股票 Open-Close-High-Low 折线图。上图中，考虑到计算量的问题，饼状图和表格的数据都是直接伪造的，只有股票的折线图数据是真实的。

整个界面继承自 QMainWindow，最外层的布局是竖直布局 QVBoxLayout，它包含界面上部分的 QHBoxLayout 和下方的 QHBoxLayout，并同时设置这两个 QHBoxLayout 的 拉伸因子为 1，这样就能够实现上下部分等分整个界面并大小随界面自适应改变，其语法格式是

从小的方面来说，左上角和下部分的布局都是 PyQt5 中的 QtWebEngineWidgets 组件，它就像一个浏览器，通过 QtWebEngineWidgets 调用 Echarts 中的 API，就能在 PyQt5 的界面中显示 Echarts 各种各样的的图表。而右上角是一个 QTabWidget 组件，为了减少代码之间的耦合，我单独把它写成一个 RightTableView 类，

RightTableView 实现了 tab 的监听，切换不同的 tab 可根据 index 展示不同的数据，因此，在主模块中初始化 RightTableView 类的时候，应当给定 RightTableView 可能用到的所有数据，这样可以避免使用 Signal 信 来进行主模块和 RightTableView 模块的通信。

在主模块中，通过 from rightview import RightTableView
即可引入 RightTableView 布局，其中 rightview 是文件名，RightTableView 是类名，如改行代码爆红（实际上不影响运行），可在项目上右键 Mark Dircectory as -> Sources Root 解决之。

数据驱动

实际上，在三个小布局中，界面上部的两个布局的数据均是伪造的，因为这个数据的采集及计算太过耗时

在 basic 表中，我记录了 5000 支股票的基础信息：股票交易所、股票发行公司、股票代码，上部的两个布局需要这 5000 支股票的整体数据，即 5000 支股票昨日相较于前日的跌涨幅，5000 支股票的跌涨幅度的排名，作为一个客户端软件，我觉得一个操作所能忍受的时延是 3 s 以内，优于接口还有速率限制，粗略计算了一下，这个过程远远超过了 30 s，所以我觉得可行的办法是将这种采集和计算过程部署到服务器，通过设置定时任务执行，客户端每次打开只需要一个简单的 Get 请求即可立即渲染数据。

而下方的股票 Open-Close-High-Low 折线图所需数据的计算量比较小，可直接完成，用户输入股票发行公司，即可返回该公司发行股票的代码，（因为我们一般记住的是股票发行公司而不是股票代码，就行我们往往记住 站的域名而不是 ip 地址），如果数据库中不存在代码该股票的表（表名=发行公司_股票代码），就新建，并抓取指定日期的数据存入该表；如果表存在但是缺少用户想要的数据，则更新数据即可；这样设计的好处是尽可能减少平均操作时延。

再说这个，乍一看就是一个 key-value 字典，为了减少数据库的操作，在程序初始化过程中，我们需要把 basic 表中的股票数据全部加载进内存，也就是放进字典里，但是由于一个公司可能发现很多股票，但是 Python 内置的字典 一个 key 只能对应一个 value ,我们很容易想到把 value 设计成一个列表，但是这样破环了字典的原子性，假如后面我们新加了一个需要，根据 value 反查 key，也就是说根据股票代码反查股票发行公司，如果设计成列表，这个反查耗时将是巨大的，考虑再三，我在不破坏字典 item 的原子性的前提下，实现了 value 可重复 dict，其本质是一个列表，列表元素为字典，核心思想是把键重复的item分散到不同字典，不过经过封装，对外操作和字典一样，下面是该可重复字典的实现