Question

0

160

Views

Highcharts, datetime, timestamp. What format of date needs when axis has type 'datetime'?

I'm new with Highcharts and stuck with a question. When axis has type 'datetime' what kind of date format it needs, only timestamp? E.g.:

const options: Options = {
        chart: {
            type: 'column',
        },
        xAxis: {
            crosshair: false,
            type: 'datetime', 
            title: {
                text: 'test X,
            },
            labels: {
                format: '{value:%m.%Y}', // here I formate to date
            },
        },
        yAxis: {
            title: {
                text: 'test Y',
            },
        },
        series: [
            {
                name: 'test 1',
                data: [
                    [1483232400000, 1.4],
                    [1483491600000, 5.5],

                ],
            },
            {
                name: 'test 2',
                data: [
                    [1483232400000, 2.4],
                    [1483491600000, null],

                ],
            },
        ],

    };

But can I to pass data like this, with string?:

data: [
        ['2021/12/28', 1.4],
        ['2022/01/28', 1.3],...

or like this:

data: [
        ['28.12.2021', 1.4],
        ['28.01.2022', 1.3],...

3 months ago ·

Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Loading

Accepted Answer · 2022-06-30T11:24:02.023Z

Accorging to the documentation:

type

The type of axis. Can be one of linear, logarithmic, datetime or category. In a datetime axis, the numbers are given in milliseconds, and tick marks are placed on appropriate values like full hours or days. In a category axis, the point names of the chart's series are used for categories, if not a categories array is defined.

you need to use timestamps in milliseconds:

  series: [{
    data: [
      [new Date('2021/12/28').getTime(), 1.4],
      [new Date('2022/01/28').getTime(), 1.3],
      [new Date('2022/02/28').getTime(), 1.3]
    ]
  }]

Live demo: http://jsfiddle.net/BlackLabel/8sqafr27/

API Reference: https://api.highcharts.com/highcharts/xAxis.type