<script type="text/javascript">
$().ready(function() {
var myChart = echarts.init(document.getElementById('main'));
//图表显示提示信息
myChart.showLoading();
//定义图表options
option = {
tooltip : {
trigger : 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
legend : {
data : []
},
grid : {
left : '3%',
right : '4%',
bottom : '3%',
containLabel : true
},
xAxis : {
type : 'value'
},
yAxis : {
type : 'category',
data : []
},
series : []
};
//通过Ajax获取数据
$.ajax({
type : "post",
async : false, //同步执行
url : "showEchartFoldBar.action",
dataType : "json", //返回数据形式为json
success : function(result) {
if (result) {
//将返回的category和series对象赋值给options对象内的category和series
//因为xAxis是一个数组 这里需要是xAxis[i]的形式
option.legend.data = result.legend;
option.yAxis.data = result.category;
var serisdata = result.series[0].data;
var datas = [];
for ( var i = 0; i < serisdata.length; i++) {
datas.push({
name : serisdata[i].name,
type : serisdata[i].type,
stack : serisdata[i].stack,
label : {
normal : {
show : true,
position : 'insideRight'
}
},
data : serisdata[i].data,
});
}
option.series = datas;
myChart.hideLoading();
myChart.setOption(option);
}
},
error : function(errorMsg) {
alert("图表请求数据失败啦!");
}
}); });
</script>
@RequestMapping("/showEchartFoldBar")
@ResponseBody
public EchartData FoldBarData() {
List<String> legend = new ArrayList<String>();
List<Visit> vis1 = visitBiz.findByCondition(new Visit(null, "星期一", null, null));
for (Visit visit : vis1) {
legend.add(visit.getName());
} List<String> category = new ArrayList<String>();
List<Visit> vis2 = visitBiz.findByCondition(new Visit(null,null, null,"邮件营销"));
for (Visit visit : vis2) {
category.add(visit.getWeek());
} List<Map> serisData=new ArrayList<Map>();
List<String> name = visitBiz.selectName();
for (String str : name) {
Map map =new HashMap();
map.put("name",str);
List<Visit> lis = visitBiz.findByCondition(new Visit(null, null, null, str));
List<Long> data=new ArrayList<Long>();
for (Visit visit : lis) {
data.add(visit.getCount());
}
map.put("data", data);
map.put("type", "bar");
map.put("stack", "总量");
serisData.add(map);
} List<Series> series = new ArrayList<Series>();// 纵坐标
series.add(new Series(null,null,serisData));
EchartData data = new EchartData(legend,category, series);
return data;
}
public class Visit {
private Integer id; private String week; private Long count; private String name;

基于SpringMVC框架使用ECharts3.0实现堆叠条形图的绘制(下篇)的更多相关文章

  1. 基于SpringMVC框架使用ECharts3.0实现折线图,柱状图,饼状图,的绘制(上篇)

    页面部分 <%@ page language="java" pageEncoding="UTF-8"%> <!DOCTYPE html> ...

  2. 【PHP】基于ThinkPHP框架搭建OAuth2.0服务

    [PHP]基于ThinkPHP框架搭建OAuth2.0服务 http://leyteris.iteye.com/blog/1483403

  3. JAVA WEB快速入门之从编写一个基于SpringMVC框架的网站了解Maven、SpringMVC、SpringJDBC

    接上篇<JAVA WEB快速入门之通过一个简单的Spring项目了解Spring的核心(AOP.IOC)>,了解了Spring的核心(AOP.IOC)后,我们再来学习与实践Maven.Sp ...

  4. 基于SpringMVC框架项目Demo

    Git地址:https://github.com/JavaWeb1024/SpringMVC 1.     框架简介: 为打造一套集群高可用的框架,集成的技术目前比较成熟,稳定.相关的知识点在网络上也 ...

  5. SpringMVC快速使用——基于XML配置和Servlet3.0

    SpringMVC快速使用--基于XML配置和Servlet3.0 1.官方文档 https://docs.spring.io/spring-framework/docs/5.2.8.RELEASE/ ...

  6. SpringMVC框架搭建 基于注解

    本文将以一个很简单的案例实现 Springmvc框架的基于注解搭建,一下全为个人总结 ,如有错请大家指教!!!!!!!!! 第一步:创建一个动态web工程(在创建时 记得选上自动生成 web.xml ...

  7. 基于SpringMVC下的Rest服务框架搭建【1、集成Swagger】

    基于SpringMVC下的Rest服务框架搭建[1.集成Swagger] 1.需求背景 SpringMVC本身就可以开发出基于rest风格的服务,通过简单的配置,即可快速开发出一个可供客户端调用的re ...

  8. 基于SpringMVC+Ext.js的权限管理系统(无权限框架)

    代码地址如下:http://www.demodashi.com/demo/12811.html 0.准备工作 注意!!! 本案例数据库相关请下载例子包,内有数据库脚本.EXCEL数据表和详细的设计文档 ...

  9. 基于maven从头搭建springMVC框架

    0.准备工作 首先将eclipse和需要的插件准备好,例如maven插件,spring IDE插件. 1.建立maven下的webapp项目 1.新建一个maven项目,类型为webapp,如下图 2 ...

随机推荐

  1. 【ORACLE】调整序列的当前种子值

    [ORACLE]调整序列的当前种子值 --必须用SYS用户执行脚本:或具有SYSDBA角色登录: CREATE OR replace ); v_step ):;--步进 tsql ); BEGIN E ...

  2. VisionPro工业视觉的标定方法

    工业视觉常用的几种标定方式. 计算像素比 有些时候我们需要的检测数据并不需要特别准确,并且手边没有其它标定工具,可以使用这种方法大概算一算每个像素对应多大距离. 找一个知道距离的物体,测出它的像素距离 ...

  3. 【13】javascript跨域通信

    javascript跨域通信 同源:两个文档同源需满足 协议相同 域名相同 端口相同 跨域通信方法: 01,通过设置img,script,link,iframe元素的src,href属性为目标url. ...

  4. x86保护模式 实模式与保护模式切换实例

    x86保护模式     实模式与保护模式切换实例 实例一 逻辑功能   以十六进制数的形式显示从内存地址110000h开始的256个字节的值    实现步骤: 1  切换保护方式的准备 2. 切换到保 ...

  5. 两周多学完Java 23种设计模式

       最近两周任务不是很繁重,对于一个刚入职4个月的菜鸟来说,学习设计模式并灵活使用简直天方夜谭:但是当我询问我导师需要学点啥的时候?“<Java设计模式>,这个必须要学”,一句简单粗略的 ...

  6. 刷题总结——小凸玩矩阵(scoi)

    题目: 题目背景 SCOI2015 DAY1 T1 题目描述 小凸和小方是好朋友,小方给了小凸一个 n×m(n≤m)的矩阵 A,并且要求小凸从矩阵中选出 n 个数,其中任意两个数都不能在同一行或者同一 ...

  7. 解决安卓SDK更新dl-ssl.google.com无法连接的方法

    Q:解决安卓SDK更新dl-ssl.google.com无法连接的方法: A1.修改C:\windows\system32\dirvers\etc\hosts文件,将其复制到其他地方修改后替换回原来的 ...

  8. K大数查询 BZOJ 3110

    K大数查询 [问题描述] 有N个位置,M个操作.操作有两种,每次操作如果是1 a b c的形式表示在第a个位置到第b个位置,每个位置加入一个数c如果是2 a b c形式,表示询问从第a个位置到第b个位 ...

  9. Scrapy学习-4-Items类&Pipelines类

    items类使用 作用 能使得我们非常方便的操作字段名 在items.py中定制我们的类 class ArticleItem(scrapy.Item): title = scrapy.Field() ...

  10. Linux主机被SSH精神病(Psychos)暴力攻破后成为肉鸡的攻防过程

    近日公司局域网突然变得非常慢,上网受到很大影响,不仅仅是访问互联网慢,就连访问公司内部服务器都感到异常缓慢.于是对本局域网网关进行测试:   $ ping 10.10.26.254   发现延时很大, ...