Highcharts X轴标签作为文本

Question

在这个代码片段中，不改变序列数据的情况下，是否可以将x轴标签显示为文本，即{"apple","orange","mango"}，而不是十进制数，即{0,1,2}，同时不需要从JSON中分离标签并提供给类别。

$(function () {
    $('#container').highcharts({
        chart: {
        },
        xAxis: {

            labels: {
                enabled: true
            }
        },

        series: [{
            data: [["apple",29.9], ["orange",71.5], ["mango",106.4]]        
        }]
    });
});

- Srinivas

Answer 1

试试这个：

 $(function () {

var seriesData = [["apple",29.9], ["orange",71.5], ["mango",106.4]];     
$('#container').highcharts({
    chart: {
    },
    xAxis: {
        tickInterval: 1,
        labels: {
            enabled: true,
            formatter: function() { return seriesData[this.value][0];},
        }
    },

    series: [{
        data: seriesData     
     }]
  });
});

请查看演示

- Nitish Kumar

---

谢谢@Nitish Kumar。你的回答真的帮了我很多。如果你正在使用钻取图表并且你的数据看起来像这样：var chartTransactionList = [{'drillDown':'Diverse','name':'Diverse','y':135.9},{'drillDown':'Health','name':'Health','y':10142.4}]，那么你可以通过xAxis: {labels: {formatter: function() {return chartTransactionList[this.value].name;}}}设置x轴值 - 注意，在使用this.value获取元素后，你可以得到对象属性的名称。 - Somaiah Kumbera

Answer 2

您可以在xAxis中使用catgories

xAxis: {
    categories: ["apple", "orange", "mango"],
}

我已经更新了您的代码： http://jsfiddle.net/Lq6me/1/

如果您不想使用分类，可以选择

labels: {
    formatter: function() {}
}

- Strikers

Answer 3

不需要手动操作，更好的解决方案是在xAxis块中传递"type: 'category'"。请查看下面的代码片段。

xAxis: {
        type: 'category',
        labels: {
          rotation: -45,
          style: {
                  fontSize: '13px',
                  fontFamily: 'Verdana, sans-serif'
               },
          }
     }

- Vikram

---

我认为到目前为止最好的答案是，系列是放置数据的唯一位置。 - Chee Conroy