Highstock：定制x轴与多时间标签？

Question

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

这可能吗？

THX！

Answer 1

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

xAxis选项：

    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
        }
    }],