Ярлыки на гистограмме отсутствуют

Question

Как я могу убедиться, что все ярлыки для полос видимы? На этой диаграмме отображается каждая другая метка. Обратите также внимание на то, что числовые метки отсутствуют и на всех остальных барах. Это проблема размера шрифта или что-то еще?

http://jsfiddle.net/brookssh/a0xdsc3q/

var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: "chartContainer", 
     defaultSeriesType: 'bar', 
     height: 595 
    }, 
    title: { 
     text: '18 York Street Consumption (RankIt)', 
     style: { 
      color: '#484a4a', 
      fontSize: '22px', 
      fontFamily: 'Arial, Helvetica, sans-serif', 
      fontWeight: 'bold' 
     } 
    }, 
    subtitle: { 
     text: 'Saturday, August 15 2015 through Sunday, August 16 2015' 
    }, 
    credits: { 
     enabled: false 
    }, 
    yAxis: { 
     allowDecimals: false, 
     title: { 
      text: "Test", 
      style: { 
       color: '#0063A2', 
       fontFamily: 'Arial, Helvetica, sans-serif', 
       fontWeight: 'bold' 
      } 
     }, 
     plotLines: [{ 
      color: 'red', // Color value        
      value: null, // Value of where the line will appear 
      width: 2 // Width of the line  
     }], 
     min: 0 
    }, 
    xAxis: [{ 
     categories: ['9th Floor Total kWh', '9th Floor', '8th Floor Lighting Total kWh', '8th Floor', '7th Floor Lighting Total kWh', '7th Floor', '6th Floor Total kWh', '5th Floor Total kWh', '5th Floor', '4th Floor Total kWh', '4th Floor', '3rd Floor Total kWh', '3rd Floor', '26th Floor Total kWh', '26th Floor', '25th Floor Total kWh', '25th Floor', '24th Floor Total kWh', '24th Floor', '23rd Floor Total kWh', '23rd Floor', '22nd Floor Total kWh', '22nd Floor', '21st Floor Total kWh', '21st Floor', '20th Floor Total kWh', '20th Floor', '19th Floor Total kWh', '19th Floor', '18th Floor Total kWh', '18th Floor', '17th Floor Total kWh', '17th Floor', '16th Floor Total kWh', '16th Floor', '15th Floor Total kWh', '15th Floor', '14th Floor Total kWh', '14th Floor', '13th Floor Total kWh', '13th Floor', '12th Floor Total kWh', '12th Floor', '11th Floor Total kWh', '11th Floor', '10th Floor Total kWh', '10th Floor'], 
     title: { 

     }, 
     type: 'category', 
     plotBands: [{ 
      color: '#DDECFF', 
      from: 1439571600000, 
      to: 1439744400000 
     }], 
     plotLines: [{ 
      color: 'grey', // Color value        
      dashStyle: "dash", 
      value: null, // Value of where the line will appear 
      width: 0 // Width of the line  
     }], 
    }, { 
     labels: { 
      rotation: -45, 
      enabled: false 
     }, 
     lineWidth: 0, 
    }], 
    exporting: { 
     enabled: false 
    }, 
    legend: { 
     enabled: false 
    }, 
    plotOptions: { 
     series: { 
      colorByPoint: true 
     }, 
     spline: { 
      enableMouseTracking: true, 
      animation: { 
       duration: 1500 
      }, 
      marker: { 
       enabled: false, 
       states: { 
        hover: { 
         enabled: true, 
         symbol: 'circle', 
         radius: 5, 
         lineWidth: 1 
        } 
       } 
      } 
     } 

    }, 
    tooltip: { 
     yDecimals: 2, 
     formatter: function() { 
      return tooltipFormat(this.x, null, this.y, yAxisTitle); 
     } 
    }, 
    series: [{ 
     data: [157, 169, 159, 173, 194, 203, 178, 144, 155, 411, 421, 275, 288, 266, 400, 214, 225, 142, 158, 112, 124, 114, 130, 112, 127, 134, 150, 107, 124, 143, 158, 85, 103, 99, 123, 174, 191, 327, 365, 221, 237, 241, 255, 310, 370, 133, 145], 
     dataLabels: { 
      enabled: true, 
      color: '#000', 
      style: { 
       fontSize: '10px', 
       verticalAlign: 'middle' 
      } 
     } 
    }] 

}); 

Answer 1

Вы можете использовать allowOverlap атрибут plotOptions.series.dataLabels, чтобы заставить отображение каждой этикетки:

plotOptions: { 
      series: { 
       colorByPoint: true, 
       dataLabels: { 
        allowOverlap: true 
       } 
      }, 
      /* ... */ 
} 

Обратитесь working JSFiddle here.