尝试增加条形高度以适应栏内的系列名称并尝试减少系列组之间的默认差距。 “series:[]”部分是,我假设要填充JSON返回函数。尝试了所有慷慨的JSFiddle例子中的许多例子都无济于事。我是菜鸟,所以请耐心等待。有任何想法吗?到目前为止,我有:http://jsfiddle.net/PeterHanekom/7ue5bkm8/1/
var options = {
chart: {
renderTo: 'container',
type: 'bar'
},
colors: ['#00B9B9', '#527CED', '#A7D36B', '#B9B900', '#0097FF', '#400040', '#EA4D00', '#336699', '#8080C0', '#ADA870'],
title: {
text: 'Cluster Totals',
x: -20 //center
},
subtitle: {
text: 'Dept - Branch',
x: -20
},
xAxis: {
categories: []
},
yAxis: {
min: 0,
max: 100,
title: {
text: 'Percentage'
},
labels: {
overflow: 'justify'
}
},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
this.x +': '+ this.y;
}
},
legend: {
align: 'center',
borderWidth: 0
},
plotOptions: {
bar: {
stacking: 'normal',
pointWidth: 20,
pointPadding: 0,
cursor: 'pointer',
point: {
events: {
click: function() {
alert('later drilldown events');
}
}
dataLabels: {
enabled: true,
inside:true,
useHTML: true,
align: 'left',
color: 'white',
style: {
fontWeight: 'bold'
},
verticalAlign: 'middle',
formatter: function () {
if (this.series.name)
return '<span style="color:black; height: 25px;">' + this.series.name + ' = ' + this.y + '</span>';
else return '';
}
}
}
},
series: []
}
$.getJSON("./services/get360Pivot.php?s_Search=" + sOperatorSearch, function(json)
{
options.xAxis.categories = json[0]['data'];
options.series[0] = json[1];
options.series[1] = json[2];
options.series[2] = json[3];
options.series[3] = json[4];
chart = new Highcharts.Chart(options);
});
答案 0 :(得分:6)
我认为您需要的选项是groupPadding和pointWidth。 e.g。
groupPadding:0.1,
pointWidth:20,