为什么堆栈标签在条形高图上重叠

问题描述 投票:0回答:1

我想在堆栈条形图上显示所有堆栈标签

我使用以下属性:

      yAxis: {
        reversedStacks: false,
        min: 0,
        stackLabels: {
          endOnTick: this.reportData.showChartOnly ? false : true,
          enabled: true,
          allowOverlap: true,
          // overflow: 'none',
          crop: false,
          useHTML: true,
          inside: false,
          // overflow: 'allow',
          style: {
            fontWeight: 'normal',
            color: "#312e2e",
            fontFamily: 'Lato',
          },
          x: 8,
          y: -2,
          formatter: function () {
            let convertedValue = this.total != null && this.total != 0 ? parent.reportUtilService.convertUnit(this.total, parent.unit) : { data: this.total, unit: parent.unit };
            let value = parent.reportData.viewDef.showDecimalValue ? convertedValue.data : Highcharts.numberFormat(this.total, 0)
            return value + " " + convertedValue.unit;
          },
        },

但是有些值重叠在条上

javascript css angular highcharts angular2-highcharts
1个回答
0
投票

这是同样的问题。我用以下选项解决了它,

stackLabels: {
  enabled: true,
  crop: false,
  overflow: 'allow',
}

现在,标签出现在条形外部而不与其重叠。

 /**
     * (Highcharts) How to handle stack total labels that flow outside the plot
     * area. The default is set to `"justify"`, which aligns them inside the
     * plot area. For columns and bars, this means it will be moved inside the
     * bar. To display stack labels outside the plot area, set `crop` to `false`
     * and `overflow` to `"allow"`.
     */
© www.soinside.com 2019 - 2024. All rights reserved.