Question

我想在left(negative) side上使用不同的值，例如1k，2k，3k等，在y轴的right(positive) side上使用不同的值，例如100,200,300等...

我通过在标签格式化程序功能中设置条件来尝试了不同的方法

// Data gathered from http://populationpyramid.net/germany/2015/

// Age categories
var categories = [
  '48-51', '51-54', '57-60', '60-63',
  '63-66'
],
oppositecategories = [];


Highcharts.chart('container', {
  chart: {
    type: 'bar'
  },
  title: {
    text: 'Headcount and Hires Age Distribution'
  },
  subtitle: {
    text: 'Lorem Ipsum'
  },
  xAxis: [{
    categories: categories,
    reversed: false,
    labels: {
      step: 1
    }
  }, { // mirror axis on right side
    opposite: true,
    reversed: false,
    categories: oppositecategories,
    linkedTo: 0,
    labels: {
      step: 1
    }
  }],
  yAxis: [{
      title: {
        text: null
      },
      labels: {
        formatter: function() {
          return Math.abs(this.value) + 'K';
        },
        y: 10
      }
    },
    {
      title: {
        text: null
      },
      opposite: false,
      reversed: false,
      labels: {
        step: 100,
        y: 100
      }
    }
  ],
  plotOptions: {
    series: {
      stacking: 'normal'
    }
  },

  tooltip: {
    formatter: function() {
      return '<b>' + this.series.name + ', age ' + this.point.category + '</b><br/>' +
        'Population: ' + Highcharts.numberFormat(Math.abs(this.point.y * 1000), 0);
    }
  },

  series: [{
    name: 'Current HC',
    data: [-2.132, -1.387, -1.121, -1.479, -1.239]
  }, {
    name: 'Hires(4Q)',
    data: [
      1.17, 1.72, 1.36, 1.03, 1.21
    ]
  }]
});

我期望负极值不同，而正极值

Answer 1

您可以为该系列创建两个单独的yAxis：

yAxis: [{
    max: 0,
    offset: 0,
    width: '50%'
}, {
    min: 0,
    offset: 0,
    left: '50%',
    width: '50%'
}]

实时演示： http://jsfiddle.net/BlackLabel/Lgqyc4k8/

Answer 2

使用yAxis.labels.formatter可以得到以下结果：

yAxis: [{
  title: {
    text: null
  },
  tickInterval:0.1,
  labels: {
    formatter: function() {
      if(this.value < 0 && this.value % 0.5 === 0){ // Negative value only on .5 k
        return Math.abs(this.value) + 'K';
      } else if(this.value > 0){ // Positive values
        return this.value * 1000;
      } else if (this.value === 0) {
        return 0;
      }
    },
    y: 10
  }
},

Fiddle

如何在条形负高图表中的相反y轴上设置不同的值

2 个答案: