mysql实现今年十二个月数据统计和当前一个星期数据统计

首先引入JS

SQl

统计每年每个月的数据

 @Select("Select year(time) as Myear,Month(time) as Mtime, count(id) as Msize  FROM submit_info Group by Year(time),Month(time)")

获取每个星期的七天日期
SELECT DATE(subdate(curdate(),date_format(curdate(),‘%w’)-1)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 1 day)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 2 day)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 3 day)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 4 day)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 5 day)) as thisweek
union all
SELECT DATE(DATE_ADD(subdate(curdate(),date_format(curdate(),‘%w’)-1), interval 6 day)) as thisweek

当前星期7天时间获取到了就弄个子查询 in一下然后根据你需要的数据查询就行
然后建立一个实体类对应图表所需要的字段就行到时候返回给前端一个data就OK

实体类

public class Year {
private  Integer Mtime;

    public Integer getMyear() {
        return Myear;
    }
  
    public void setMyear(Integer myear) {
        Myear = myear;
    }

    private  Integer Myear;

    public Integer getMtime() {
        return Mtime;
    }

    public void setMtime(Integer mtime) {
        Mtime = mtime;
    }

    public Integer getMsize() {
        return Msize;
    }

    public void setMsize(Integer msize) {
        Msize = msize;
    }

    private  Integer Msize;
}

controller

@RequestMapping("/EasList")
    public String EasList() {
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy");
        Date date = new Date();
        //查询数据库每年每个月的数据
        List<Year> list = submitInfoService.EasList();
        Eas eas = new Eas();
        Map map = new HashMap();
        for (Year y : list
        ) {     //判断是不是今天的信息，是的话就将今天的每个月的数据查出来存进map
            if (y.getMyear() ==Integer.parseInt(sdf.format(date)))
                map.put(y.getMtime(), y.getMsize());

        }
        List<Integer> l = new ArrayList();
         //循环12次 代表12个月
        for (int i = 1; i <= 12; i++) {
            //判断每个月有没有数据
            if (map.get(i) != null && map.get(i) != "") {
                //有的话就把数据添加进去
                l.add(Integer.parseInt(map.get(i).toString()));
            } else {
                //没有就有默认给个0
                l.add(0);
            }
        }
        eas.setData(l);
        //Eas图表规定必要的一些参数 具体可以看官方文档
        eas.setName("社区回来人数");
        eas.setStack("总量");
        eas.setType("line");
        return JSON.toJSONString(eas);

    }

前端

   <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
<div id="main1" style="width: 100%;height:400px;"></div>

<script src="../js/echarts.min.js"></script>

<!--<script src="../js/echarts.min.js"></script>-->
<script type="text/javascript">
    $.getJSON('/EasList',{},function (data) {
        console.log(data)
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main1'));

        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '本年每月社区回来人数统计'
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:['社区回来人数']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
            },
            yAxis: {
                type: 'value'
            },
            series: data
        };


        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    })
</script>

效果