CODEWITHSUNDEEP
javascriptjquerybar-charthighcharts
Mitul Shah
Mitul Shah

Reputation: 1566

HighChart Data label issue in bar chart

I want the label outside the bar stack. I've used below code but it doesn't work everytime.

enter image description here 

 dataLabels: {
              enabled: true,
              color: '#333',
              inside:false
          },

JSFiddle

Upvotes: 1

Views: 1006

Answers (2)

Stromgren
Stromgren

Reputation: 1074

Here you go:

dataLabels: {
          enabled: true,
          color: '#333',
          inside: false,
          crop: false,
          overflow: "none"
      },

http://jsfiddle.net/kq2xgwhg/

Documented here: http://api.highcharts.com/highcharts#plotOptions.series.dataLabels under "overflow".

Upvotes: 1

Abdul Jabbar
Abdul Jabbar

Reputation: 2573

There are different ways to position your data labels, you can set their x & y positions and you can also set position for each data point individually but as you have both negative and positive values and even if you don't it will be quite a headache. inside: false doesn't seem to be doing anything but i managed to find another easier solution for you which is the use of rotation property of the data label.. setting to even '1' takes the labels outside.

dataLabels: {
     rotation: 1,
     enabled: true,
     color: '#333',
},

See the DEMO here

Now you can play around with different angles and width heights to see what suits you best.

Upvotes: 1

Related Questions