Question

125

highcharts datetime x-axis custom formatting

rated 0 times [ 127] [ 2] / answers: 1 / hits: 26435 / 13 Years ago, fri, october 14, 2011, 12:00:00

I would like to have just the first letter of each weekday as the x-axis, ie M T W T F S S repeated. Currently you can set dateTimeLabelFormats, which I've set to use %a, which is the dateFormat for short weekday (Mon Tues Wed etc). How can I just use the first letter?

Here's my code (I'm using Lazy Highcharts in rails)

 f.xAxis({type: 'datetime', tickInterval: 24*3600*1000, dateTimeLabelFormats: {

        day: '%a',

        week: '%a'}

        })

Thanks.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

kourtney

Add To Favorites

Follow

Total Points: 368

Total Questions: 103

Total Answers: 85

Location: Bonaire

Member since Sat, May 1, 2021

3 Years ago

kourtney questions

1 Problem with typescript while making request to SWR

Sun, Oct 4, 20, 00:00, 4 Years ago

1 JS DateTimePicker onChange event not working

Tue, Oct 29, 19, 00:00, 5 Years ago

1 NodeJS and Sharp, BMP to PNG Error: Input file contains unsupported image format

Fri, May 24, 19, 00:00, 5 Years ago

1 React Slick slider map not showing slides?

Thu, Apr 4, 19, 00:00, 5 Years ago

1 Cypress - Add custom header for all XHR requests

Fri, Mar 1, 19, 00:00, 5 Years ago

View All

answered 13 Years ago marcelofrankiea · Accepted Answer

In the label -> formatter for xAxis, use dateFormat function to get the month and then use the substring function to get the first letter and return that letter as follows -

xAxis: {        

    type: 'datetime',

    labels: {

        formatter: function() {

            var monthStr = Highcharts.dateFormat('%b', this.value);

            var firstLetter = monthStr.substring(0, 1);

            return firstLetter;

        }

    }

},

See it on jsfiddle