Can we make it so Date Time axes display just the year in the data tables OR remove thousand separators from the data tables only?

Ask the community
1

Hello, we have a chart where we have the X Axis showing years and the thousands separator in place to make sure that the series values display correctly as e.g. 10,000 instead of 10000.

This, however, is adding thousand separators into the data tables so a year is e.g. 1,979 instead of 1979. To get around this, I switched the x axis from Linear to Date Time and set the axis labels and tooltip to only display the %Y, but this now means the x axis in the data table is a long string of date-time info, e.g. 1970-01-01 00:00:01, rather than just 1979.

Is there a way to turn off thousand separators displaying in the data table, or alternatively is there a way to make it so just the year displays in the data table for Date Time axes? Many thanks

2

Hey,

If you use the Date Time axis, you can add the following code to the custom code section.

(function (H) {
    H.wrap(H.Chart.prototype, 'getDataRows', function (proceed, multiLevelHeaders) {
        var rows = proceed.call(this, multiLevelHeaders);
        if (this.options.xAxis[0].type == 'datetime') {
            rows = rows.map(row => {
                if (row.x) {
                    row[0] = H.dateFormat('%Y', row.x);
                }
                return row;
            });
        }
        return rows;
    });
}(Highcharts));
2 Likes
3

Hi Kerry,

Thanks so much for sending this over!

I have added the following code to the custom code section and it solves the problem within the editor, but once I publish the chart it struggles to display the chart (only showing the axes and legend). This may because we are using linked Google sheets as the data source, but I will investigate properly next week.

1 Like
4

To add a bit of context here, the relevant bit of this custom code modifies the data table that is generated, allowing us to override its less than ideal output.

This may be why you are seeing different results with Google Sheets. Do share a basic data set, sheet, or a chart where this occurs, and I can investigate from our end as well.

One hunch I have is that this is being run before your Google Sheets data has had a chance to be loaded.

1 Like
5

Thanks Martin, I’ll create a test chart displaying this to demonstrate the issue and send it over.

6

Hi Martin, just an update on this – I did manage to get this to work with the custom code and Google Sheets, but only once I changed the original data in the spreadsheet to a Date Time format. Looks like a good solution would be to ensure the data in the original Google Sheet is also in Date Time before attempting to switch over the axes label format to Date Time.

2 Likes