CODEWITHSUNDEEP
javascriptapexcharts
ABoooo
ABoooo

Reputation: 171

Timeline chart with hours instead of date

I want to set up a timeline chart like this https://apexcharts.com/javascript-chart-demos/timeline-charts/multi-series/ but instead of date as x labels only hours.

I've defined my date with timestamp

data: [
        {
          x: 'Maintenance',
          y: [
               1601361625000, // for example 2020-09-29 08:14:32
               1601383225000  // for example 2020-09-29 13:25:01
             ]
         },
         { ... }
]

And as xasis label like this

xaxis: {
                type: 'datetime',
                labels: {
                    formatter: function (value, timestamp) {
                        return moment(timestamp, "hh:mm");
                    },
                }
            }

But I still get the date back instead of the hours. Is this possible at all? Thx

Upvotes: 0

Views: 2133

Answers (1)

meskobalazs
meskobalazs

Reputation: 16041

It turns out, that the documentation is incorrect, it says this about the formatter function:

/**
* Allows users to apply a custom formatter function to xaxis labels.
*
* @param { String } value - The default value generated
* @param { Number } timestamp - In a datetime series, this is the raw timestamp 
* @param { index } index of the tick / currently executing iteration in xaxis labels array
*/

However this is not the case, the first argument is the timestamp, the second is the index, and there isn't a third one. So actually this one will work:

return moment(value).format("HH:mm");

Upvotes: 1

Related Questions