如何在Highchart中显示小时的数据

时间:2017-06-19 13:14:48

标签: angular highcharts

我在当天的Highchart上展示系列数据。现在在1天内有24小时显示我在Y轴上显示24小时标签。

现在,问题在于某些元素数据包含前一天的数据。

例如:

当我选择3月26日的数据时,它包含午夜时分的3月25日数据,这些数据会被遗漏而不会在图表中绘制。

有没有办法可以绘制上个月的系列数据。

我的Highchart配置代码:

 highchartsConfiguration: any = {
        chart: {
            zoomType: 'x',
            plotBackgroundColor: 'rgba( 191, 192, 194, 0 )',
            events: {
                click(e) {
                    if (!($(event.target)[0].textContent)) {
                        PlotBandService.plotBandClicked(moment(e.xAxis[0].value).utc().format('YYYY-MM-DD HH:mm:ss'));
                    }
                },
            },
        },
        title: {
            text: '',
        },
        yAxis: {
            title: {
                style: {
                    'font-family': 'Arial',
                    'font-size': 12,
                    'font-weight': 'bold',
                },
            },
            allowDecimals: false,
            lineWidth: 1,
            lineColor: 'black',

        },
        xAxis: {
            lineWidth: 1,
            lineColor: 'black',
            type: 'datetime',
            alternateGridColor: 'rgba(191, 192, 194, .2)',
            // startOnTick: true,
            // endOnTick: true,
            tickInterval: 30 * 24 * 3600 * 1000,
            dateTimeLabelFormats: {
                hour: '%H',
                day: '%e. %b',
                week: 'CW: %W',
                month: '%b \'%y',
                year: '%Y',
            },
            units: [[
                'hour',
                [1],
            ], [
                'day',
                [1],
            ], [
                'week',
                [1],
            ], [
                'month',
                [1],
            ], [
                'year',
                null,
            ]],
            plotLines: [{
                id: 'plotLine',
                color: '#0000FF',
                width: 2,
            }],
            labels: {
                align: 'left',
            },
        },
        legend: {
            enabled: false,
        },
    };

0 个答案:

没有答案