利用highStock生成报表(SpringMVC整合)

本文详细介绍了如何在JSP页面中引用jQuery和HighCharts库,通过代理接口获取JSON数据,并展示图表。重点讲解了时间转换、JSON数据结构、数据库时间解析以及数据展示的关键步骤。

1:JSP页面引用所  jquery-1.8.2.min.js   highCharts/highstock.js   highCharts/modules/exporting.js

前往highStock Demo网站选取自己想要的demo  http://www.hcharts.cn/demo/highstock.php,各种定制化的参数可以在API中找到http://www.hcharts.cn/api/highstock.php



前台的关键点在于接受的参数,demo中使用  $.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {获取参数,我们可以将路径地址转换成任意合法的URL地址,包括http协议,file协议地址或者是自己的action路径。

接受的JSON的格式为:[[1439740800000,4],[1439827200000,4],[1439913600000,331],[1440000000000,11]]

其中1439740800000为13位毫米时间,所以,数据库中时间需要经过解析转换为13位时间。



2:后台处理。

i)时间转换(yyyyMMdd为数据库时间的格式)

DateFormat df = new SimpleDateFormat("yyyyMMdd");

Date time = null;

time=df.parse((String)map.get("date"));
Calendar cal =Calendar.getInstance(TimeZone.getDefault());
cal.setTime(time);

ii)JSON返回,controller上记得加上ResponseBody注解,JSON拼装可以用List<List<LONG>>循环写入,然后找个合适的JSON工具类转换为字符串,然后return JSON字符串。


iii)service和mapper根据需求自己实现


附图:实现后的效果




评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值