1. 后端:Java 技术栈
核心框架
SpringBoot(核心)
提供数据接口、业务逻辑、定时统计、权限校验;
SpringMVC:对外提供 RESTful 接口,给前端大屏推送销售数据;
MyBatis/MyBatis-Plus:操作业务数据库(MySQL/PostgreSQL),统计销售、订单、利润、地区数据;
Spring Data Redis:缓存汇总指标(总销售额、销量)、热点排行,减少数据库查询压力;
Scheduled 定时任务:定时聚合日 / 月销售数据,预计算图表统计数据;
可选中间件:
MySQL/PostgreSQL:存储订单、商品、地区销售原始业务数据;
RabbitMQ:实时订单入库后,异步刷新大屏实时指标;
Nacos/Apollo:配置大屏刷新频率、图表阈值、展示指标。
2. 前端可视化框架(页面图表、地图、环形图、折线图全部依赖)
主可视化方案:ECharts(90% 企业大屏标准选择)
页面里所有组件均由 ECharts 实现:
世界地图航线图:echarts-gl 地理地图组件 + 航线飞线特效;
环形占比图(欧洲 63%、亚洲 65% 等):ECharts 环形饼图;
柱状对比图「实际销售 VS 目标销售」:ECharts 分组条形图;
双折线图「成本利润趋势」:ECharts 多系列折线图;
右侧饼图「商品销售占比」:ECharts 标准饼图;
产品排行榜、数字指标卡片:ECharts 文字 + 自定义 DOM 布局。
前端工程框架配套
Vue2/Vue3 + ElementUI/Element Plus:整体页面布局、卡片、表格(右侧出口订单表格);
轻量方案:原生 HTML+jQuery+ECharts(小型内部大屏常用);
实时刷新:
短轮询:前端定时setInterval请求 Java 后端接口刷新数据;
WebSocket(高实时需求):SpringBoot 整合 WebSocket,后端数据更新主动推送前端。