首页盒须图开发

cpp-admin/src/main/java/com/cpp/web/service/accuracy/impl/ShortTermSinglePointDeviationServiceImpl.java

@@ -1,12 +1,16 @@
 package com.cpp.web.service.accuracy.impl;
 
+import cn.hutool.core.date.DateUtil;
 import cn.hutool.core.util.StrUtil;
 import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
 import com.cpp.web.domain.accuracy.ShortTermSinglePointDeviation;
+import com.cpp.web.domain.station.ElectricField;
 import com.cpp.web.mapper.accuracy.ShortTermSinglePointDeviationMapper;
 import com.cpp.web.service.accuracy.ShortTermSinglePointDeviationService;
+import com.cpp.web.service.station.ElectricFieldService;
 import com.cpp.web.utils.DateTimeUtil;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.core.parameters.P;
 import org.springframework.stereotype.Service;
 
@@ -24,7 +28,8 @@ import java.util.stream.Collectors;
  */
 @Service
 public class ShortTermSinglePointDeviationServiceImpl extends ServiceImpl<ShortTermSinglePointDeviationMapper, ShortTermSinglePointDeviation> implements ShortTermSinglePointDeviationService {
-
+    @Autowired
+    ElectricFieldService electricFieldService;
     private final SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
 
     @Override
@@ -53,23 +58,44 @@ public class ShortTermSinglePointDeviationServiceImpl extends ServiceImpl<ShortT
         List timeList = new ArrayList<>();
         List abnormalList = new ArrayList<>();
 
+        Map<String,List<List>> deviationMap = new HashMap<>();
         for (String s : dateList) {
             timeList.add(s);
             if (groupedByDate.get(s) != null) {
-                // 转换为数组
-//                double[] array = groupedByDate.get(s).stream().mapToDouble(Double::doubleValue).toArray();
                 double[] array = groupedByDate.get(s).stream().map(ShortTermSinglePointDeviation::getDeviation).mapToDouble(m -> m.doubleValue()).toArray();
                 // 所需盒须值
                 Object[] result = plot(array,s);
                 dataList.add(result);
-
-                double q3 = (Double) result[3];
-                double q1 = (Double)result[1];
-
                 if (StrUtil.isBlankIfStr(stationCode)){
-                    Map dashboardMap = plotDashboardData(groupedByDate);
-                    map.put("abnormal", dashboardMap);
+                    List<ElectricField> electricFieldList = electricFieldService.list();
+                    double min = (Double) result[0];
+                    double max = (Double)result[4];
+                    // 每天的获取异常值
+                    List<ShortTermSinglePointDeviation> shortTermSinglePointDeviationList = groupedByDate.get(s).stream()
+                            .filter(f -> f.getDeviation().doubleValue() < min || f.getDeviation().doubleValue() > max).collect(Collectors.toList());
+
+                    // 遍历异常
+                    for (ShortTermSinglePointDeviation shortTermSinglePointDeviation : shortTermSinglePointDeviationList) {
+                        List<Object> ycDataList = new ArrayList<>();
+                        ycDataList.add(DateUtil.format(shortTermSinglePointDeviation.getTime(),"yyyy-MM-dd"));
+                        ycDataList.add(shortTermSinglePointDeviation.getDeviation());
+                        shortTermSinglePointDeviation.getStationCode();
+                        ElectricField electricField = electricFieldList.stream().filter(e -> e.getStationCode().equals(shortTermSinglePointDeviation.getStationCode())).findFirst().get();
+
+                        if (deviationMap.get(electricField.getName())!=null){
+                            List<List> deviationList = deviationMap.get(electricField.getName());
+                            deviationList.add(ycDataList);
+                        }
+                        else{
+                            List<List> deviationList = new ArrayList<>();
+                            deviationList.add(ycDataList);
+                            deviationMap.put(electricField.getName(),deviationList);
+                        }
+                    }
+                    map.put("abnormal", deviationMap);
                 }else {
+                    double q3 = (Double) result[3];
+                    double q1 = (Double)result[1];
                     // 获取异常值
                     List<Double> doubleList = groupedByDate.get(s).stream()
                             .filter(f -> f.getDeviation().doubleValue() < q1 || f.getDeviation().doubleValue() > q3)
@@ -91,14 +117,8 @@ public class ShortTermSinglePointDeviationServiceImpl extends ServiceImpl<ShortT
         }
         map.put("result", dataList);
         map.put("time", timeList);
-
         return map;
     }
-    private Map plotDashboardData(Map<String, List<ShortTermSinglePointDeviation>> groupedByDate) {
-
-
-        return null;
-    }
 
     public static Object[] plot(double[] data,String date) {
         Arrays.sort(data);

cpp-ui/src/views/largeScreen/components/left-bottom.vue

@@ -50,82 +50,82 @@ export default {
       handler(value) {
         this.chartData = value
 
-        this.chartData ={
-          boxplotData: [
-            "",
-            "",
-            "",
-            "",
-            [
-              -3.21,
-              16.67,
-              27.45,
-              29.92,
-              49.79,
-              "2024-11-16"
-            ],
-            "",
-            [
-              -44.91,
-              0,
-              20.72,
-              29.94,
-              74.85,
-              "2024-11-18"
-            ],
-            [
-              -44.91,
-              0,
-              20.01,
-              29.94,
-              74.85,
-              "2024-11-19"
-            ],
-            "",
-            ""
-          ],
-          scatterData: {
-            '新疆':[
-              [
-                "2024-11-18",
-                66.05
-              ],[
-                "2024-11-18",
-                66.05
-              ],
-              [
-                "2024-11-18",
-                64.36
-              ]
-            ],
-            '风电':[
-              [
-                "2024-11-18",
-                66.05
-              ],[
-                "2024-11-18",
-                66.05
-              ],
-              [
-                "2024-11-18",
-                64.36
-              ]
-            ],
-          }
-            ,
-          xData: [
-            "2024-11-12",
-            "2024-11-13",
-            "2024-11-14",
-            "2024-11-15",
-            "2024-11-16",
-            "2024-11-17",
-            "2024-11-18",
-            "2024-11-19",
-            "2024-11-20",
-            "2024-11-21"
-          ]
-        }
+        // this.chartData ={
+        //   boxplotData: [
+        //     "",
+        //     "",
+        //     "",
+        //     "",
+        //     [
+        //       -3.21,
+        //       16.67,
+        //       27.45,
+        //       29.92,
+        //       49.79,
+        //       "2024-11-16"
+        //     ],
+        //     "",
+        //     [
+        //       -44.91,
+        //       0,
+        //       20.72,
+        //       29.94,
+        //       74.85,
+        //       "2024-11-18"
+        //     ],
+        //     [
+        //       -44.91,
+        //       0,
+        //       20.01,
+        //       29.94,
+        //       74.85,
+        //       "2024-11-19"
+        //     ],
+        //     "",
+        //     ""
+        //   ],
+        //   scatterData: {
+        //     '新疆':[
+        //       [
+        //         "2024-11-18",
+        //         66.05
+        //       ],[
+        //         "2024-11-18",
+        //         66.05
+        //       ],
+        //       [
+        //         "2024-11-18",
+        //         64.36
+        //       ]
+        //     ],
+        //     '风电':[
+        //       [
+        //         "2024-11-18",
+        //         66.05
+        //       ],[
+        //         "2024-11-18",
+        //         66.05
+        //       ],
+        //       [
+        //         "2024-11-18",
+        //         64.36
+        //       ]
+        //     ],
+        //   }
+        //     ,
+        //   xData: [
+        //     "2024-11-12",
+        //     "2024-11-13",
+        //     "2024-11-14",
+        //     "2024-11-15",
+        //     "2024-11-16",
+        //     "2024-11-17",
+        //     "2024-11-18",
+        //     "2024-11-19",
+        //     "2024-11-20",
+        //     "2024-11-21"
+        //   ]
+        // }
 
         this.setOptions(this.chartData)
       }
@@ -250,9 +250,9 @@ export default {
           },
           formatter: function (params){
             let str = '<div style="max-height: 50vh;overflow-y: auto">'+params[0].axisValue +'<br/>'
-            let scatterStr = '<div class="flex"><div>异常点</div><div class="ml-0">'
+            let scatterStr = '<div class="flex"><div class="ml-0">'
             for(let key in scatterData){
-              let tempStr = '<div class="flex"><div>'+key+':</div><div class="flex" style="flex-wrap: wrap;">'
+              let tempStr = '<div class="flex"><div>'+key+'异常点:</div><div class="flex" style="flex-wrap: wrap;">'
               let data = params.filter(_=>_.seriesName === key)
               if(data.length>0){
                 for(let param of data){
@@ -267,11 +267,11 @@ export default {
             scatterStr = scatterStr+'</div></div>'
             for(let param of params){
               if(param.componentSubType === 'boxplot'){
-                str = str + '<div class="flex justify-between"><div>'+param.marker+'最小值</div><div >'+param.value[1]+'</div></div>'+
-                  '<div class="flex justify-between"><div>'+param.marker+'第一四分位数</div><div>'+param.value[2]+'</div></div>'+
-                  '<div class="flex justify-between"><div>'+param.marker+'中位数</div><div>'+param.value[3]+'</div></div>'+
-                  '<div class="flex justify-between"><div>'+param.marker+'第三四分位数</div><div>'+param.value[4]+'</div></div>'+
-                  '<div class="flex justify-between"><div>'+param.marker+'最大值</div><div>'+param.value[5]+'</div></div>'
+                str = str + '<div class="flex "><div>'+param.marker+'最小值：</div><div >'+param.value[1]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'上四分位数：</div><div>'+param.value[2]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'中位数：</div><div>'+param.value[3]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'下四分位数：</div><div>'+param.value[4]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'最大值：</div><div>'+param.value[5]+'</div></div>'
               }
             }
             str = str + scatterStr+'</div>'
@@ -308,41 +308,6 @@ export default {
           },
         },
         series:series
-        // series: [
-        //   {
-        //     name: '',
-        //     type: 'boxplot',
-        //     itemStyle: {
-        //       color: 'rgba(126,199,250,0.86)',
-        //       // 边线颜色
-        //       borderColor: '#89BFE5',
-        //       // 边线宽度
-        //       borderWidth: 2
-        //     },
-        //     data: boxplotData
-        //   },
-        //   {
-        //     type: 'scatter',
-        //     symbolSize: 8,
-        //     itemStyle: {
-        //       color: function (params) {
-        //         for (let i = 0; i < boxplotData.length; i++) {
-        //           if (boxplotData[i].length>0&&boxplotData[i][5] == params.value[0]){
-        //             var value = params.value[1];
-        //             if ((value < boxplotData[i][1] && value > boxplotData[i][0] )|| (value >boxplotData[i][3] && value < boxplotData[i][4])) {
-        //               return 'orange';
-        //             }
-        //             if (value  <boxplotData[i][0] || value > boxplotData[i][4]) {
-        //               return 'red';
-        //             }
-        //           }
-        //         }
-        //
-        //       }
-        //     },
-        //     data: scatterData
-        //   }
-        // ]
       }
       this.tickChart.setOption(this.option, true)
       window.addEventListener("resize", function () {
@@ -395,32 +360,37 @@ export default {
         })
       }
       option.tooltip.formatter = function (params){
-        let str = '<div style="max-height: 50vh;overflow-y: auto">'+params[0].axisValue +'<br/>'
-        let scatterStr = '<div class="flex"><div>异常点</div><div class="ml-0">'
-        for(let key in scatterData){
-          let tempStr = '<div class="flex"><div>'+key+':</div><div class="flex" style="max-width:30vw;flex-wrap: wrap;">'
-          let data = params.filter(_=>_.seriesName === key)
-          for(let param of params){
-            if(param.componentSubType === 'scatter') {
-              tempStr = tempStr + '<span class="ml-0" style="color: ' + param.color + '">' + param.value[1] + '</span>,'
+            let str = '<div style="max-height: 50vh;overflow-y: auto">'+params[0].axisValue +'<br/>'
+            let scatterStr = '<div class="flex"><div class="ml-0">'
+            for(let key in scatterData){
+              let tempStr = '<div class="flex"><div>'+key+'异常点:</div><div class="flex" style="max-width:30vw;flex-wrap: wrap;">'
+              let data = params.filter(_=>_.seriesName === key)
+              if(data.length>0){
+                for(let param of data){
+                  if(param.componentSubType === 'scatter') {
+                    tempStr = tempStr + '<span class="ml-0" style="color: ' + param.color + '">' + param.value[1] + '</span>,'
+                  }
+                }
+                tempStr = tempStr+ '</div></div>'
+                scatterStr = scatterStr+tempStr
+              }
             }
+            scatterStr = scatterStr+'</div></div>'
+            for(let param of params){
+              if(param.componentSubType === 'boxplot'){
+                str = str + '<div class="flex "><div>'+param.marker+'最小值：</div><div >'+param.value[1]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'上四分位数：</div><div>'+param.value[2]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'中位数：</div><div>'+param.value[3]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'下四分位数：</div><div>'+param.value[4]+'</div></div>'+
+                  '<div class="flex "><div>'+param.marker+'最大值：</div><div>'+param.value[5]+'</div></div>'
+              }
+            }
+            str = str + scatterStr+'</div>'
+            return str
           }
-          tempStr = tempStr + '</div></div>'
-          scatterStr = scatterStr+tempStr
-        }
-        scatterStr = scatterStr+'</div></div>'
-        for(let param of params){
-          if(param.componentSubType === 'boxplot'){
-            str = str + '<div class="flex justify-between"><div>'+param.marker+'最小值</div><div >'+param.value[1]+'</div></div>'+
-              '<div class="flex justify-between"><div>'+param.marker+'第一四分位数</div><div>'+param.value[2]+'</div></div>'+
-              '<div class="flex justify-between"><div>'+param.marker+'中位数</div><div>'+param.value[3]+'</div></div>'+
-              '<div class="flex justify-between"><div>'+param.marker+'第三四分位数</div><div>'+param.value[4]+'</div></div>'+
-              '<div class="flex justify-between"><div>'+param.marker+'最大值</div><div>'+param.value[5]+'</div></div>'
-          }
-        }
-        str = str + scatterStr+'</div>'
-        return str
-      }
+
+
+
       option.xAxis.data = xData
       option.series = series
       // option.series[0].data = boxplotData

cpp-ui/src/views/largeScreen/index.vue

@@ -568,10 +568,10 @@ export default {
           boxplotData: response.data.result,
           scatterData: response.data.abnormal,
           xData: response.data.time,
-          q1: response.data.q1,
-          q3: response.data.q3,
-          min: response.data.min,
-          max: response.data.max,
+          // q1: response.data.q1,
+          // q3: response.data.q3,
+          // min: response.data.min,
+          // max: response.data.max,
         }
       }).catch(err => {
       })