etiquetas de columna de alto marcador

Question

He hecho un gráfico de Highcharts con columnas agrupadas y apiladas, como en el ejemplo que se encuentra aquí: http://www.highcharts.com/demo/column-stacked-and-grouped. El ejemplo muestra una cantidad de frutas para 5 personas diferentes, agrupadas por sexo. Lo que extraño en este ejemplo es una etiqueta del eje x que muestra el nombre del grupo (masculino o femenino) debajo de cada grupo. ¿Es posible agregar esto a la tabla?

Aquí hay una versión simplificada del gráfico que estoy tratando de hacer: http://jsfiddle.net/WQjVP/66/. Muestra la cantidad de problemas abiertos (azules) y vencidos (rojos) para tres ubicaciones en un sistema de manejo de casos. La columna de la izquierda en cada grupo muestra los números de esa ubicación para julio, y la columna de la derecha en cada grupo muestra los números de agosto para la misma unidad. Lo que me gustaría hacer es mostrar el mes debajo de cada columna, de modo que la primera columna tenga "Jul", la segunda tendrá "Ago", la tercera tendrá "Jul" y así sucesivamente, entre la columna y el etiqueta de ubicación

chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'container', 
     type: 'column' 
    }, 
    title: { 
     text: '' 
    }, 
    subtitle: { 
     text: '' 
    }, 
    xAxis: { 
     categories: ["Location A","Location B","Location C"], 
     title: { 
      text: "Location" 
     } 
    }, 
    yAxis: { 
     allowDecimals: false 

    }, 
    plotOptions: { 
     series: { 
      dataLabels: { 
       enabled: true, 
       formatter: function() { 
        if (this.y === 0) { 
         return null; 
        } 
        return this.y; 
       }, 
       style: { 
        color: 'white' 
       } 
      } 
     }, 
     column: { 
      stacking: 'normal', 
      borderWidth: 0 
     } 
    }, 
    series: [{ 
     "color": "rgb(0,0,255)", 
     "name": "open", 
     "data": [18, 2, 6], 
     "stack": "Jul"}, 
    { 
     "color": "rgb(255,0,0)", 
     "name": "overdue", 
     "data": [0, 0, 0], 
     "stack": "Jul"}, 
    { 
     "color": "rgb(0, 0, 255)", 
     "name": "open", 
     "data": [20, 1, 10], 
     "stack": "Aug"}, 
    { 
     "color": "rgb(255, 0, 0)", 
     "name": "overdue", 
     "data": [2, 1, 2], 
     "stack": "Aug"}] 
}); 

Answer 1

Intente utilizar stackedLabels.

yAxis: { 
    stackLabels: { 
     enabled: true, 
     style: { 
      fontWeight: 'bold', 
      color: 'gray' 
     }, 
     formatter: function() { 
      return this.stack; 
     } 
    } 
} 

Demo

reference