通过生日查询各年龄段数量通过饼状图显示-白红宇

通过生日查询各年龄段数量通过饼状图显示

阅读量：4653 次

发布时间：2019-06-09

本文共 2013 字，大约阅读时间需要 6 分钟。

数据库表t_member中 birthday 字段为date类型

需求:根据年龄段（可以指定几个年龄段，例如0-18、18-30、30-45、45以上）展示各个年龄段的占比，通过饼形图来展示(Echarts)

实现:最重要的就是sql语句:

Controller层,service,dao以及dao.xml中的方法都是:findMemberAgeCount  Controller层如下()其它层非常简单,省略)

@RequestMapping("/getMemberAgeReport") public Result getMemberAgeReport(){
      try {
          List
     
      > list = memberService.findMemberAgeCount();         Map
      
        map = new HashMap<>();         map.put("ageCount",list);         List
       
         memberAge = new ArrayList<>();         for (Map
        
          maplist : list) {
              String name = (String) maplist.get("name");             memberAge.add(name);         }         map.put("memberAge",memberAge);         return new Result(true,MessageConstant.GET_MEMBERAGE_COUNT_REPORT_SUCCESS,map);     }catch (Exception e){
          e.printStackTrace();         return new Result(false,MessageConstant.GET_MEMBERAGE_COUNT_REPORT_FAIL);     } }

注意细节:前端使用vue: 　　ajax请求:  axios.get("/report/getMemberAgeReport.do") 　　 　　封装是数据:通过分析得出需要封装成 List
     
      >

legend: {
      orient: 'vertical',     left: 'left',     data: res.data.data.memberAge }, series : [     {
          name: '会员年龄占比',         type: 'pie',         radius : '55%',         center: ['50%', '60%'],         data:res.data.data.ageCount,         itemStyle: {
              emphasis: {
                  shadowBlur: 10,                 shadowOffsetX: 0,                 shadowColor: 'rgba(0, 0, 0, 0.5)'             }         }

转载于:https://www.cnblogs.com/TanBeauty/p/11370226.html

你可能感兴趣的文章

ef linq 中判断实体中是否包含某集合

查看>>

章三链表

查看>>

Solution for Concurrent number of AOS' for this application exceeds the licensed number

查看>>

CSE 3100 Systems Programming

查看>>

IntelliJ IDEA 的Project structure说明

查看>>