js 统计数据的展示
首先要引入
<script src="js/highcharts/highcharts.js"></script>
<script src="js/highcharts/highcharts-3d.js"></script>
<script src="js/highcharts/highcharts-more.js"></script>
这里增加实现统计的代码:
dataValue是要显示的数值。
//按天统计(x轴月的天数)
function monthStatistics(dataValue){
var chart;
var datatime = $("#createTime").val();
var year = new Date(datatime).getFullYear();
var month = new Date(datatime).getMonth()+1;
//获取选择的当前日
var checkedDay = new Date(datatime).getDate();
//获取实时日期
var currentDay = new Date().getDate();
//根据年月获取天数
var days = new Date(year,month,0).getDate();
var showAllMonth = showMonth(datatime);//是否显示全月的天数
var showAllDay = showDay(datatime);//当月是否显示到选择框的日期天数
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'spline',
marginRight: 10
},
title: {
text: year+'-'+month+'当月每天统计量'
},
xAxis: {
//type: 'line'
title:{
text:'单位:天'
},
lineWidth:1,
min:1,
lineColor:"#C0D0E0",
allowDecimals:false
},
yAxis: {
title: {
text: '单位:次'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}],
min:0,
allowDecimals:false
},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +':'+ this.y;
}
},
legend: {
enabled: false
},
exporting: {
enabled: false
},
series: [{
name: 'PV',
data: (function() {
var data = [];
var len = dataValue.anchor.length;
if(len==0){
if(showAllMonth==1){
for(var i =days;i>0;i--){
data.push({
x: i,
y: 0
});
}
}else if(showAllMonth==2){
//选取的月份超出范围了,故不显示数据
}else{
for(var i =currentDay;i>0;i--){
data.push({
x: i,
y: 0
});
}
}
}else{
var startValue = dataValue.anchor[0];
var lastValue = dataValue.anchor[len-1];
if(showAllMonth==1){
for(var i = days;i>lastValue;i--){
data.push({
x: i,
y: 0
});
}
}else{
if(showAllDay==2){
for(var i = currentDay;i>lastValue;i--){
data.push({
x: i,
y: 0
});
}
}else{
for(var i = checkedDay;i>lastValue;i--){
data.push({
x: i,
y: 0
});
}
}
}
for (var i= len-1; i >=0; i--) {
data.push({
x: dataValue.anchor[i],
y: dataValue.value[i]
});
}
for(var i=startValue-1;i>0;i--){
data.push({
x: i,
y: 0
});
}
}
return data;
})()
}]
});
}