说到可视化的数据大屏，相信大家都在机场高铁，政府服务中心，园区或者一些企业的展厅里面都看见过。一个酷炫的大屏上，上面密密麻麻各种数据动态展示着，如图：

实际上要做这样的可视化数据大屏，在如今Agent和模型能力足够的情况下，并不是一件很难的事情。换以前，都得找专业的公司搭建一套DB数据可视化系统，所以AI有时候就能把入门的门槛拉低很多。

老马前几天刚好刷到一个可以辅助制作数据大屏的开源Skill，正好这次结合WorkBuddy，以及刚上新的Hy4模型，Hy4目前还处于限时免费体验阶段，给大家介绍一下如何搭建自己的可视化数据大屏。

我们说Skill就是一本说明书，它除了自带很多基础提示词和工作流程的说明，还包括了一些素材资源和脚本代码啥的。这就等于给我们提前准备好了上下文材料，省得一点点去跟Agent沟通费口舌。

01 · CHAPTER ONE

认识bigdata-dashboard-skill

而这个开源Skill技能叫bigdata-dashboard-skill，正好帮我们提供了这些上下文材料。但这个Skill并非完善完美的，比如它自带的模板有些太老太丑，它没有足够清晰的引导等等。

但这不并妨碍我们一步步去完善它，后续经过多轮沟通后，做出了我们自己想要的效果，那就可以把当前的Skill打包成我们自己的Skill，形成自己的一套工作标准。

02 · CHAPTER TWO

技能推荐与安装部署

废话少话，我们先在WorkBuddy上新建个任务，最好是创建个工作空间，选择上本地的一个文件夹，因为待会方便生成的一些产物放到文件夹里面。

接着当然就是让WorkBuddy安装这个开源Skill，众所周知，大部分开源Skill都是放在了github的仓库上。而很多小伙伴的网络是受限的，无法访问github，因此早前老马也搓了一个Skill，写了篇文章帮大家解决这个问题。

奈何不知道是不是有些小可爱举报，又或者是被系统检测到了，认为此举不妥，那篇文章就被微信官方删掉了。但没有关系，老马发现5.9.3的WorkBuddy，已经更新了一个技能推荐的功能。

只要你在WorkBuddy的新建任务对话框中输入一些提示词，触发到了某些关键词，顶部就会自动弹出一些Skill啥的，推荐给你去使用。比如我们输入“受限网络访问github”，立马弹出了三个上架了技能市场的skill推荐：

然后你就可以随便点击使用一个，在后面补充上提示词，比如使用xxxx帮我修复一下github网络的访问，提交过去等待修复完成就行了。这些Skill老马都没有测试过，就留给小伙伴们去试试咸淡了：

所以世界就是这么玄幻，老马自己搓的Skill写成公众号文章会被删除。而别人搓的类似的作用的Skill，却可以上架WorkBuddy的官方技能市场，还能被推荐，这上哪儿说理去。

难道WorkBuddy的运营团队小伙伴看完老马这篇文章，还会去下架掉它们不成？开个玩笑，起码github访问的问题解决了，下面就直接把提示词发给WorkBuddy，安装我们制作数据大屏的Skill：

安装部署这个项目
github.com/AragornZJF/bigdata-dashboard-skill

由于这个Skill仓库是面向Windows系统的，所以一开始并不支持Mac系统的部署。好在Hy4模型这次的升级已经达到了国产模型中等能打的地步，它自动帮老马进行了系统的适配，最后安装部署成功。

03 · CHAPTER THREE

生成与美化数据大屏

下一步当然是让WorkBuddy使用这个Skill去生成一个数据大屏了，数据大屏顾名思义，你得有数据。还有就是，你还得知道这套Skill自带了哪些模板。因此老马先让WorkBuddy查一下模板有哪些：

查完了模板，就暂且选择了一套园区物业管理的。接下来就是让WorkBuddy生成一些虚拟的数据，就是假数据，放进模板里面去生成数据大屏：

生成后的第一版效果如下图，这是2021的静态DataV模板，啥动态效果都没有，那是真叫一个丑：

因此老马继续让WorkBuddy对这个模板进行美化修改，正好也看看Hy4模型在生成网页方面的效果如何。经过一番改造，更新美化后的模板算是好看了一些，也有了实时的动效和数据的更新显示：

04 · CHAPTER FOUR

接真实数据：文件格式与pandas

所以大家不必拘泥于Skill原先自带的数据大屏模板不好看，或者是排版布局不符合自己的需求。没有关系的，你就截图告诉WorkBuddy去修改。或者给它一些参考的图片和文件都行，改到自己满意为止。

另外，这个数据大屏是支持json、xlsx、xls三类文件格式输入的，也就是说你后期要接入自己的真实数据，可以让WorkBuddy给你做个API的接口，你对接上自己的系统数据过去就行了：

如上图所示，老马就可以把这套生产的数据大屏项目，直接找一台专用的电脑部署上去。启动好API服务对接好数据接口。再用什么HDMI线插个LED大屏，有啥分辨率问题再调调，一套能用的数据大屏就做好了。

另外，如果了解过Python处理表格数据的标准库，即pandas的小伙伴。你也可以把CSV、Excel、数据库处理成标准的Json格式，再丢给html数据大屏，流程如图：

但是这里大家要搞清楚的一点是，虽然都是在拿数据获取数据。pandas是构建期的数据加工工具，API是运行期的刷新通道，两者是不在同一层的。

pandas是跑一次算一次，产出静态JSON文件。API是页面自己定时去拉取数据的局部刷新。生产环境里两者通常配合用，服务端拿pandas从数据库实时聚合成契约JSON作为接口响应，前端仍走API的模式。

当然这里是用老马搭建的项目举例，具体你自己去实操落地的时候。你可以用大白话告诉WorkBuddy，我这个数据是要实时从哪里更新获取的，数据大屏也是要实时刷新的，怎么弄，WorkBuddy会给你生成解决方案的。

∞ · POSTSCRIPT

写在最后

好了，以上就是今天的分享。欢迎关注、点赞、转发一键三连。有任何问题和需求，请在评论区留言，回见！