highstock - Highstock：具有多个时间标签的自定义 x 轴？

Question

我想在 Highstock 中创建一个自定义 xAxis。下图显示了我想做的 3 个示例。

那可能吗？

谢谢！

Answer 1

您将需要三个 xAxis 来实现这一点，否则您将从轴线上方的刻度中辞职。这是如何创建这个的完整示例：http: //jsfiddle.net/3bQne/478/

x轴选项：

    xAxis: [{
        // force first axis to display one unit
        dateTimeLabelFormats: {
            hour: '%H:%M',
            day: '%H:%M',
        }
    }, {
        dateTimeLabelFormats: {
            hour: '%e. %b',
            day: '%e. %b',
        },
        // use default positioner, but with offset for labels
        tickPositioner: function(min, max) {
            var ticks = this.getLinearTickPositions(this.tickInterval, min, max),
                tLen = ticks.length;

            for(var i = 0; i < tLen; i++){
                // translate axis labels by half day to position label between ticks
                ticks[i] += 12 * 3600 * 1000;
            }

            ticks.info = {
                higherRanks: [],
                unitName: 'day',
                totalRange: max - min
            };

            return ticks;

        },
        tickWidth: 0,
        tickInterval: 24 * 3600 * 1000,
        linkedTo: 0,
        offset: 0,
        labels: {
            y: -4
        }
    }, {
        // for ticks only
        tickPosition: 'inside',
        tickLength: 10,
        tickInterval: 24 * 3600 * 1000,
        linkedTo: 0,
        offset: 0,
        labels: {
            enabled: false
        }
    }],