mybatis统计近30天，不同时间段的数据

当天数据

  SELECT
      count(*)
      FROM bs_parking_car_t AS parkingCar
      WHERE  parkingCar.car_status = 1 AND DATE(arrival_time) = CURDATE()

近30天数据

 <select id="carCountOfRecent30Day"
          resultType="com.rsi.rc.bs.module.gateRoadReport.vo.CarCountOfRecent30DayVO">
 SELECT 
			DATE_FORMAT(enter_time, '%c/%d') times,
			count(car_type) count
		FROM
			(SELECT *	FROM bs_road_gate_record_t WHERE DATE_SUB(CURDATE(), INTERVAL 30 DAY) <= date(enter_time)) AS times 
		GROUP BY times
  </select>

昨天24小时数据

    SELECT count(*) count,HOUR(enter_time)+1 time
    FROM
    bs_road_gate_record_t WHERE enter_time <= (select DATE_SUB(DATE_FORMAT(CURDATE(),'%Y-%m-%d %H'), INTERVAL 0 DAY))
    and enter_time>= ( SELECT DATE_FORMAT((SELECT DATE_ADD(CURDATE(),INTERVAL -1 DAY)),'%Y-%m-%d %H:00:00'))
    and car_type not in(0,2)
    GROUP BY DATE(enter_time) ,HOUR(enter_time)+1

不同时间段数据

  <select id="carCountOfTodayInDifferentTimeResp"
          resultType="com.rsi.rc.bs.module.gateRoadReport.vo.CarCountOfTodayInDifferentTimeVO">
    SELECT count(*) count,
    CASE WHEN TIME(enter_time)  <![CDATA[>=]]> '00:00:00' AND  TIME(enter_time)<![CDATA[<]]>'07:00:00' THEN 0
    WHEN TIME(enter_time) <![CDATA[>=]]> '07:00:00' AND  TIME(enter_time) <![CDATA[<]]>'09:00:00' THEN 1
    WHEN TIME(enter_time)  <![CDATA[>=]]> '09:00:00' AND  TIME(enter_time) <![CDATA[<]]>'15:30:00' THEN 2
    WHEN TIME(enter_time) <![CDATA[>=]]> '15:30:00' AND  TIME(enter_time) <![CDATA[<]]>'17:30:00' THEN 3
    WHEN TIME(enter_time)  <![CDATA[>=]]>'17:30:00' AND  TIME(enter_time) <![CDATA[<]]>'18:30:00' THEN 4
    WHEN TIME(enter_time) <![CDATA[>=]]> '18:30:00' AND  TIME(enter_time) <![CDATA[<=]]>'23:59:59' THEN 5
    END as idx
    from
    bs_road_gate_info_t gate
    LEFT JOIN `bs_road_gate_record_t` record
    ON record.gate_id = gate.gate_id
    where
    date_format(enter_time,'%Y-%m-%d')=DATE_FORMAT(now(),'%Y-%m-%d '),idx
  </select>

