Skip to content Skip to sidebar Skip to footer

Making Y Axis Of Highcharts In Time Format Hh:mm

I need to put in y-axis time format hh:mm, for example y-axis should have 16:00,32:00 and etc. ticks or smth simmilar. I've been working with highcharts - I'm new with JS and web-p

Solution 1:

So here is the answer that I've got if anyone need it (here is the link to jsfiddle).
I set the time variables in ms:

data: [0, 0, 0, 0, 76320000, 25920000, 102840000, 0, 0, 0, 0, 0]

And then I format this value as I need:

yAxis: {
            title: {
                text: 'Time (hh:mm)'
            },
            labels: {
                formatter: function () {
                    var time = this.value;
                    var hours1=parseInt(time/3600000);
                    var mins1=parseInt((parseInt(time%3600000))/60000);
                    return hours1 + ':' + mins1;
                }
            }
        }

That's the only way I found to make y axis in pure hh:mm format. Also you can make the data not in ms, but in w/e you want or need.


Solution 2:

then better use your own formatting method, here you will have more control on formatting. you can use formatter as shown below.

yAxis: {
    labels: {
        formatter: function () {
            //get the timestamp
            var time = this.value;
            //now manipulate the timestamp as you wan using data functions
        }
    }
}

hope this will help you in achieving what you needed.


Post a Comment for "Making Y Axis Of Highcharts In Time Format Hh:mm"