控制系列之间的间距，以避免在Highcharts中出现混乱

Question

在上面的高图示例中假设我在 Bananas 中有100个系列，现在只有1个，而在 Apples 中只有一个系列，如果有很多空白空间香蕉和橘子之间可以减少它们之间的间距吗？

原因是如果由于空间限制在 Bananas 中有100个系列，即使Bananas和Apples之间有额外的空间，每一行都会重叠。也可以删除＆＃34; Oranges＆＃34;如果它根本没有任何系列，只能容纳来自＆＃34; Bananas＆＃34; 的系列？

Answer 1

类别功能仅适用于等于1的常量滴答间隔。您要实现的是为每个类别保留不同的空间。这意味着滴答间隔必须是不规则的。

不幸的是，Highcharts没有提供自动执行此操作的属性 - 需要对数据进行编码和重构：

1. 所有点都指定了x位置（整数值）
2. xAxis.grouping已停用且xAxis.pointRange为1

3. 以下代码用于定义和定位标签：

   events: {
     render: function() {
       var xAxis = this.xAxis[0];
   
       for (var i = 0; i < xAxis.tickPositions.length; i++) {
         var tickPosition = xAxis.tickPositions[i],
           tick = xAxis.ticks[tickPosition],
           nextTickPosition,
           nextTick;
   
         if (!tick.isLast) {
           nextTickPosition = xAxis.tickPositions[i + 1];
           nextTick = xAxis.ticks[nextTickPosition];
   
           tick.label.attr({
             y: (new Number(tick.mark.d.split(' ')[2]) + new Number(nextTick.mark.d.split(' ')[2])) / 2 + 3
           });
         }
       }
     }
   }
   (...)
   xAxis: {
     tickPositions: [-0.5, 6.5, 7.5],
     showLastLabel: false,
     labels: {
       formatter: function() {
         switch (this.pos) {
           case -0.5:
             return 'Bananas';
           case 6.5:
             return 'Apples';
         }
       }
     }
   }
   

现场演示： http://jsfiddle.net/BlackLabel/2Lcs5up5/