• EL表达式向Echarts图传数据


    在使用统计图时,需要相统计图传数据,开始时我EL表达式取不到值,于是用了AJAX传值,做饼图时还好,但是做柱状图时发现需要传两个json数据,这时候便想到了用EL传另一个值,
    经过老师的指导,EL取值时是全局变量,并没有进入到Servlet中,于是在跳转页面时就调用Servlet方法,发现果然可以传到
    代码如下:

           public void statisticsPage(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            logger.info("enter statisticsPage method");
            statisticsMajorGrade(request, response);
            forward("WEB-INF/page/member/memberChart.jsp", request, response);
        }
    
         public void statisticsMajorGrade(HttpServletRequest request, HttpServletResponse response) throws IOException {
            // 所有的专业
            List<Major> majorList = majorService.searchListAll(null);
            // 所有的年级
            List<Member> allMember = memberService.searchListAll(null);
            // 获取全部年级
            List<String> gradeList = new ArrayList<>();
            HashSet<String> list = new HashSet<String>();
            // 通过HashSet获取可以去除重复
            for (Member m : allMember) {
                String grade = m.getGrade();
                list.add(grade);
            }
            // 迭代器遍历HashSet获取列表中的值
            Iterator<String> iterator = list.iterator();
            while (iterator.hasNext()) {
                gradeList.add(iterator.next());
            }
            logger.info("gradeList = " + gradeList);
            // 统计图头部的消息
            List<String> headList = new ArrayList<>();
            headList.add("major");
            for (String grade : gradeList) {
                headList.add(grade);
            }
            logger.info("headList = " + headList);
            List<List<String>> result = new ArrayList<>();
            for (Major major : majorList) {
                List<String> majorGradeData = new ArrayList<>();
                majorGradeData.add(major.getMajorName());
                for (String grade : gradeList) {
                    Map<String, Object> conditions = new HashMap<>();
                    conditions.put("grade", grade);
                    conditions.put("majorId", major.getMajorId());
                    int count = memberService.searchCount(conditions);
                    majorGradeData.add(count + "");
                }
                logger.info(majorGradeData);
                result.add(majorGradeData);
            }
            result.add(0, headList);
            logger.info("result = " + result);
    
            ObjectMapper objectMapper = new ObjectMapper();
            // 柱状图的个数和年级个数一一对应,需要加type:bar
            StringBuffer sbf = null;
            for (String grade : gradeList) {
                if (sbf == null) {
                    sbf = new StringBuffer("[{type : 'bar'}");
                } else {
                    sbf.append(",{type:'bar'}");
                }
            }
            if (sbf == null) {
                sbf = new StringBuffer("[]");
            } else {
                sbf.append("]");
            }
            logger.info("result = " + result);
            String json = objectMapper.writeValueAsString(result);
            response.getWriter().print(json);
            logger.info("bars = " +  sbf.toString());
            request.setAttribute("bars", sbf.toString());
            logger.info("json3 = " + json);
            logger.info(sbf);
        }

    页面:

     1  var bar2 = ${bars};
     2         jq.ajax({
     3             type: "post",
     4             async: true,            //异步请求(同步请求将会锁住浏览器,用户其他操作必须等待请求完成才可以执行)
     5             url: "/BaseServlet.do?servlet=MemberServlet&method=statisticsMajorGrade",    //请求发送到TestServlet处
     6             dataType: "json",        //返回数据形式为json
     7             success: function (result) {
     8                 console.log("3" + result);
     9                 console.log(result[1]);
    10                 console.log(result.length);
    11                 // json字符串转换成json对象
    12                 //请求成功时执行该函数内容,result即为服务器返回的json对象
    13                 if (result) {
    14                     console.log("进入");
    15                     for (var i = 0; i < result.length; i++) {
    16                         console.log(result[i]);
    17                         item.push(result[i]);
    18                     }
    19                     console.log("item = " + item);
    20                     majorChart.hideLoading();    //隐藏加载动画
    21                     showMajorGrade(item,bar2)
    22                 }
    23             }
    24         });
    页面
  • 相关阅读:
    setup slack检查
    关于derive_pll_clock
    STA中的postmap和postfit
    sdc中对I/O口的约束set_input/output_delay
    hold slack的计算
    DDR I 和DDR II的简单比较
    ORA00600: 内部错误代码,参数: [kcratr1_lostwrt], [], [], [], [], [], [], []
    linux解压超过2G大文件
    linux 安装apache2.2.4
    plsql developer导出csv乱码问题
  • 原文地址:https://www.cnblogs.com/cn9826/p/13665344.html
Copyright © 2020-2023  润新知