Highcharts如何根据值更改数据标签的对齐方式

问题描述

我用正负值构建了一个变量图:fiddle

我想从右到左更改poisitve值(蓝色)的数据标签的对齐方式。

        series: {
        stacking: 'normal',negativeColor: 'rgb(179,18,.4)',threshold: 0,dataLabels: {
            allowOverlap: true,x: 0,align: 'right',enabled: true,verticalAlign : 'middle',formatter: function () {
               return this.point.name + ': ' + Highcharts.numberFormat(Math.abs(this.point.y),1);
           },style: {
                fontFamily: 'Poppins',fontWeight:'550',color:'#373737',fontSize: "14px",textoutline: false
        }
        }
    }
}

我该怎么做?

解决方法

您可以在complete函数中定义数据标签对齐方式:

  data: {
    ...,complete: function(data) {
      data.series[0].data.forEach(function(el) {
        el.dataLabels = {
          align: el.y > 0 ? 'left' : 'center'
        }
      });
    }
  }

实时演示: https://jsfiddle.net/BlackLabel/aqn7p51x/

API参考: https://api.highcharts.com/highcharts/data.complete