分组后各个时间段数据

  <select id="kindOfCarInDifferentTime"
          resultType="com.rsi.rc.bs.module.gateRoadReport.vo.CarCountOfGateInDifferentTimeVO">
    SELECT
    CASE WHEN car_type=0 THEN '外部车'
    WHEN car_type=1 THEN '预约车'
    WHEN car_type=2 THEN '内部车'
    WHEN car_type=3 THEN '危化品车'
    ELSE '其他'
    END AS gate,count(*) count,
    CASE WHEN TIME(enter_time)  <![CDATA[>=]]> '00:00:00' AND  TIME(enter_time)<![CDATA[<]]>'07:00:00' THEN 0
    WHEN TIME(enter_time) <![CDATA[>=]]> '07:00:00' AND  TIME(enter_time) <![CDATA[<]]>'09:00:00' THEN 1
    WHEN TIME(enter_time)  <![CDATA[>=]]> '09:00:00' AND  TIME(enter_time) <![CDATA[<]]>'15:30:00' THEN 2
    WHEN TIME(enter_time) <![CDATA[>=]]> '15:30:00' AND  TIME(enter_time) <![CDATA[<]]>'17:30:00' THEN 3
    WHEN TIME(enter_time)  <![CDATA[>=]]>'17:30:00' AND  TIME(enter_time) <![CDATA[<]]>'18:30:00' THEN 4
    WHEN TIME(enter_time) <![CDATA[>=]]> '18:30:00' AND  TIME(enter_time) <![CDATA[<=]]>'23:59:59' THEN 5
    END as idx
    from
    bs_road_gate_info_t gate
    LEFT JOIN `bs_road_gate_record_t` record
    ON record.gate_id = gate.gate_id
    where
    date_format(enter_time,'%Y-%m-%d')=DATE_FORMAT(#{date},'%Y-%m-%d ')
    <if test="type==1">
     AND  traffic_type =1
    </if>
    <if test="type==2">
      AND  traffic_type =2
    </if>
    <if test="type==3">
      AND  traffic_type in (1,2)
    </if>
    <if test="tenantId>0">
      AND tenant_id = #{tenantId,jdbcType = BIGINT}
    </if>

    GROUP BY DATE(enter_time),car_type,
    CASE WHEN TIME(enter_time)  <![CDATA[>=]]> '00:00:00' AND  TIME(enter_time)<![CDATA[<]]>'07:00:00' THEN 0
    WHEN TIME(enter_time) <![CDATA[>=]]> '07:00:00' AND  TIME(enter_time) <![CDATA[<]]>'09:00:00' THEN 1
    WHEN TIME(enter_time)  <![CDATA[>=]]> '09:00:00' AND  TIME(enter_time) <![CDATA[<]]>'15:30:00' THEN 2
    WHEN TIME(enter_time) <![CDATA[>=]]> '15:30:00' AND  TIME(enter_time) <![CDATA[<]]>'17:30:00' THEN 3
    WHEN TIME(enter_time)  <![CDATA[>=]]>'17:30:00' AND  TIME(enter_time) <![CDATA[<]]>'18:30:00' THEN 4
    WHEN TIME(enter_time) <![CDATA[>=]]> '18:30:00' AND  TIME(enter_time) <![CDATA[<=]]>'23:59:59' THEN 5
    END;
  </select>

数据处理

    @Override
    public CarCountOfGateInDifferentTimeResp kindOfCarInDifferentTime(CarCountOfGateInDifferentTimeReq req, SessionUserInfo sessionUserInfo) {
        //租户id
        long tenantId = 0;
        if (null != sessionUserInfo) {
            tenantId = Long.parseLong(sessionUserInfo.getTenantId());
        }
        req.setTenantId(tenantId);
        Map<String, List<Integer>> mapIn = new HashMap<>();
        Map<String, List<Integer>> mapOut = new HashMap<>();
        Map<String, List<Integer>> mapInAndOut = new HashMap<>();

        // carType 外部0  预约1  内部2 危化品3
        for (int i = 0; i < 4; i++) {
            String gate = "";
           if (i==0){
               gate = "外部车";
           }else if (i==1){
               gate = "预约车";
           }else if (i==2){
               gate = "内部车";
           }else {
               gate = "危化品车";
           }
            List<Integer> list = new ArrayList<>();
            for (int j = 0; j <= 5; j++) {
                list.add(0);
            }
            mapIn.put(gate, list);
            mapOut.put(gate, list);
            mapInAndOut.put(gate, list);
        }
        req.setType(1);
        List<CarCountOfGateInDifferentTimeVO> listIn= roadGateRecordMapper.kindOfCarInDifferentTime(req.getType(),tenantId,req.getDate());
        for (CarCountOfGateInDifferentTimeVO vo : listIn) {
            String gate = vo.getGate();
            if (null!=mapIn.get(gate)) mapIn.get(gate).set(vo.getIdx(), vo.getCount());
        }
        req.setType(2);
        List<CarCountOfGateInDifferentTimeVO> listOut= roadGateRecordMapper.kindOfCarInDifferentTime(req.getType(),tenantId,req.getDate());
        for (CarCountOfGateInDifferentTimeVO vo : listOut) {
            String gate = vo.getGate();
            if (null!=mapOut.get(gate)) mapOut.get(gate).set(vo.getIdx(), vo.getCount());
        }
        req.setType(3);
        List<CarCountOfGateInDifferentTimeVO> listInAndOut= roadGateRecordMapper.kindOfCarInDifferentTime(req.getType(),tenantId,req.getDate());
        for (CarCountOfGateInDifferentTimeVO vo : listInAndOut) {
            String gate = vo.getGate();
            if (null!=mapInAndOut.get(gate)) mapInAndOut.get(gate).set(vo.getIdx(), vo.getCount());
        }

        return new CarCountOfGateInDifferentTimeResp(mapIn,mapOut,mapInAndOut);
    }

    @Override
    public CarCountOfRecent30DayResp carCountOfRecent30Day(CarCountOfRecent30DayReq req, SessionUserInfo sessionUserInfo) {
        //租户id
        long tenantId = 0;
        if (null != sessionUserInfo) {
            tenantId = Long.parseLong(sessionUserInfo.getTenantId());
        }
        req.setTenantId(tenantId);
        List<CarCountOfRecent30DayVO> list= roadGateRecordMapper.carCountOfRecent30Day(req);
        List<String> gateList = new ArrayList<>();
        List<Integer> countList = new ArrayList<>();
        for (int i = 0; i < list.size(); i++) {
            CarCountOfRecent30DayVO vo = list.get(i);
            gateList.add(vo.getDate());
            countList.add(vo.getCount());
        }
        return new CarCountOfRecent30DayResp(gateList,countList);
    }

    @Override
    public CarCountOfTodayInDifferentTimeResp carCountOfTodayInDifferentTime(CarCountOfTodayInDifferentTimeReq req, SessionUserInfo sessionUserInfo) {
        //租户id
        long tenantId = 0;
        if (null != sessionUserInfo) {
            tenantId = Long.parseLong(sessionUserInfo.getTenantId());
        }
        int[] list = new int[6];
        List<CarCountOfTodayInDifferentTimeVO> listInAndOut= roadGateRecordMapper.carCountOfTodayInDifferentTimeResp();
        for (CarCountOfTodayInDifferentTimeVO vo : listInAndOut) {
            list[vo.getIdx()] = vo.getCount();
        }

        return new CarCountOfTodayInDifferentTimeResp(list);
    }

echarts

carType1(){
    var that = this;
    let ctelement = this.container.nativeElement;
    var series = [];
    var count = 0;

    for (var key in that.map2In) {
      var line =
        {
          name: key,
          type: 'bar',
          barGap: 0,
          barWidth : 10,
          stack: 'Total',
          data: that.map2In[key],
          itemStyle: {normal: {color: that.colorList[count]}}
        }
      if (count<this.colorList.length-1) {count++;}
      else {count=0;}
      series.push(line);
    }
    this.EChart = echarts.init(document.getElementById('carType1'));
    this.EChart.clear();
    this.EChart.resize();
    this.EChart.setOption({
      title: {
        text: '车/次',
        // subtext: '车/次',
        x:'6%',
        y: '15%',
        textStyle: {
          fontSize: 14,
          fontStyle: 'normal',
          fontWeight: 'normal',
        },
      },
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'shadow'
        }
      },
      legend: {
        show: true,
        itemHeight: 12,
        itemWidth: 12,
        x:'right',
        y: '5%',
        textStyle:{
          color:"#5c5c5c",
          fontSize: 14
        }
      },
      grid: {
        left: '3%',
        right: '5%',
        bottom: '5%',
        top: '32%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        boundaryGap: true,
        data:  ['0:00-7:00', '7:00-9:00', '9:00-15:30', '15:30-17:30', '17:30-18:30','18:30-24'],
        splitLine: { show: false }, //去除网格线
        axisLine: {
          show: true,
          lineStyle: {
            color: "#5c5c5c",
            fontSize: 10
          }
        },
        axisTick: {
          //y轴刻度线
          show: false
        },
      },
      yAxis: {
        type: 'value',
        boundaryGap: [0, 0.01],
        splitLine: { show: false }, //去除网格线
        axisLine: {
          show: true,
          lineStyle: {
            color: "#5c5c5c",
            fontSize: 10
          }
        },
        axisTick: {
          //y轴刻度线
          show: false
        },
      },
      series:series
      // series: [
      //   {
      //     name: '内部车',
      //     type: 'bar',
      //     barGap: 0,
      //     barWidth : 10,
      //     stack: 'Total',
      //     data: [140, 232, 101, 264, 90],
      //     itemStyle: {normal: {color: "#91cd74",}},
      //   },
      //   {
      //     name: '预约车',
      //     type: 'bar',
      //     barGap: 0,
      //     barWidth : 10,
      //     stack: 'Total',
      //     data: [120, 282, 111, 234, 220],
      //     itemStyle: {normal: {color: "#ef6667",}},
      //   },
      //   {
      //     name: '危化品车',
      //     type: 'bar',
      //     barGap: 0,
      //     barWidth : 10,
      //     stack: 'Total',
      //     data: [320, 132, 201, 334, 190],
      //     itemStyle: {normal: {color: "#fcb435",}},
      //   },
      //   {
      //     name: '外部车',
      //     type: 'bar',
      //     barGap: 0,
      //     barWidth : 10,
      //     stack: 'Total',
      //     data: [320, 132, 201, 334, 190],
      //     itemStyle: {normal: {color: "#546FC6",}},
      //   }
      // ]
    })
  }

  peopletrafficRankingEchart1(){
    var thiss = this;

    let myChart = null;
    this.ngZone.runOutsideAngular(() => {
      let elementById = document.getElementById("peopleTrafficRanking1");
      if(elementById){
        myChart = echarts.init(elementById);
        let option = {

          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            }
          },
          legend: {
            show: false,
            textStyle:{
              color:"#333",
              fontSize: 13
            }
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '-6%',
            top: '8%',
            containLabel: true
          },
          xAxis: {
            show: false,
            type: 'value',
            boundaryGap: [0, 0.01],
            splitLine: { show: false }, //去除网格线
            axisLine: {
              show: false,
              lineStyle: {
                color: "#333",
                fontSize: 13
              }
            },
            axisTick: {
              //y轴刻度线
              show: false
            },

          },
          yAxis: {
            type: 'category',
            data: thiss.carRecordOfTodayTimeArr,
            splitLine: { show: false }, //去除网格线
            axisLine: {
              show: false,
              lineStyle: {
                color: '#bebebe',
                fontSize: 13
              }
            },
            axisTick: {
              //y轴刻度线
              show: false
            },
          },
          series: [
            {
              name: '数量',
              type: 'bar',
              data: thiss.carRecordOfTodayCountArr,
              barWidth : 10,
              itemStyle: {
                normal: {
                  //颜色设置
                  color: function(params) {
                    // 渐变色 设置
                    var color1=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#e30430" // 0% 处的颜色
                    },{
                      offset: 1,
                      color: "#f6c6a2" // 100% 处的颜色
                    }], false)
                    var color2=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#d16922" // 0% 处的颜色
                    }, {
                      offset: 1,
                      color: "#fcc09c" // 100% 处的颜色
                    }], false)
                    var color3=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#77bc00" // 0% 处的颜色
                    },{
                      offset: 1,
                      color: "#dbc782" // 100% 处的颜色
                    }], false)
                    var color4=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#1dc4bc" // 0% 处的颜色
                    }, {
                      offset: 1,
                      color: "#f5f7f2" // 100% 处的颜色
                    }], false)
                    var color5=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#1210cd" // 0% 处的颜色
                    },{
                      offset: 1,
                      color: "#e1ebf5" // 100% 处的颜色
                    }], false)
                    var color6=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#ffd835" // 0% 处的颜色
                    }, {
                      offset: 1,
                      color: "#fcf6da" // 100% 处的颜色
                    }], false)
                    var color7=new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
                      offset: 0,
                      color: "#772ace" // 0% 处的颜色
                    },{
                      offset: 1,
                      color: "#dec7fc" // 100% 处的颜色
                    }], false)

                    var colorList = [
                      color7,color6,color5,color4,color3,color2,color1
                    ];
                    return colorList[params.dataIndex]
                  },
                  //这里设置柱形图圆角 [左上角，右上角，右下角，左下角]
                  barBorderRadius:[10, 10, 10, 10],
                  label: {
                    show: true, //开启显示
                    position: 'right', //在上方显示
                    textStyle: { //数值样式
                      color: '#333',
                      fontSize: 13
                    }
                  }
                }
              }
            }
          ],
          animation:true,
          animationEasing: 'elasticOut',
          animationDuration: this.echarsLoadSecond
        };
        // 绘制图表
        myChart.clear(); //清楚之前echarts 缓存 重新画折线图
        setTimeout(function () {
          myChart.setOption(option,{lazyUpdate: true});
        },300)
        myChart.resize();
        window.addEventListener("resize", function () {
          myChart.resize();//下面可以接多个图
        });
      }else {
        return
      }
    });

  }

