Search code examples
highchartsangular-highcharts

Display Date and time on highcharts


I have the following data

firstData = [  
["2019-11-24", "12:38:54"],
 ["2019-11-21", "07:06:29"],
 ["2019-11-20", "19:26:37"],
 ["2019-09-26", "19:56:00"] ]

secondData = [ 
["2019-09-26", "10:26:00"],
 ["2019-11-20", "06:52:34"],
 ["2019-11-21", "07:06:19"],
 ["2019-11-24", "07:38:54"] ]

I would like to display graph like this. date and time graph


Solution

  • So as I mentioned in the comment the y value must be a number. If you want to render it as a time format you will need to convert this string into a proper number, check the function below and the demo: https://jsfiddle.net/BlackLabel/2vc7aphd/1/

    function parseToNumber(string) {
      return Date.parse("1-1-1 " + string) - Date.parse('1-1-1 00:00:00')
    }
    
    function parseData(data) {
      let output = [];
      data.forEach(d => {
        let x = d[0],
          y = d[1];
    
        output.push({
          name: x,
          y: parseToNumber(y),
          label: y
        });
      })
      return output;
    }