CODEWITHSUNDEEP
highcharts
Sakthi S
Sakthi S

Reputation: 11

How to plot the X axis data point for uneven tick interval at in Highcharts

I am having a unequal data values in X axis the data point is plotted in the center of the tick interval, kindly see the fiddle link http://jsfiddle.net/mailsakthi/w4oyx8Ln/3/. Please see the 3rd point of the black line (9.4, 1.879) inspite of using the x-axis unequal interval code 

  tickPositioner: function() {
    var tickPositions = [];
    Highcharts.each(this.series[0].options.data, function(p) {
      tickPositions.push(p[0]);
    });
    return tickPositions;
  }

Upvotes: 0

Views: 258

Answers (1)

wergeld
wergeld

Reputation: 14442

Just because you are using numbers in your xAxis.categories array does not mean that they are treated as numbers. They are treated as literals that are separated by 1 index value from each other. From the documentation:

If categories are present for the xAxis, names are used instead of numbers for that axis

If you want the xAxis to be numeric then you need to set your x values to be numbers in your data points.

Setting up x/y values in your points:

data: [{
        x: 0,
        y: 7.7918348462852,
        color: 'RGBA(128,128,128,0)',
        segmentcolor: 'RGBA(128,128,128,0)'
      }, {
        x: 0.5,
        y: null,
        color: 'RGBA(128,128,128,0)',
        segmentcolor: 'RGBA(128,128,128,0)'
      }, {
        x: 1.8790271054655,
        y: 7.6224396161563,
        color: 'RGBA(128,128,128,0)',
        segmentcolor: 'RGBA(128,128,128,0)'
      }]

Remove categories from you xAxis properties.

Live sample of a smaller set of your data.

Upvotes: 1

Related Questions