||
在java后台拼接成如下的格式 :(列出的都是关键代码,用到的highcharts组件可以从官网下载)
String month="[{datestr:'一月份,二月份,三月份,四月份,五月份,六月份,七月份,八月份,九月份,十月份,十一月份,十二月份'}]";
String ja = "["+month;
String name="[{name:'杭州',data:[7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]}," +
"{name:'江西',data:[4.0, 2.9, 5.5, 24.5, 18.4, 11.5, 35.2, 36.5, 23.3, 38.3, 23.9, 3.6]}," +
"{name:'北京',data:[14.0, 12.9, 15.5, 14.5, 28.4, 21.5, 15.2, 16.5, 13.3, 28.3, 13.9, 13.6]},"+
"{name:'湖南',data:[3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]}]]"
;
String str = ja+","+name;
System.out.println(str);
try {
response().setCharacterEncoding("UTF-8");
response().setContentType("text/plain");
response().getWriter().print(str);
// response().getWriter().print();
} catch (IOException e) {
e.printStackTrace();
}
jsp页面上:
$(document).ready(function(){
xAxis: {//X轴数据
categories: [],
labels: {
rotation: -45, //字体倾斜
align: 'right',
style: { font: 'normal 13px 宋体' }
}
},
yAxis: {//Y轴显示文字
title: {
text: '产量/百万'
}
},
series:[]
};
$.ajax({
url: "bf_transe.box",
type: "post",
dataType: "json",
success: function(result,status){
var results= eval(result);
var xs=results[0];
var ys=results[1];
var xdata = [];
var str = xs[0]['datestr'];
xdata = str.split(",");
$.each(xdata,function(m){
xdata.push(xdata[m]); //动态取值
});
options.series=ys; //serires赋值
options.xAxis.categories = xdata; //push完之后赋值
chart = new Highcharts.Chart(options);
}
});
});