说明：
前端使用：vue3.0 ECharts可视化库
前后端对接数据格式：无非就是前端把后端返回的数据处理为自己想要的格式，或者，后端给前端处理好想要的格式；
针对前后端的柱状图，趋势图等数据对接，前端一般需要数组格式；
我们之前返回的数据格式是LIst Map
举例：动态数据统计思路案例（动态，排序，containsKey）五（117）
如图所示；
而我们需要数组格式：
后端代码处理：
@Override
public 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 LinkedHashMap<>();
// Map存储：(region,统计次数）,统计次数为相同region的次数；
Map<String,Object> countMap = new LinkedHashMap<>();
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> regionList2 = new ArrayList<String>(); // 地域2
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 key = entry.getKey();
String value = String.valueOf(entry.getValue());
regionList2.add(key);
countList.add(value);
}
// 计算平均值：封装集合avgList
if(regionList.size() == numberList.size() && regionList2.size() == countList.size() && regionList.size() == regionList2.size()) {
for (int i = 0; i < regionList.size(); i++) {
String reg1 = regionList.get(i);
double fenzi = Double.parseDouble(numberList.get(i));
for (int j = 0; j < regionList2.size(); j++) {
String reg2 = regionList2.get(j);
if(reg1.equals(reg2)) {
int fenmu = Integer.valueOf(countList.get(j));
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中添加排序字段：sortValue
String[] 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
最后返回值修改如下：文章来源：https://www.toymoban.com/news/detail-682032.html
// listFinal中添加排序字段：sortValue
String[] 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测试：
这样前端就可以直接获取使用了，返回的数组里面也是经过排序处理的；文章来源地址https://www.toymoban.com/news/detail-682032.html
到了这里，关于【Java 动态数据统计图】前后端对接数据格式（Map返回数组格式数据）六（120）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
