当前位置: 首页 > news >正文

【Java 动态数据统计图】前后端对接数据格式(Map返回数组格式数据)六(120)

说明
前端使用:vue3.0
前后端对接数据格式:无非就是前端把后端返回的数据处理为自己想要的格式,或者,后端给前端处理好想要的格式;
针对前后端的柱状图,趋势图等数据对接,前端一般需要数组格式;
我们之前返回的数据格式是LIst Map
举例:动态数据统计思路案例(动态,排序,containsKey)五(117)
如图所示;
在这里插入图片描述
而我们需要数组格式:
后端代码处理:

	@Overridepublic Map<String,Object> getTimeData(HttpServletRequest request, Map<String, Object> paramMap) {List<Map<String,Object>> list = getCountData(request,paramMap);list = list.stream().filter(e -> (e.get("status").equals("关闭"))).collect(Collectors.toList());// Map存储:(region,num),num为相同region的加和;Map<String,Object> regionMap = new HashMap<>();// Map存储:(region,统计次数),统计次数为相同region的次数;Map<String,Object> countMap = new HashMap<>();for (int i = 0; i < list.size(); i++) {String region = String.valueOf(list.get(i).get("region"));String num = String.valueOf(list.get(i).get("processTime"));// regionMap包含region:将region当作key;if(regionMap.containsKey(region)) {String key = region;String value = String.valueOf(regionMap.get(key));  // 从regionMap获取value值;即地域对应的num值;regionMap.put(region, Double.parseDouble(value) + Double.parseDouble(num));}else {  // 不包含,直接存进去regionMap.put(region, num);}// countMap包含region:将region当作key;if(countMap.containsKey(region)) {String key2 = region;String value2 = String.valueOf(countMap.get(key2));  // 从countMap获取value值;即地域对应的统计次数值;countMap.put(region, Integer.valueOf(value2) + 1);}else {  // 不包含,直接存进去countMap.put(region, 1);}}List<String> regionList = new LinkedList<String>();  // 地域List<String> numberList = new LinkedList<String>();  // 数值List<String> countList = new LinkedList<String>();  // 统计次数List<String> avgList = new LinkedList<String>();  // 平均值// 封装地域集合:(北京,数值和)Iterator<Map.Entry<String, Object>> it = regionMap.entrySet().iterator();while(it.hasNext()){Map.Entry<String, Object> entry = it.next();String key = entry.getKey();String value = String.valueOf(entry.getValue());regionList.add(key);numberList.add(value);}// 封装统计次数集合:(北京,统计次数)Iterator<Map.Entry<String, Object>> it2 = countMap.entrySet().iterator();while(it2.hasNext()){Map.Entry<String, Object> entry = it2.next();String value = String.valueOf(entry.getValue());countList.add(value);}// 计算平均值:封装集合avgListif(numberList.size() == countList.size()) {for (int i = 0; i < numberList.size(); i++) {double fenzi = Double.parseDouble(numberList.get(i));int fenmu = Integer.valueOf(countList.get(i));if(fenmu > 0) {Double x =  fenzi/fenmu;// double类型的数据当分母的数值趋近0的时候,返回来的数值就是一个NAN:if(Double.isNaN(x)){x = 0.0;}avgList.add(String.valueOf(x));}}}// 最终输出集合:List<Map<String,Object>> resultList = new ArrayList<>();// 根据地域集合与平均值集合封装新集合resultList:if(regionList.size() == avgList.size()) {for (int i = 0; i < regionList.size(); i++) {Map<String,Object> map = new HashMap<>();map.put("title",regionList.get(i));map.put("value",avgList.get(i).substring(0,avgList.get(i).indexOf(".")+2));resultList.add(map);}}//排序:value值大的Map往前排,斌且插入新字段:sortValue,代表序列;Double[] valueSort = new Double[resultList.size()];String[] titleSort = new String[resultList.size()];// 排序后最终输出集合:List<Map<String,Object>> listFinal= new ArrayList<>();// 获取排序的数组:for (int i = 0; i < resultList.size(); i++) {valueSort[i] = Double.parseDouble(String.valueOf(resultList.get(i).get("value")));titleSort[i] = String.valueOf(resultList.get(i).get("title"));}// 数组排序:BubblSortUtils.bubbleSortDescMultipleDouble(valueSort,titleSort);// 数组封装listFinal:for (int i = 0; i < valueSort.length; i++) {String ch = String.valueOf(titleSort[i]);for (int j = 0; j < resultList.size(); j++) {String value = String.valueOf(resultList.get(j).get("title"));if(ch.equals(value)){listFinal.add(resultList.get(j));}}}// listFinal中添加排序字段:sortValueString[] A = new String[listFinal.size()];String[] B = new String[listFinal.size()];for (int i = 0; i < listFinal.size(); i++) {listFinal.get(i).put("sortValue",listFinal.size()-i);A[i] = String.valueOf(listFinal.get(i).get("title"));B[i] = String.valueOf(listFinal.get(i).get("value"));}Map<String,Object> restMap = new HashMap<>();restMap.put("title",A);restMap.put("value",B);return restMap;}

备注:以上代码可简化处理,写这么多是为了明确每个过程,提供数据处理的拓展思路;
代码修改位置
1.最终返回值由List Map改为数组返回:
2.修改接口返回值类型:由List Map修改为Map
最后返回值修改如下:

	// listFinal中添加排序字段:sortValueString[] A = new String[listFinal.size()];String[] B = new String[listFinal.size()];for (int i = 0; i < listFinal.size(); i++) {listFinal.get(i).put("sortValue",listFinal.size()-i);A[i] = String.valueOf(listFinal.get(i).get("title"));B[i] = String.valueOf(listFinal.get(i).get("value"));}Map<String,Object> restMap = new HashMap<>();restMap.put("title",A);restMap.put("value",B);return restMap;

Postman测试:
在这里插入图片描述
这样前端就可以直接获取使用了,返回的数组里面也是经过排序处理的;

相关文章:

【Java 动态数据统计图】前后端对接数据格式(Map返回数组格式数据)六(120)

说明&#xff1a; 前端使用&#xff1a;vue3.0 前后端对接数据格式&#xff1a;无非就是前端把后端返回的数据处理为自己想要的格式&#xff0c;或者&#xff0c;后端给前端处理好想要的格式&#xff1b; 针对前后端的柱状图&#xff0c;趋势图等数据对接&#xff0c;前端一般需…...

❤ 给自己的mac系统上安装java环境

❤ 给自己的mac系统上安装java环境 &#x1f353; 作为前端工程师如何给自己的mac系统上安装java环境 &#x1f34e; 最近因为自己的一些项目需求&#xff0c;mac电脑上需要安装一些后台的java环境&#xff0c;用来跑后台的java程序&#xff0c;于是从一个前端工程师的角度安…...

Java-匿名类

介绍 匿名类是指没有名字的类&#xff0c;它对一个给定的类进行拓展&#xff0c;或者实现一个给定的接口。使用匿名类可以使得代码更加简洁、紧凑、模块程度更高。 实现方式及语法 匿名类有两种实现方式 继承一个类&#xff0c;重写其方法实现一个接口&#xff08;可以是多…...

Maven的超级POM

对于我们创建的一个maven工程&#xff0c;即便我们自己的pom.xm文件中没有明确指定一个父工程&#xff08;父POM&#xff09;&#xff0c;其实也默认继承了超级POM&#xff0c;就好比JAVA类继承Object类一样。 maven官网关于超级POM的介绍&#xff1a; https://maven.apache.o…...

软考高级系统架构设计师系列论文九十二:论新技术的引进

软考高级系统架构设计师系列论文九十二:论新技术的引进 一、摘要二、正文三、总结一、摘要 根据国家税务总局对税务系统内所有系统进行集成与整合的需求,我所在的开发单位组织了全国金税工程防伪税控系统网络版的升级开发工作。该项目工程浩大,要求在具有严格的安全、可靠性…...

vue使用Bootstrap的详细方法

要在Vue中使用Bootstrap&#xff0c;您可以按照以下步骤进行操作&#xff1a; 安装Bootstrap&#xff1a;首先&#xff0c;您需要安装Bootstrap。您可以使用npm或者yarn来安装Bootstrap。打开终端&#xff0c;并在项目的根目录中运行以下命令&#xff1a; npm install bootst…...

leetcode做题笔记103. 二叉树的锯齿形层序遍历

给你二叉树的根节点 root &#xff0c;返回其节点值的 锯齿形层序遍历 。&#xff08;即先从左往右&#xff0c;再从右往左进行下一层遍历&#xff0c;以此类推&#xff0c;层与层之间交替进行&#xff09;。 思路一&#xff1a;BFS #define N 2000int** zigzagLevelOrder(st…...

如果将PC电脑变成web服务器:利用Nignx反向代理绕过运营商对80端口封锁

如果将PC电脑变成web服务器&#xff1a;利用Nignx反向代理绕过运营商对80端口封锁 在上一篇文章中&#xff0c;我们已经实现了内网主机的多次端口映射&#xff0c;将内网主机的端口映射到了公网&#xff0c;可以通过公网访问该主机了。 因为电信的家庭宽带&#xff0c;默认是…...

Eureka:服务注册-信息配置-自我保护机制

首先在提供者服务下&#xff0c;添加一个依赖 <!-- Eureka --><dependency><groupId>org.springframework.cloud</groupId><artifactId>spring-cloud-starter-eureka</artifactId><version>1.4.6.RELEASE</version><…...

C++二叉树进阶

本期内容我们讲解二叉树的进阶知识&#xff0c;没有看过之前内容的小伙伴建议先看往期内容 二叉树-----补充_KLZUQ的博客-CSDN博客 目录 二叉搜索树 代码实现 基础框架 Insert Find Erase 析构函数 拷贝构造 赋值 二叉搜索树的应用 全部代码 二叉搜索树 二叉搜索树…...

layui tree组件取消勾选

layui(2.8.15) tree的api中&#xff0c;只有 tree.setChecked(id, idArr) 方法&#xff0c;没有取消勾选的方法。 我的需求是&#xff1a;勾选后做判断&#xff0c;如果不符合条件则取消勾选。 实现方法&#xff1a; 使用 tree的oncheck事件&#xff0c;在回调函数中做判断&…...

【Android基础面试题】ViewPager与ViewPager2的区别

ViewPager和ViewPager2是Android中用于实现滑动页面切换的控件。它们的主要区别如下&#xff1a; 实现方式 ViewPager2的内部实现是RecyclerView&#xff0c;而ViewPager是通过继承自ViewGroup实现的。因此&#xff0c;ViewPager2的性能更高。 滑动方向 ViewPager2可以实现横向…...

springCloudGateway网关配置

1.配置跨域支持 /*** 跨域支持*/ Configuration public class CorsConfig {Beanpublic CorsWebFilter corsFilter() {CorsConfiguration config new CorsConfiguration();config.addAllowedMethod("*");config.addAllowedOrigin("*");config.addAllowedH…...

kali 2023.3新增工具

在终端模拟器中运行 sudo apt update && sudo apt full-upgrade 命令来更新其安装 Kali Linux 2023.3 发布中包含了九个新工具&#xff0c;分别是&#xff1a; Calico&#xff1a;云原生网络和网络安全。 cri-tools&#xff1a;用于Kubelet容器运行时接口的命令行界面…...

W25Q64 驱动--基于SPI2接口

前言 &#xff08;1&#xff09;本系列是基于STM32的项目笔记&#xff0c;内容涵盖了STM32各种外设的使用&#xff0c;由浅入深。 &#xff08;2&#xff09;小编使用的单片机是STM32F105RCT6&#xff0c;项目笔记基于小编的实际项目&#xff0c;但是博客中的内容适用于各种单片…...

禁用无线键盘指定按键

文章目录 前言主体 前言 睡一觉把键盘压坏了一个按键,一开机键盘就自动打出这个字母,我在想用其他按键平替这个字母即可,使用软件修改内部的映射,那么使用autoHotkey软件是十分容易做到的 主体 letter_replace.ahk 创建一个如此命名的文件,然后输入命令即可 a::b 代表平替 a…...

分数规划(二分)

链接&#xff1a;登录—专业IT笔试面试备考平台_牛客网 来源&#xff1a;牛客网 题目描述 小咪是一个土豪手办狂魔&#xff0c;这次他去了一家店&#xff0c;发现了好多好多&#xff08;n个&#xff09;手办&#xff0c;但他是一个很怪的人&#xff0c;每次只想买k个手办&a…...

Vue2向Vue3过度Vue3状态管理工具Pinia

目录 1. 什么是Pinia2. 手动添加Pinia到Vue项目3. Pinia基础使用4. getters实现5. action异步实现6. storeToRefs工具函数7. Pinia的调试8. Pinia持久化插件 1. 什么是Pinia Pinia 是 Vue 的专属的最新状态管理库 &#xff0c;是 Vuex 状态管理工具的替代品 2. 手动添加Pinia到…...

STM32--SPI通信与W25Q64(1)

文章目录 前言SPI通信硬件电路移位过程 SPI时序起始与终止条件交换一个字节 W25Q64硬件电路框图 FLASH操作注意事项软件SPI读写W25Q64 前言 USART串口链接入口 I2C通信链接入口 SPI通信 SPI&#xff08;Serial Peripheral Interface&#xff09;是一种高速的、全双工、同步的串…...

版本控制工具Git常见用法

Git 是一个非常强大和灵活的版本控制工具&#xff0c;提供了许多命令和功能来管理代码的版本、分支、合并等。以下是一些 Git 的详细用法&#xff1a; 配置相关命令&#xff1a; 设置用户名和邮箱&#xff1a; git config --global user.name "Your Name" git conf…...

Cursor实现用excel数据填充word模版的方法

cursor主页&#xff1a;https://www.cursor.com/ 任务目标&#xff1a;把excel格式的数据里的单元格&#xff0c;按照某一个固定模版填充到word中 文章目录 注意事项逐步生成程序1. 确定格式2. 调试程序 注意事项 直接给一个excel文件和最终呈现的word文件的示例&#xff0c;…...

【CSS position 属性】static、relative、fixed、absolute 、sticky详细介绍,多层嵌套定位示例

文章目录 ★ position 的五种类型及基本用法 ★ 一、position 属性概述 二、position 的五种类型详解(初学者版) 1. static(默认值) 2. relative(相对定位) 3. absolute(绝对定位) 4. fixed(固定定位) 5. sticky(粘性定位) 三、定位元素的层级关系(z-i…...

高等数学(下)题型笔记(八)空间解析几何与向量代数

目录 0 前言 1 向量的点乘 1.1 基本公式 1.2 例题 2 向量的叉乘 2.1 基础知识 2.2 例题 3 空间平面方程 3.1 基础知识 3.2 例题 4 空间直线方程 4.1 基础知识 4.2 例题 5 旋转曲面及其方程 5.1 基础知识 5.2 例题 6 空间曲面的法线与切平面 6.1 基础知识 6.2…...

学习STC51单片机31(芯片为STC89C52RCRC)OLED显示屏1

每日一言 生活的美好&#xff0c;总是藏在那些你咬牙坚持的日子里。 硬件&#xff1a;OLED 以后要用到OLED的时候找到这个文件 OLED的设备地址 SSD1306"SSD" 是品牌缩写&#xff0c;"1306" 是产品编号。 驱动 OLED 屏幕的 IIC 总线数据传输格式 示意图 …...

【git】把本地更改提交远程新分支feature_g

创建并切换新分支 git checkout -b feature_g 添加并提交更改 git add . git commit -m “实现图片上传功能” 推送到远程 git push -u origin feature_g...

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

Springboot社区养老保险系统小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;社区养老保险系统小程序被用户普遍使用&#xff0c;为方…...

STM32HAL库USART源代码解析及应用

STM32HAL库USART源代码解析 前言STM32CubeIDE配置串口USART和UART的选择使用模式参数设置GPIO配置DMA配置中断配置硬件流控制使能生成代码解析和使用方法串口初始化__UART_HandleTypeDef结构体浅析HAL库代码实际使用方法使用轮询方式发送使用轮询方式接收使用中断方式发送使用中…...

Redis:现代应用开发的高效内存数据存储利器

一、Redis的起源与发展 Redis最初由意大利程序员Salvatore Sanfilippo在2009年开发&#xff0c;其初衷是为了满足他自己的一个项目需求&#xff0c;即需要一个高性能的键值存储系统来解决传统数据库在高并发场景下的性能瓶颈。随着项目的开源&#xff0c;Redis凭借其简单易用、…...

Python+ZeroMQ实战:智能车辆状态监控与模拟模式自动切换

目录 关键点 技术实现1 技术实现2 摘要&#xff1a; 本文将介绍如何利用Python和ZeroMQ消息队列构建一个智能车辆状态监控系统。系统能够根据时间策略自动切换驾驶模式&#xff08;自动驾驶、人工驾驶、远程驾驶、主动安全&#xff09;&#xff0c;并通过实时消息推送更新车…...