简体   繁体   中英

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.

在此处输入图片说明

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

JSFiddle

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.

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".

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM