Servlet中的json数据传入highcharts中的data,形成动态的折线图
来源:互联网 发布:java安装包百度云 编辑:程序博客网 时间:2024/06/06 01:13
highcharts中的data是一个json数组:data:[4,1,12,4,3,3,1]
所以在servlet封装json为:
public class AdFromByMdaReportAction extends Action{ @Override public void Perform() throws Exception { // TODO Auto-generated method stub LinkedHashMap<String, LinkedList<String>> map=new LinkedHashMap<String, LinkedList<String>>(); LinkedList<String> list=new LinkedList<String>(); list.add("22");list.add("12");list.add("11");list.add("10");list.add("3"); map.put("show", list); LinkedList<String> list1=new LinkedList<String>(); list1.add("12");list1.add("32");list1.add("10");list1.add("8");list1.add("5"); map.put("IndependentAccess", list1); LinkedList<String> list2=new LinkedList<String>(); list2.add("32");list2.add("2");list2.add("10");list2.add("18");list2.add("15"); map.put("ip", list2); LinkedList<String> list3=new LinkedList<String>(); list3.add("12");list3.add("21");list3.add("30");list3.add("18");list3.add("25"); map.put("VisitTime", list3); JSONObject json=JSONObject.fromObject(map); System.out.println(map); PrintWriter out=response.getWriter(); out.print(json); out.close(); }}
然后在js中,使用ajax请求servlet,然后再生成折线图:
$.ajax({ type:'POST', url:'<%=request.getContextPath()%>/c?action=media.report.AdFromByMdaReportAction', data:'', dataType:'json', success:function(data){ console.log(data); showHIghcharts(data); } }); function showHIghcharts(data){ $('#zhexiantu').highcharts({ chart:{ }, title:{ text:'来源分析—广告(媒体)', x:-20 }, subtitle:{ text:'数据来源:afa', x:-20 }, xAxis:{ categories:['0:00','4:00','8:00','12:00','16:00','20:00','24:00'],//维度--时间 }, yAxis:{ title:{ text:'指标' }, plotLines:[{ value:0, width:1, color:'#eeeee' }] }, legend:{ layout:'vertical', align:'right', verticalAlign:'middle', borderWidth:0 }, series:[{ name:'浏览量(PV)', data:eval("[" + data.show + "]") }, { name:'独立访客(UV)', data:eval("[" + data.IndependentAccess + "]") }, { name:'IP', data:eval("[" + data.ip + "]") }, { name:'访问次数', data:eval("[" + data.VisitTime + "]") }, ] }) }
1 0
- Servlet中的json数据传入highcharts中的data,形成动态的折线图
- 如何将json数据传入到Highcharts中的data中
- 如何将json数据传入到Highcharts中的data中
- qt外部数据传入实现动态的折线图绘制
- qt外部数据传入实现动态的折线图绘制
- qt外部数据传入实现动态的折线图绘制
- qt外部数据传入实现动态的折线图绘制
- highcharts折线图动态数据展示
- HighCharts中的无主题的2D折线图
- HighCharts中的Ajax请求的2D折线图
- 前端 Highcharts图表,如何动态传入数据
- highcharts实现实时动态的折线面积图
- highcharts动态加载json数据
- Highcharts动态加载json数据
- HighCharts 折线图的实现
- 利用highcharts实现实时动态折线图
- php实现动态折线图,highcharts折线图
- highcharts spline传入数据
- (2)-IntelliJ IDEA搭建openfire4.1.3开发环境
- 原生js实现的ul li 二级联动
- 【Java每日一题】20170324
- Spring笔记(一)---myeclipse2014配置spring以及简单使用
- Exploring the Hidden Dimension in Graph Processing论文注释(待续。。)
- Servlet中的json数据传入highcharts中的data,形成动态的折线图
- 【算法】华为笔试_颠倒相加_掷骰子
- 平板/笔记本亮度调节工具halo(WINDOWS)
- Arrays 和 Collections 排序
- bzoj 3939: [Usaco2015 Feb]Cow Hopscotch (CDQ分治+DP)
- 王朝 在一个有序数列中插入一个数
- 微信公众平台开发-PHP版
- 利用反射动态代理
- 深入理解Java之jvm启动流程