CODEWITHSUNDEEP
javascripthighcharts
Norikaz Ishii
Norikaz Ishii

Reputation: 155

How to fix xAxis(datetime) scale in Highcharts?

xAxis label sliding when wide or zoom; date_format use 'month', 'week', maybe others. I want datetime scale month only. How can I do it? I don't like 'Feb, Feb, ...'

$(function () {
    var data = [];
    var y = 1000;
    for (var year = 2014; year <= 2014; year++) {
        for (var month = 0; month <= 5; month++) {
            var day = Math.floor(Math.random() * 30);
            y += Math.floor(Math.random() * 5);
            data.push([Date.UTC(year, month, day), y]);
        }
    }
    var dtlf = {
        week: '%b(w)',
        day: '%b(d)',
        month: '%b(m)',
        year: '%b(y)'
    };
    $('#container').highcharts({
        chart: {zoomType: 'x', type: 'line', width: 800},
        xAxis: {type: 'datetime', gridLineWidth: 1, startOnTick: true, dateTimeLabelFormats: dtlf},
        series: [{name: 'series', type: 'line', data: data}]
    });
});

Upvotes: 0

Views: 883

Answers (1)

Paweł Fus
Paweł Fus

Reputation: 45079

You need to set tickInterval: 30 * 24 * 3600 * 1000 - then tick will be displayed every month.

Upvotes: 1

Related Questions