Highcharts muestra series.name en X Axis

Estoy tratando de mostrar el nombre de cada serie en X-Axis http://jsfiddle.net/Jr79Y/9/ enter image description here

series: [{ name: 'Test', data: [20] }, { name: 'Test', data: [20] }, { name: 'Test', data: [40] }] 

¿Alguien sabe cómo hacer esto?

4 Solutions collect form web for “Highcharts muestra series.name en X Axis”

Esta es una solución mucho más simple que todo lo que estoy viendo para respuestas hasta ahora:

  xAxis: { categories:[] } 

.

 series: [{ data: [{name:'Test 1',y:20,color:'networking'}, {name:'Test 2',y:20,color:'blue'}, {name:'Test 3',y:40,color:'green'}] }] 

Ejemplo:

Aunque a less que tengas una muy buena razón para que cada barra sea de un color diferente, por lo general solo agrega un desorder visual innecesario y será mejor que dejes un solo color.

http://jsfiddle.net/Jr79Y/35/

 xAxis: { categories: ['Test1', 'Test2', 'Test3'] } 

Para la serie, esto es bastante sucio, pero funciona:

 series: [{ name: 'Test1', data: [20, 0, 0] }, { name: 'Test2', data: [0, 20, 0] }, { name: 'Test3', data: [0, 0, 40] } 

Prueba esto:

 xAxis: { categories: ['Test', 'Test', 'Test'], title: { text: null, } }, 

Y en la parte de serie:

 series: [{ name: 'Values', data: [20,20,40] },] 

Referencia .

EDITADO:

Está utilizando tres grupos, por lo que debe modificar su formatting de datos. Si quieres un color diferente, testing esto:

 series: [{ name: 'Values', data: [20,0,0] }, { name: 'Values', data: [0,20,0] }, { name: 'Values', data: [0,0,40] },] 

Mira esto

 $(function () { $('#container').highcharts({ chart: { type: 'bar' }, xAxis: { categories:['Test 1', 'Test 2', 'Test3'] }, plotOptions: { series: { dataLabels: { enabled: true, } //colorByPoint: true }, series: { colorByPoint: true } }, legend: { layout: 'vertical', floating: true, backgroundColor: '#FFFFFF', align: 'right', verticalAlign: 'top', y: 60, x: -60 }, series: [{ data: [40,20,20] }] }); }); 

http://jsfiddle.net/Jr79Y/36/

  • Dibujar un polígono festoneado entre múltiples puntos
  • ¿Cómo se transforman las coorderadas del evento a las coorderadas SVG a pesar del falso getBoundingClientRect ()?
  • Escucha a la derecha, haz clic en el elemento svg con Raphael.js
  • Árbol / dendrogtwig con conectores de codo en d3
  • SVG hover con múltiples elementos
  • Forma correcta de get el valor del atributo de statement del espacio de nombres
  • El formulario envía una firma capturada usando SVG
  • envolviendo text en circular textpath
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.