javascript - Justify stack labels -
i having problems stack labels. have them rotated -90 degrees , have set align left , vertical align bottom. reason label aligned bottom of each column not expected do. center of text label align bottom, not first letter of label. there way accomplish want without manually calculating y offset each individual stack label? , if not, how best tiresome calculation?
see attached fiddle:
$(function () { $('#container').highcharts({ chart: { type: 'column' }, title: { text: '' }, xaxis: { categories: [""] }, yaxis: [{ title: { text: '', style: { color: '#4572a7'} }, labels: { formatter: function () { return highcharts.numberformat(this.value, 0) + " usd" }, style: { color: '#4572a7' } }, stacklabels: { enabled: true, style: { fontsize: '1.5em', fontweight: 'bold', color: 'black' }, formatter: function () { return this.stack; }, rotation: -90, x: -5, verticalalign: 'bottom', align: 'left' }}], legend: { borderwidth: 1, shadow: false }, plotoptions: { column: { stacking: 'normal' }, series: { shadow: false} }, series: [{ data: [34, 34, 54, 12, 23], stack: 'stack 1' }] }); });
cheers!
edit
this simplified version of have. in real chart have dynamic content there different texts in stack labels , columns have various heights. none of know beforehand , need to, somehow, dynamically adjust stack labels bottom (and left of) of columns regardless of length of text in actual label.
thanks again!
you can change:
verticalalign: 'middle'
example: http://jsfiddle.net/zprjn/7/
or if want @ bottom, add:
y: -40
example: http://jsfiddle.net/zprjn/8/
Comments
Post a Comment