Question

我需要在Highcharts中每隔5天显示一次x轴，但由于某种原因，日期显示正确。

这是我的小提琴。

代码：

$(function () {
    $('#container').highcharts({
        title: {
            text: 'Monthly Average Temperature',
            x: -20 //center
        },
        subtitle: {
            text: 'Source: WorldClimate.com',
            x: -20
        },
        xAxis: {
            categories: ["10/08/2015", "10/09/2015", "10/10/2015", "10/11/2015", "10/12/2015", "10/13/2015", "10/14/2015", "10/15/2015", "10/16/2015", "10/17/2015", "10/18/2015", "10/19/2015"],
    tickInterval: 24 * 3600 * 1000 * 5,
        },
        yAxis: {
            title: {
                text: 'Temperature (°C)'
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            valueSuffix: '°C'
        },
        legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'middle',
            borderWidth: 0
        },
        series: [{
            name: 'Tokyo',
            data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
        }, {
            name: 'New York',
            data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
        }, {
            name: 'Berlin',
            data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
        }, {
            name: 'London',
            data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
        }]
    });
});

Answer 1

如果您的图表具有日期时间轴，我担心您可以在tickInterval中使用毫秒，而这似乎不是这种情况（例如参见http://api.highcharts.com/highcharts#xAxis.dateTimeLabelFormats），您只是使用了字符串数组作为x轴的类别。

如果每隔5天显示 x轴，则表示有10-08-2015，10-13-2015，10-18-2015等，只需使用{{1}这就行了。

我修改了你的小提琴：https://jsfiddle.net/nk3q5ejL/4/

问候！

勾选间隔5天

1 个答案: