我一直试图加粗这个堆叠列的最后总值。需要帮助。
提前致谢!
一直要求我写更多 它一直要求我写更多 它一直要求我写更多 它一直要求我写更多 它一直要求我写更多 它一直要我写更多
http://jsfiddle.net/leslie20/ekyLqz47/
$(function () {
Highcharts.setOptions({
global: {
VMLRadialGradientURL: 'http://code.highcharts.com/{version}/gfx/vml-radial-gradient.png', // Path to the pattern image required by VML browsers in order to draw radial gradients.
canvasToolsURL: 'http://code.highcharts.com/{version}/modules/canvas-tools.js' // The URL to the additional file to lazy load for Android 2.x devices. These devices don't support SVG, so we download a helper file that contains canvg, its dependecy rbcolor, and our own CanVG Renderer class.
},
title: {
align: 'left',
style : { color: '#f7921e',fontSize: '14px', fontWeight: 'bold'}
},
plotOptions: {
series: {
groupPadding: 0.1,
pointWidth: 28,
padding: 2
}
},
xAxis: {
tickColor: 'null',
lineColor: '#4d4d4f',
labels: {
formatter: function () {
if (this.isLast) {
return '<span style="font-weight: bolder; font-size: 12px">' + this.value + '</span>';
}
else {
return this.value;
}
}
}
},
legend: {
itemStyle: {
fontWeight: 'normal'
}
},
credits: {enabled: false},
lang: {
loading: 'Loading...', // The loading text that appears when the chart is set into the loading state
thousandsSep: ',' // The default thousands separator used in the Highcharts.numberFormat method unless otherwise specified in the function arguments.
}
// tooltip: {enabled: false}
});
$('#container6').highcharts({
chart: { type: 'column' },
title: { text: 'Cash Distribution Per Share (Declared)'},
xAxis: {
categories: [
'2010',
'2011',
'2012',
'2013',
'2014'
]
},
legend: {
reversed: true,
},
yAxis: {
min: 0,
gridLineColor: '#FFFFFF',
title: {text: ''},
labels: { enabled: false },
stackLabels: {
enabled: true,
y: -3,
formatter: function() {
return Highcharts.numberFormat(this.total, 1);
},
style: {
fontWeight: 'normal'
}
}
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
format: '{point.y:,.1f}',
style: {
textShadow: false,
}
}
}
},
series: [{
name: 'Special dividend<br>(cents)',
tooltip: {
pointFormat: 'Special dividend: <b>{point.y:,.1f} cents</b>'
},
color: '#414042',
data: [3.5, null, 1.7, 7.1, null],
dataLabels: {
enabled: true,
style: {
fontWeight: 'normal'
},
formatter: function() {
if (this.y != 0) {
return this.y;
} else {
return null;
}
}
}
}, {
name: 'Final dividend<br>(cents)',
tooltip: {
pointFormat: 'Final dividend: <b>{point.y:,.1f} cents</b>'
},
color: '#f7921e',
dataLabels: {
enabled: true,
style: {
fontWeight: 'normal'
},
},
data: [7.7, 7.9, 6.3, 7.1, {
dataLabels: {
enabled: true,
style: {
fontWeight: 'bolder',
fontSize: '12px'
},
},
y: 11.9
}],
}, {
name: 'Interim dividend<br>(cents)',
tooltip: {
pointFormat: 'Interim dividend: <b>{point.y:,.1f} cents</b>'
},
color: '#939598',
dataLabels: {
enabled: true,
style: {
fontWeight: 'normal'
},
},
data: [6.3, 6.6, 6.6, 6.8, {
dataLabels: {
enabled: true,
style: {
fontWeight: 'bolder',
fontSize: '12px'
},
},
y: 7.0
}],
}]
});
});
提前致谢!
答案 0 :(得分:1)
您可以使用stacklabels formatter然后检查xAxis上的最后一个刻度与stacklabel的当前x进行比较。如果这是相同的,那么加粗。
formatter: function () {
var ticks = this.axis.chart.xAxis[0].tickPositions,
len = ticks.length,
last = ticks[len - 1];
if(this.x === last)
return '<span style="font-weight:bold">' + Highcharts.numberFormat(this.total, 1) + '</span>';
else
return Highcharts.numberFormat(this.total, 1);
},
答案 1 :(得分:0)
只需将yAxis.stackLabels.style.fontWeight
设置为'粗体'而不是'正常'。
yAxis: {
min: 0,
gridLineColor: '#FFFFFF',
title: {
text: ''
},
labels: {
enabled: false
},
stackLabels: {
enabled: true,
y: -3,
formatter: function () {
return Highcharts.numberFormat(this.total, 1);
},
style: {
fontWeight: 'bold'
}
}
},