echarts柱状图，动态统计

最新推荐文章于 2024-06-05 17:44:51 发布

懒惰的猿

最新推荐文章于 2024-06-05 17:44:51 发布

阅读量2.3k

点赞数

分类专栏：前端知识文章标签：前端echarts学习记录

本文链接：https://blog.csdn.net/qq_36562320/article/details/89918206

版权

echarts柱状图，动态统计

前言

最近在做一个统计短信发送的功能，前端用到echarts的柱状图，发篇文记录学习一下。

前端需要引用的文件

我在项目中引入了echarts.js和jquery.min.js两个js文件，以及一个样式文件oaui.css，样式文件主要是用来控制下拉选择框以及按钮的样式。

先看效果图

在这里插入图片描述

前端jsp代码

<%@ page import="com.xjj.oa2015.common.utils.StringUtils" %>
<%@ page import="java.util.Calendar" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="/js/echarts.js"></script>
    <script src="/jquery/1.9.1/jquery.min.js"></script>
    <link href="/css/oaui.css" rel="stylesheet">
    <style>
        html, body{
   
            height: 98%;
            background-color: white;
        }
    </style>
    <%
        Calendar cale = Calendar.getInstance();
        int year = cale.get(Calendar.YEAR);
        int mh = cale.get(Calendar.MONTH) + 1;
        String isYearView = request.getParameter("isYearView");
        String y = request.getParameter("year");
        if(StringUtils.isEmpty(y)){
   
            y=String.valueOf(year);
        }
        String m = request.getParameter("month");
        if(StringUtils.isEmpty(m)){
   
            m=String.valueOf(mh);
        }
    %>
</head>
<body>
<div <%if ("1".equals(isYearView)) {
   %>style="display: inline-block;margin-left: 6px"<%}else{
   %>style="display:none"<%}%>>
    年份选择：
    <select name="selectYear" id="selectYear" onchange="changYear()">
        <option value="<%=year%>" <%if(String.valueOf(year).equals(y)){
   %>selected<%}%> ><%=year%>年
        </option>
        <option value="<%=year-1%>" <%if(String.valueOf(year-1).equals(y)){
   %>selected<%}%> ><%=year - 1%>年
        </option>
        <option value="<%=year-2%>" <%if(String.valueOf(year-2).equals(y)){
   %>selected<%}%> ><%=year - 2%>年
        </option>
        <option value="<%=year-3%>" <%if(String.valueOf(year-3).equals(y)){
   %>selected<%}%> ><%=year - 3%>年
        </option>
        <option value="<%=year-4%>" <%if(String.valueOf(year-4).equals(y)){
   %>selected<%}%> ><%=year - 4%>年
        </option>

    </select>
</div>
<div  <%if (!"1".equals(isYearView)) {
   %>style="display: inline-block;margin-left: 6px"<%}else{
   %>style="display:none"<%}%>>
    月份选择：
    <select name="selectMonth" id="selectMonth" onchange="changMonth()">
        <option value="01" <%if(1==mh){
   %>selected<%}%> >一月份</option>
        <option value="02" <%if(2==mh){
   %>selected<%}%> >二月份</option>
        <option value="03" <%if(3==mh){
   %>selected<%}%> >三月份</option>
        <option value="04" <%if(4==mh){
   %>selected<%}%> >四月份</option>
        <option value="05" <%if(5==mh){
   %>selected<%}%>

最低0.47元/天解锁文章

懒惰的猿

关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
echarts柱状图，动态统计

echarts柱状图，动态统计前言最近在做一个统计短信发送的功能，前端用到echarts的柱状图，发篇文记录学习一下。前端需要引用的文件我在项目中引入了echarts.js和jquery.min.js两个js文件，以及一个样式文件oaui.css，样式文件主要是用来控制下拉选择框以及按钮的样式。先看效果图前端jsp代码<%@ page import="com.xjj.oa2...
复制链接

扫一扫