高图表xAx是在所有刻度上重复的第一个标签

时间:2016-06-16 21:32:41

标签: highcharts

我正在使用Highchart创建图表。我使用的是xAxis类型:' datetime'

我的第一个xAxis标签反复显示。当我添加tickInterval时,所有图形标记都重叠在一个和另一个上,所以我使用了pointInterval。除了重复显示的第一个xAxis标签外,所有图形选项都有效。

这是我的选项js:

    $(function () {
    $('#container').highcharts({
        chart: { type: 'area'},
        title: {text: null},
        exporting: { enabled: false },
        xAxis: {
            type: 'datetime',
            pointInterval: 24 * 3600 * 1000,
            labels: {
                padding: 0,
                step: 1,
                formatter : function() {
                    var dayStr = Highcharts.dateFormat('%a ',this.value);
                    return dayStr;
                }
            },
            startOnTick: true,
            endOnTick: false
        },
        yAxis: {
            min: <?php echo $this_min;?>,
            max: <?php echo $this_max;?>,
            title: { text:'mmHg' }
        },

        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
        series: [{showInLegend: false, name:'diastolic', data:[[1464998400, 130], [1465171200, 125], [1465344000, 120], [1465430400, 122]]}, {showInLegend: false, name:'systolic', data:[[1464998400, 90], [1465171200, 85], [1465344000, 80], [1465430400, 82]]}],
        tooltip: {
            formatter: function() {
                var s = [];

                $.each(this.points, function(i, point) {
                    s.push('<span style="font-weight:bold;">'+point.y +'<span>');
                });

                return s.join('/')+' mmHg';
            },
            shared: true
        },
        credits: { enabled: false}
    });
});

2 个答案:

答案 0 :(得分:0)

我在jsFiddle重新编写了代码。

您在[1464998400, 1465171200, 1465344000, 1465430400]中使用的时间戳series指向Jan 18 1970的同一日期,这就是您的x轴标签似乎重复的原因。查看我修改后的代码@ line#54,标签现在正常工作。

答案 1 :(得分:-1)

新版Highchart中不再提供

services.yml。您应该使用tickInterval代替。