Highcharts:如何在图表标签上实现多行? [英] Highcharts: How can I achiveve multiple rows on chart labels?

问题描述

我该如何实现类似的目标?

How can I achieve something similar to this?

推荐答案

您可以简单地添加另一个xAxis，将其链接到第一个xAxis并设置适当的刻度间隔.查看我在下面发布给您的演示.

You can simply add another xAxis, linked it to the first one and set appropriate tick interval. Check demo I posted you below.

代码:

Highcharts.stockChart('container', {
  xAxis: [{
    type: 'datetime',
    tickInterval: 3 * 3600 * 1000, // 3 hours
    labels: {
      formatter: function() {
        return Highcharts.dateFormat('%H:%M', this.value);
      }
    }
  }, {
    offset: 40,
    type: 'datetime',
    linkedTo: 0,
    tickInterval: 24 * 3600 * 1000 // one day
  }],
  series: [{
    data: data
  }]
});

演示:
https://jsfiddle.net/ngp5o98u/

Demo:
https://jsfiddle.net/ngp5o98u/

Api参考:
https://api.highcharts.com/highcharts/xAxis.linkedTo

这篇关于Highcharts:如何在图表标签上实现多行?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！