Highcharts - Добавить название серии в качестве метки X-Axis

Question

Возможно ли, чтобы клавиша «name» каждого объекта в серии была меткой оси x?

series: [{ 
     "data": [3570.5], 
      "name": "R", 
      "id": 0 
    }, { 
     "data": [3000], 
      "name": "S", 
      "id": 1 
    }, { 
     "data": [2500], 
      "name": "T", 
      "id": 2 
    }] 

Например, я хотел бы столбец 1, чтобы иметь й-ось метку «R», столбец 2, чтобы иметь е-оси метки «S» и т.д. Я попытался присвоением x- осевые категории

xAxis: {categories: ['R', 'S', 'T']} 

Но только ярлык «R» отображается по оси x. Я также пытался форматировать ряд по-разному:

 series: [{ 
     "data": [3570.5, null, null], 
     "name": "R", 
     "id": 0 
    }, { 
     "data": [null, 3000, null], 
     "name": "S", 
     "id": 1 
    }, { 
     "data": [null, null, 2500], 
     "name": "T", 
     "id": 2 
    }] 

Но что усложняет легкость, с которой я могу изменить видимость серии, то есть автоматическое изменение размеров обеих осей, скрывая всю колонку, а затем положить скрытый столбец обратно в его первоначальное место, пытаясь показать снова.

plotOptions: { 
     series: { 
      cursor: 'pointer', 
      point: { 
       events: { 
        click: function() { 
         var id = this.series.options.id; 
         var chart = $('#container').highcharts(); 
         var isVisible = chart.get(id).visible; 
         chart.get(id).setVisible(!isVisible); 
        } 
       } 
      } 
     } 
    } 

http://jsfiddle.net/calanoue/suw6xweh/

Answer 1

Вы были правильно настройки ваших категорий XAxis. Тем не менее, вы только устанавливали один пункт. В Highcharts по умолчанию используется точка, указывающая на индекс 0 («R»). Попробуйте установить индекс категории XAxis и использовать формат {x, y} точки:

series: [{ 
    data: [{x:0, y:3570.5}], 
     name: "R", 
     id: 0 
}, { 
    data: [{x:1, y:3000}], 
     name: "S", 
     id: 1 
}, { 
    data: [{x:2, y:2500}], 
     name: "T", 
     id: 2 
}] 

В x: значения индекс категории вы хотите заселены.

Answer 2

Вы можете попробовать, добавив имя в каждую точку данных, как в этом DEMO.

$(function() { 



var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'container', 
     type: 'column', 

    }, 
    xAxis: { 
     categories: ['R', 'S', 'T'], 


    }, 
    plotOptions: { 
     series: { 
      cursor: 'pointer', 
      point: { 
       events: { 
        click: function() { 
         changeSeriesVisibility(this.series.options.id); 
        } 
       } 
      } 
     } 
    }, 
    series: [{ 
     data : [{ x : 0, 
       y : 3750, 
       name : "R"}, 
       { 
        x : 1, 
        y: 3000, 
        name: "S" 
       }, 
       { 
        x : 2, 
        y : 2500, 
        name : "T" 
       } 
       ] 
    }, 

     ] 
}); 

function changeSeriesVisibility(id) { 
    // Hide/Show the series on click 

    var chart = $('#container').highcharts(); 
    var isVisible = chart.get(id).visible; 
    chart.get(id).setVisible(!isVisible); 
} 
});