Seenu Seenu - 1 month ago 20
Javascript Question

Highcharts X-Axis labels as Text

In this fiddle, with out changing the series data, Is it possible to show x-axis labels as text i.e.

{"apple","orange","mango"}
instead of decimals i.e
{0,1,2}
with out separating labels from JSON and providing it to Categories.

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

labels: {
enabled: true
}
},

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

Answer

Try this:

 $(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     
     }]
  });
});

SEE DEMO