Question

I’m having trouble making this simple thing happen. I have this loop adding values to my arrays:

for(i = 0; i < sections; i++){
    datapointsUser[i] = [i+1, USER_NotesTaken[i]];
    datapointsAverage[i] = [i+1, AVERAGE_NotesTaken[i]];
    datapointsTopStudent[i] = [i+1, TOP_NotesTaken[i]];
}

Yet when I graph this on my jqplot, the datapoints don’t appear on the set of integers for the x axis. They look to be about halfway between each integer, despite the fact that I should have given them integer x values from this loop. Why are the values not landing on the ticks? I’ll put the code for my graph below. Thanks!

$.jqplot('statgraph', [datapointsUser, datapointsAverage, datapointsTopStudent], {
        axes: {
            xaxis: {
                numberTicks: sections,
                tickInterval: 1,
            },
            yaxis: {
                numberTicks: 16,
            },
        },

    });

Code for filling out graphed arrays:

// Dummy data
USER_NotesTaken = [3, 10, 4, 9, 5];
AVERAGE_NotesTaken = [7, 3, 1, 7, 9];
TOP_NotesTaken = [5, 8, 12, 13, 14];

// Sections variable is 5    
for(i = 0; i < sections; i++){
    datapointsUser[i] = [i+1, USER_NotesTaken[i]];
    datapointsAverage[i] = [i+1, AVERAGE_NotesTaken[i]];
    datapointsTopStudent[i] = [i+1, TOP_NotesTaken[i]];
}

Answer 1

The loop that creates your data make all of the data arrays with the same number of ticks (5 in this specific example). The section variable is also the same as the ticks number. You don’t need to "tell" this info to the graph engine, because it will generate it from the arrays automatically.

Summary:

You dont need the extra xaxis info. Remove numberTicks and tickInterval from the xaxis section, and your ticks will be aligned perfectly.

Working Code:

This is an aligned graph with the same data you’ve provided:

$.jqplot('statgraph',  [[[1,3],[2,10],[3,4],[4,9],[5,5]], [[1,7],[2,3],[3,1],[4,7],    
[5,9]], [[1,5],[2,8],[3,12],[4,13],[5,14]]],
{     
 axes: {
        xaxis: {
         
        //REMOVED EVERYTHING FROM HERE, YOU CAN REMOVE THE ENTIRE xaxis brackets.
        
        },
        yaxis: {
            numberTicks: 16
        }
    }
});