highcharts柱状图的高度跟柱状图上方显示的数字、提示框没关系
1、柱状图的高度跟柱状图上方显示的数字、提示框没关系(因为后台传过来的数据间隔太小)
var _xaxis = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12',
'13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24'], // X轴坐标
_data = [//柱状图高度
14, 18, 23, 30,
38, 46, 54, 59,
64, 69, 74, 79,
84, 92, 99, 107,
111, 118, 125, 132,
140, 146, 154, 160
],
_newdata = [ // 易月增显示数据
10.3, 10.6, 10.9, 11.2,
11.5, 11.8, 12.1, 12.2,
12.3, 12.4, 12.5, 12.6,
12.7, 12.8, 12.9, 13,
13.1, 13.2, 13.3, 13.4,
13.5, 13.6, 13.7, 13.8
],
_series_data = new Array(),
_series_newdata = new Array();
$.each(_data,
function (i, d) {
_series_data.push({ color: '#f9e4be', y: d, stack: i });
});
$.each(_newdata,
function (i, d) {
_series_newdata.push({ color: '#f9e4be', y: d, stack: i });
})
var _options = {
chart: {
type: 'column',
backgroundColor: 'none',
renderTo: 'columnargz',
height: 240,
width: 1100
},
credits: {
enabled: false
},
title: {
text: '',
floating: true,
style: {
color: '#fff',
fontFamily: 'Microsoft yahei'
},
y: 220
},
subtitle: {
text: ''
},
legend: {
enabled: false
},
xAxis: {
categories: _xaxis,
gridLineWidth: 1,
gridLineWidth: 0,
tickWidth: 0,
labels: {
style: {
fontSize: '14px',
color: '#999'
},
y: 20
},
title: {
text: '(月)',
align: 'high',
y: -27,
x: 11,
style: {
fontSize: '14px',
color: '#999'
}
}
},
yAxis: {
min: 0,
title: {
text: ''
},
tickWidth: 0,
labels: {
enabled: false
},
gridLineWidth: 0
},
tooltip: {
formatter: function () {
//提示信息格式化
return this.x + '个月 <br/>利率:' + _series_newdata[this.point.stack].y + '%';
}
},
plotOptions: {
series: {
pointPadding: 0,
groupPadding: 0,
shadow: false,
dataLabels: {
enabled: true,
color: '#4f4f4f',
style: {
fontWeight:'normal',
fontSize: '12px',
"textShadow": 'none'
},
formatter: function () {
return _series_newdata[this.point.x].y + "%";
}
},
point: {
events: {
mouseOver: function () {
var _stack = this.stack;
var _new_data = new Array();
$.each(_series_data,
function (i, d) {
if (_stack >= i)
_new_data.push({ color: '#ff9000', y: d.y, stack: d.stack });
else
_new_data.push({ color: '#f9e4be', y: d.y, stack: d.stack });
})
_chart.series[0].setData(_new_data);
},
mouseOut: function () {
}
}
}
},
column: {
borderColor: '#ccc',
borderWidth: 0
}
},
series: [
{
name: '利率',
data: _series_data
}
]
};
var _chart = new Highcharts.Chart(_options);