Highcharts stacked column stackLabels do not show when axis is reversed -


i'm having issue stacklabels not show on yaxis when reversed enabled. see fiddle; https://jsfiddle.net/mattscotty/vhv8p77v/2/

$(function () {     var chart = new highcharts.chart( {         chart: {                 renderto :'container',             type: 'column'         },         title: {             text: 'stacked bar chart'         },         exporting:{enabled:false},         credits:{enabled:false},         xaxis: {             type: 'datetime'         },         yaxis: {             min: 0,             max:100,             reversed:true, //removing reversed fixes stack labels issue             title: {                 text: null             },             stacklabels: {                 enabled: true,                 style: {                     fontweight: 'bold',                     color: (highcharts.theme && highcharts.theme.textcolor) || 'gray'                 }             }         },         plotoptions:{                 column:{                     stacking:'normal'             }         },         series: [{             name: 'category i',             data: [                 [date.utc(2014, 5, 14), 20],                 [date.utc(2014, 5, 15), 30],                 [date.utc(2014, 5, 16), 25],                 [date.utc(2014, 5, 19), 10],                 [date.utc(2014, 5, 20), 15]             ]         }, {             name: 'category ii',             data: [                 [date.utc(2014, 5, 14), 25],                 //[date.utc(2014, 5, 15), 10],                 [date.utc(2014, 5, 16), 35],                 [date.utc(2014, 5, 19), 25],                 [date.utc(2014, 5, 20), 5]             ]         }, {             name: 'category iii',             data: [                 [date.utc(2014, 5, 14), 10],                 [date.utc(2014, 5, 15), 20],                 [date.utc(2014, 5, 16), 35],                 //[date.utc(2014, 5, 19), 25],                 [date.utc(2014, 5, 20), 15]             ]         }]     }); }); 

remove 'reversed' yaxis , see works fine, have work around or suggestion?

thanks in advance.

i looked api documentation (see http://api.highcharts.com/highcharts#yaxis.stacklabels) , found may useful you.

try adding verticalalign: bottom stacklabels attribute. push label inside bottom of columns. if wish, can add value y move them directly under column.

i'm curious why you're choosing display columns way, presentation indicates negative value.

i hope helpful you!

stacklabels: {     enabled: true,     style: {         fontweight: 'bold',         color: (highcharts.theme && highcharts.theme.textcolor) || 'gray'     },     // verticalalign puts stack labels @ bottom     verticalalign: 'bottom',     // y value moves label outside stack;      // note "15" or higher in fiddle push off chart altogether     y: 12 } 

enter image description here


Comments

Popular posts from this blog

javascript - Laravel datatable invalid JSON response -

java - Exception in thread "main" org.springframework.context.ApplicationContextException: Unable to start embedded container; -

sql server 2008 - My Sql Code Get An Error Of Msg 245, Level 16, State 1, Line 1 Conversion failed when converting the varchar value '8:45 AM' to data type int -