x 轴日期时间标签的 Highchart 高级格式

Question

我需要扩展日期标签格式以在测量值时在日期旁边显示时间段。

您可以在图片上看到它的外观。

有什么方法可以通过使用 Highchart 的格式函数来实现吗API?

编辑：我需要在不使用第三方解决方案的情况下实施，因为我需要将解决方案嵌入到 jasper 报告中。

谢谢

Answer 1

作为使用 'grouped categories' 插件的替代方法，您可以通过 Highcharts 创建额外的 xAxis 标签。 SVG渲染器。

chart: {
    events: {
        load: function() {
            var chart = this,
                ticks = chart.xAxis[0].ticks,
                xy;

            Highcharts.objectEach(ticks, function(tick) {
                if ((tick.pos + 2) % 3 === 0) {
                    xy = tick.label.xy;

                    chart.renderer.text('date', xy.x, xy.y + 20)
                        .attr({
                            'align': 'center'
                        })
                        .add();
                }
            });
        }
    }
},

实例：http://jsfiddle.net/BlackLabel/f7c54zop/

API参考：https://api.highcharts.com/class-reference/Highcharts.SVGRenderer#text

x 轴日期时间标签的 Highchart 高级格式

Highchart advance formatting of x-Axis datetime labels

javascript

jasper-reports

highcharts