Plotting hours and Dates on chart using Highcharts

Question

Can anyone point me to an example for creating a plot chart using highcharts were the xAxis consists of the hours of the day 00:00 to 23:59 and the yAxis contains list of dates i can't find an example of how to achieve from the documentation.

basically the data that drives the chart would be something like this

15/05/2017: 09:00, 13:00, 14:30, 17:00, 19:15

16/05/2017: 09:30, 11:20, 12:45, 15:10, 18:00

17/05/2017: 08:30, 10:15, 13:00, 14:05, 20:30

Any examples or direction would be great.

Thanks

Answer 1

To achieve chart similar to your requirements you can use datetime xAxis with scatter series. http://api.highcharts.com/highcharts/xAxis.type

You can change your datetime label format to HH:MM:SS using dateTimeLabelFormats parameter: http://api.highcharts.com/highcharts/xAxis.dateTimeLabelFormats

xAxis: {
  type: 'datetime',
  dateTimeLabelFormats: {
    millisecond: '%H:%M:%S',
    second: '%H:%M:%S',
    minute: '%H:%M:%S',
    hour: '%H:%M:%S',
    day: '%H:%M:%S',
    week: '%H:%M:%S',
    month: '%H:%M:%S',
    year: '%H:%M:%S'
  }
},

Here you can see an example how it can work: http://jsfiddle.net/0quce36h/5/