How to make a Highstocks x-axis even and regular?

Question

I am using the highstocks library for JavaScript to render some data collected as part of a school project.

While highstocks has proven great, the x-axis is acting up.

Due to interference, the collected data does not always come with neat intervals, and I would like the graph to reflect that.

Currently, the x-axis "jumps" in places.

I would like to have a regular x-axis with evenly spaced ticks.

Currently the ordinal value is set to false, which I would've expected to fix the x-axis.

The relevant settings are set:

var baseSettings = {
    rangeSelector: {
        enabled: false
    },

    exporting: {
    enabled: false
    },

    credits: {
        enabled: false
    },

    xAxis: {
         ordinal: false
    }
};

I feel like I've tried every possible permutation of settings at this point - perhaps someone more experienced can set me on the proper path?

An image of the problem can be found here: https://i.stack.imgur.com/b51Ny.jpg

The site can be found here: cansat.sg.dk/graph/andoeya_droptest (link disabled, as I can only post 2 links...)

The code is hosted on GitHub and can be found here: https://github.com/dkkline/CanSat14-15/tree/master/presenter

Answer 1

The relevant code isn't included in the question, but I'll address the issue.

You are using a baseSettings object and a custom settings object (lets call them customSettings) to form a chart. These two separate settings are merged using the jQuery extend function.

Your problem here is that when both baseSettings and customSettings both include the xAxis attribute they will not be merged because you are not using the deep variant of the extend function.

In short, you currently have this:

$(domIdent).highcharts('StockChart', $.extend({}, baseSettings, {
    // Custom settings
}));

Instead, use this (true added as first argument of extend):

$(domIdent).highcharts('StockChart', $.extend(true, {}, baseSettings, {
    // Custom settings
}));

See the jQuery API for details on how this works, and why your current setup isn't working.

Summary of the parameter:

deep

Type: Boolean

If true, the merge becomes recursive (aka. deep copy).