lastMonthChart(){
    var that = this;

    let myChart = null;
    this.ngZone.runOutsideAngular(() => {
      let elementById = document.getElementById("lastMonthChart");
      if(elementById){
        myChart = echarts.init(elementById);
        let option = {

          tooltip: {
            trigger: 'axis',
            axisPointer: {
              type: 'shadow'
            }
          },
          legend: {
            show: false,
            itemHeight: 12,
            itemWidth: 12,
            x: 'center',
            y: '5%',
            textStyle:{
              color:"#5c5c5c",
              fontSize: 14
            }
          },
          grid: {
            left: '3%',
            right: '3%',
            bottom: '5%',
            top: '25%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            // data: ['4.1', '4.2', '4.3', '4.4', '4.5', '4.6', '4.7', '4.8', '4.9', '4.10',
            //   '4.11', '4.12', '4.13', '4.14', '4.15', '4.16', '4.17', '4.18', '4.19', '4.20',
            //   '4.21', '4.22', '4.23', '4.24', '4.25', '4.26', '4.27', '4.28', '4.29', '4.30'],
            data:that.carDateArr,
            splitLine: { show: false }, //去除网格线
            axisLine: {
              show: true,
              lineStyle: {
                color: '#bebebe',
                fontSize: 12
              }
            },
            axisTick: {
              //y轴刻度线
              show: false
            },
          },
          yAxis: {
            type: 'value',
            boundaryGap: [0, 0.01],
            splitLine: { show: false }, //去除网格线
            axisLine: {
              show: true,
              lineStyle: {
                color: '#bebebe',
                fontSize: 12
              }
            },
            axisTick: {
              //y轴刻度线
              show: false
            },
          },
          series: [
            {
              name: '车流量',
              type: 'bar',
              stack: 'Total1',
              // 展示曲线上的点
              showSymbol: false,
              // 让曲线更加圆滑
              smooth: false,
              // data: [320, 132, 201, 324, 190, 130, 220,
              //   220, 132, 201, 234, 190, 130, 220,
              //   310, 132, 201, 334, 190, 130, 220,
              //   300, 132, 201, 314, 190, 130, 220,
              //   120, 132],
              data:that.carCountArr,
              itemStyle: {normal: {color: function (param) {
                    var color=new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                      offset: 0,
                      color: "#2578F7" // 0% 处的颜色
                    },{
                      offset: 1,
                      // color: "#e1ebf5" // 100% 处的颜色
                      color: "#5EC8B4" // 100% 处的颜色
                    }], false)
                    return color;
                  },
                }},
              // areaStyle: {
              //   color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
              //     {
              //       offset: 0,
              //       color: '#2c8cef'
              //     },
              //     {
              //       offset: 1,
              //       color: 'rgba(44, 140, 239, 0.3)'
              //     }
              //   ])
              // }
            }
          ],
          animation:true,
          animationEasing: 'elasticOut',
          animationDuration: this.echarsLoadSecond
        };
        // 绘制图表
        myChart.clear(); //清楚之前echarts 缓存 重新画折线图
        setTimeout(function () {
          myChart.setOption(option,{lazyUpdate: true});
        },300)
        myChart.resize();
        window.addEventListener("resize", function () {
          myChart.resize();//下面可以接多个图
        });
      }else {
        return
      }
    });
  }