javascript - 如何使 Highstocks 的 x 轴均匀且规则？

Question

我正在使用 JavaScript 的 highstocks 库来呈现作为学校项目的一部分收集的一些数据。

虽然 highstocks 已经证明很好，但 x 轴正在发挥作用。

由于干扰，收集的数据并不总是有整齐的间隔，我希望图表能反射(reflect)这一点。

目前，x 轴在某些地方“跳跃”。

我想要一个带有均匀间隔刻度的规则 x 轴。

目前 ordinal 值设置为 false，我希望它能修复 x 轴。

设置相关设置:

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

    exporting: {
    enabled: false
    },

    credits: {
        enabled: false
    },

    xAxis: {
         ordinal: false
    }
};

我觉得此时我已经尝试了所有可能的设置排列 - 也许更有经验的人可以让我走上正确的道路？

可以在此处找到问题的图像: https://imgur.com/UUE50iF

可在此处找到该站点:cansat.sg.dk/graph/andoeya_droptest(链接已禁用，因为我只能发布 2 个链接...)

代码托管在 GitHub 上，可在此处找到: https://github.com/dkkline/CanSat14-15/tree/master/presenter

Answer 1

问题中没有包含相关代码，但我会解决这个问题。

您正在使用一个baseSettings 对象和一个自定义设置对象(我们称它们为customSettings)来形成一个图表。这两个单独的设置使用 jQuery extend 函数合并。

你的问题是，当 baseSettings 和 customSettings 都包含 xAxis 属性时，它们不会被合并，因为你没有使用extend 函数的 deep 变体。

简而言之，您目前拥有:

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

相反，使用这个(true 添加为 extend 的第一个参数):

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

参见 the jQuery API有关其工作原理的详细信息，以及为什么您当前的设置不起作用。

参数汇总:

deep

Type: Boolean

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