How to show data for the Hour in Highchart

2019-09-16 19:58发布

问题:

I am showing the Series Data on the Highchart for the Day. Now in 1 day there is 24hrs show i am showing 24 hr label on the Y-Axis.

Now, the problem is for some elements data contains previous day data.

For e.g:

When i am selecting 26th March Data it contains 25th March data from the midnight, those are getting missed and not plotted in the chart.

Is there any way from which i can plot those previous month series data.

My Code For Highchart Config:

 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,
        },
    };