Highcharts - x 轴日期为空列的柱形图答案

【问题标题】：Highcharts - Column chart with empty columns for date in x-axisHighcharts - x 轴日期为空列的柱形图
【发布时间】：2014-05-23 13:46:48
【问题描述】：

如果我使用datetime 类型，有什么方法可以让柱形图或折线图不呈现空列？因为我想显示没有周末的最后 7 天，但这似乎是不可能的。

示例：http://jsfiddle.net/G5S9L/7/

预计：不显示 6 月 17 日/18 日

我尝试的第二件事是使用category 类型。在这种情况下，图表只是呈现在系列数据中指定的这些列。但我的图表由多个系列组成，每个系列都会有一些差距。 Highchart 与类别名称不匹配，并将所有 y 值放在一起。

例如：http://jsfiddle.net/G5S9L/6/

预计：星期四和星期一一样有 2 个列/栏

这些示例非常简化。我知道我可以生成一个包含 x 轴所有值的主列表，并根据主列表对每个系列进行排序，并用 NULL 值填充空白。但这是为我的统计数据生成数据的沉重开销。因为并非所有系列都有相同的来源来确定 x 轴的范围。

【问题讨论】：

标签： javascript highcharts

【解决方案1】：

使用 Highcharts？没有简单的方法可以实现这一目标。

但是，使用 Highstock，只需使用 xAxis.ordinal = true 即可，一切正常。见：http://jsfiddle.net/G5S9L/8/

【讨论】：

在你上面的 jsfiddle 中，在 6 月 15 日，类别 II 没有数据，如果我不希望留给它的间距怎么办
不支持。您需要编辑源代码/编写一些插件来防止此类行为。
意味着，为了这个小小的行为，要做很多工作。谢谢你的回复

【解决方案2】：

对于第二个问题，你可以简单地扩展Point类（包装applyOptions方法），并设置xAxis的类别。

(function (H) {
    H.wrap(H.Point.prototype, 'applyOptions', function (applyOptions, options, x) {
        var point = applyOptions.call(this, options, x),
            series = point.series;

        // check if 
        // 1. there is a name(category)
        // 2. xAxis has the categories defined
        // 3. x value equals xIncrement
        if (point.name && series.xAxis.categories && point.x === series.xIncrement - 1) {

            // find a matching category?
            var idx = series.xAxis.categories.indexOf(point.name);
            if (idx >= 0) {
                point.x = idx;
            }
        }

        return point;
    });

})(Highcharts);

见小提琴：http://jsfiddle.net/G5S9L/17/

【讨论】：