作者水平低，如有错误，恳请指正！谢谢！！！！！
项目简单，适合大学生参考
分类专栏还有其它的可视化博客哦！
专栏地址：https://blog.csdn.net/qq_55906442/category_11906804.html?spm=1001.2014.3001.5482
成果展示：
一、数据源
1）可以使用自己的MySQL数据库；
2）使用我提供的数据。（要数据私信/留言——>留下邮箱即可）
二、所需工具
MySQL、IDEA、jdk1.8、Maven等等，总之编写工具要准备好，环境要搭建好
三、项目框架搭建
参考我博客的项目框架搭建，从3.1看到4.3即可springboot+mybatis+echarts +mysql制作数据可视化大屏_spring + 可视化大屏_一个人的牛牛的博客-CSDN博客
四、代码编写
代码简单，后端代码都写在一起了，没有区分controller等等，前端也是一样，没有单独写js等等。
4.1 区域销量统计条形图
1.1 后端
import org.springframework.beans.factory.annotation.Autowired;import org.springframework.jdbc.core.JdbcTemplate;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;@RestControllerpublic class Big1 { private final JdbcTemplate jdbcTemplate; @Autowired public Big1(JdbcTemplate jdbcTemplate) { this.jdbcTemplate = jdbcTemplate; } @GetMapping("/chart-data") public Map getChartData() { String query = "SELECT region_name, COUNT(*) AS count FROM ads_area_topic GROUP BY region_name"; List> result = jdbcTemplate.queryForList(query); List labels = new ArrayList<>(); List values = new ArrayList<>(); for (Map row : result) { String regionName = (String) row.get("region_name"); Integer count = ((Number) row.get("count")).intValue(); labels.add(regionName); values.add(count); } Map data = new HashMap<>(); data.put("labels", labels); data.put("values", values); return data; }} 验证接口：运行项目，浏览器访问http://localhost:8080/chart-data
1.2 前端
区域销量统计 验证页面：运行项目，浏览器访问http://localhost:8080/big1.html
4.2 订单金额折线图
2.1 后端
import org.springframework.beans.factory.annotation.Autowired;import org.springframework.jdbc.core.JdbcTemplate;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;@RestControllerpublic class Big2Controller { private final JdbcTemplate jdbcTemplate; @Autowired public Big2Controller(JdbcTemplate jdbcTemplate) { this.jdbcTemplate = jdbcTemplate; } @GetMapping("/chart-data2") public Map getChartData() { String query = "SELECT dt, order_amount FROM ads_order_daycount"; List> result = jdbcTemplate.queryForList(query); List labels = new ArrayList<>(); List values = new ArrayList<>(); for (Map row : result) { String dt = row.get("dt").toString(); Integer orderAmount = ((Number) row.get("order_amount")).intValue(); labels.add(dt); values.add(orderAmount); } Map data = new HashMap<>(); data.put("labels", labels); data.put("values", values); return data; }} 验证接口：运行项目，浏览器访问http://localhost:8080/chart-data2
2.2 前端
折线图 验证页面：运行项目，浏览器访问http://localhost:8080/big2.html
4.3 平均支付时间统计
3.1 后端
import org.springframework.beans.factory.annotation.Autowired;import org.springframework.jdbc.core.JdbcTemplate;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;@RestControllerpublic class Big3Controller { private final JdbcTemplate jdbcTemplate; @Autowired public Big3Controller(JdbcTemplate jdbcTemplate) { this.jdbcTemplate = jdbcTemplate; } @GetMapping("/chart-data3") public Map getChartData() { String query = "SELECT dt, payment_avg_time FROM ads_payment_daycount"; List> result = jdbcTemplate.queryForList(query); List labels = new ArrayList<>(); List values = new ArrayList<>(); for (Map row : result) { String dt = row.get("dt").toString(); Integer paymentAvgTime = ((Number) row.get("payment_avg_time")).intValue(); labels.add(dt); values.add(paymentAvgTime); } Map data = new HashMap<>(); data.put("labels", labels); data.put("values", values); return data; }} 验证接口：运行项目，浏览器访问http://localhost:8080/chart-data3
3.2 前端
平均支付时间统计 验证页面：运行项目，浏览器访问http://localhost:8080/big3.html
4.4 订单金额统计
4.1 后端
import org.springframework.beans.factory.annotation.Autowired;import org.springframework.jdbc.core.JdbcTemplate;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;@RestControllerpublic class Big4Controller { private final JdbcTemplate jdbcTemplate; @Autowired public Big4Controller(JdbcTemplate jdbcTemplate) { this.jdbcTemplate = jdbcTemplate; } @GetMapping("/chart-data4") public Map getChartData() { String query = "SELECT dt, order_amount FROM ads_payment_daycount"; List> result = jdbcTemplate.queryForList(query); List labels = new ArrayList<>(); List values = new ArrayList<>(); for (Map row : result) { String dt = row.get("dt").toString(); Integer orderAmount = ((Number) row.get("order_amount")).intValue(); labels.add(dt); values.add(orderAmount); } Map data = new HashMap<>(); data.put("labels", labels); data.put("values", values); return data; }} 验证接口：运行项目，浏览器访问http://localhost:8080/chart-data4
4.2 前端
订单金额统计 验证页面：运行项目，浏览器访问http://localhost:8080/big4.html
五、大屏编写
大屏可视化 销售数据平面一览大屏
运行项目，浏览器访问http://localhost:8080/large screen.html
注：http://localhost:8080/加上HTML的文件名都能够查看相应的图！
要码源的私聊/评论留下邮箱号，压缩包包括项目源码、数据sql文件，readme.txt。
声明：作品仅可作学习使用。
来源地址：https://blog.csdn.net/qq_55906442/article/details/131465687
