前往小程序,Get更优阅读体验!
立即前往
发布
社区首页 >专栏 >数据可视化:基于 Echarts + SpringBoot 的动态实时大屏银行监管系统【源码】

数据可视化:基于 Echarts + SpringBoot 的动态实时大屏银行监管系统【源码】

作者头像
Java团长
发布2022-12-20 19:09:07
发布2022-12-20 19:09:07
6.3K10
代码可运行
举报
运行总次数:0
代码可运行

数据可视化大屏的出现,掀起一番又一番的浪潮,众多企业主纷纷想要打造属于自己的“酷炫吊炸天”的霸道总裁大屏驾驶舱。

一、效果图展示

1、动态实时更新数据效果图

2、鼠标右键切换主题

二、 确定需求方案

1、确定产品上线部署的屏幕LED分辨率

本案例基于16:9 屏宽比,F11全屏显示。

2、部署方式

基于免安装可执行程序:支持Windows、Linux、Mac等各种操作系统;将程序复制到服务器上即可,无需其它环境依赖;

观看方式:既可在服务器上直接观看程序界面,也可在远程用浏览器打开播放,例如Chrome浏览器、360浏览器等。

三、整体架构设计

  1. 前端基于Echarts开源库设计,使用WebStorm编辑器;
  2. 后端基于Java Web实现,使用 IDEA 编辑器;
  3. 数据传输格式:JSON;
  4. 数据源类型:目前采用JSON文件方式,自行添加Mybatis可支持PostgreSQL、MySQL、Oracle、Microsoft SQL Server、SQLite,自行添加POI可支持Excel表格等,还可以定制HTTP API接口方式。
  5. 数据更新方式:采用http get 轮询方式 。在实际应用中,也可以视情况选择j监测后端数据实时更新,实时推送到前端的方式;

四、开发配置&代码结构说明

1、Java开发环境配置

然后GENERATE,下载包即可。

2、json库配置

使用alibaba的json库,pom.xml文件增加配置:

代码语言:javascript
代码运行次数:0
复制
<dependency>
   <groupId>com.alibaba</groupId>
   <artifactId>fastjson</artifactId>
   <version>1.2.51</version>
</dependency>

3、代码结构说明

a、静态路径

b、Java 目录

c、端口配置

4、启动命令

5、浏览器查看

浏览器中输入网址查看大屏(端口为 application.properties 中的 server.port 值) http://localhost:80xx

五、源码获取方法

本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2022-12-17,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 Java团长 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、效果图展示
    • 1、动态实时更新数据效果图
    • 2、鼠标右键切换主题
  • 二、 确定需求方案
    • 1、确定产品上线部署的屏幕LED分辨率
    • 2、部署方式
  • 三、整体架构设计
  • 四、开发配置&代码结构说明
    • 1、Java开发环境配置
    • 2、json库配置
    • 3、代码结构说明
    • 4、启动命令
    • 5、浏览器查看
  • 五、源码获取方法
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档