x轴上的数据以15分钟的时间间隔绘制在高图中

Question

我在高图中的x轴上显示96时间块时遇到问题。需要显示的数组是

["00:00", "00:15", "00:30", "00:45", "01:00", "01:15", "01:30", "01:45", "02:00", "02:15", "02:30", "02:45", "03:00", "03:15", "03:30", "03:45", "04:00", "04:15", "04:30", "04:45", "05:00", "05:15", "05:30", "05:45", "06:00", "06:15", "06:30", "06:45", "07:00", "07:15", "07:30", "07:45", "08:00", "08:15", "08:30", "08:45", "09:00", "09:15", "09:30", "09:45", "10:00", "10:15", "10:30", "10:45", "11:00", "11:15", "11:30", "11:45", "12:00", "12:15", "12:30", "12:45", "13:00", "13:15", "13:30", "13:45", "14:00", "14:15", "14:30", "14:45", "15:00", "15:15", "15:30", "15:45", "16:00", "16:15", "16:30", "16:45", "17:00", "17:15", "17:30", "17:45", "18:00", "18:15", "18:30", "18:45", "19:00", "19:15", "19:30", "19:45", "20:00", "20:15", "20:30", "20:45", "21:00", "21:15", "21:30", "21:45", "22:00", "22:15", "22:30", "22:45", "23:00", "23:15", "23:30", "23:45"],

我需要所有这些值以15分钟的间隔显示在X轴上，

{
      startOnTick: false,
      endOnTick: false,
      min: 0,
      //type: 'datetime',
      //pointInterval:1,

      tickInterval: 0.25,
      max: Math.max(this.deviation.allTimeBlocks.length),
      minRange: 1000 * 60 * 60 * 60,
      type: 'datetime',
      scrollbar: {
        enabled: true
    },
    tickPixelInterval: 0.25,
      //tickmarkPlacement: 'on',
      title: {
        text: 'Time (hrs)',

        style: {
          color: this.Highcharts.getOptions().colors[1]
        }
      },
      categories:  ["00:00", "00:15", "00:30", "00:45", "01:00", "01:15", "01:30", "01:45", "02:00", "02:15", "02:30", "02:45", "03:00", "03:15", "03:30", "03:45", "04:00", "04:15", "04:30", "04:45", "05:00", "05:15", "05:30", "05:45", "06:00", "06:15", "06:30", "06:45", "07:00", "07:15", "07:30", "07:45", "08:00", "08:15", "08:30", "08:45", "09:00", "09:15", "09:30", "09:45", "10:00", "10:15", "10:30", "10:45", "11:00", "11:15", "11:30", "11:45", "12:00", "12:15", "12:30", "12:45", "13:00", "13:15", "13:30", "13:45", "14:00", "14:15", "14:30", "14:45", "15:00", "15:15", "15:30", "15:45", "16:00", "16:15", "16:30", "16:45", "17:00", "17:15", "17:30", "17:45", "18:00", "18:15", "18:30", "18:45", "19:00", "19:15", "19:30", "19:45", "20:00", "20:15", "20:30", "20:45", "21:00", "21:15", "21:30", "21:45", "22:00", "22:15", "22:30", "22:45", "23:00", "23:15", "23:30", "23:45"],



    },

Answer 1

您可以使用scrollablePlotArea：

  chart: {
    scrollablePlotArea: {
        minWidth: 2500
    }
  }

Demo：

• https://jsfiddle.net/BlackLabel/t8cLzpes/

API参考：

• https://api.highcharts.com/highcharts/chart.scrollablePlotArea.minWidth