Верхний график Отображение неверного значения месяца в xaxis - PullRequest
0 голосов
/ 25 мая 2018

Описание проблемы: Попытка отобразить значение месяца-года в xAxis, например, «январь 2016» - «декабрь 2016».У меня есть то же значение в $ scope.chartxAxisData объекте, но при отображении этого значения после форматирования в xAxis оно начинает отображаться с 'Dec 2015' до 'Ноябрь 2016'

//$scope.chartxAxisData Data as follow

//Value in  Time
// $scope.chartxAxisData = [1451586600000, 1454265000000, 1456770600000, 1459449000000, 1462041000000, 1464719400000,1467311400000,1469989800000, 1472668200000, 1475260200000, 1477938600000, 1480530600000];

//Value in Date
//[Fri Jan 01 2016 00:00:00 GMT+0530 (India Standard Time), Mon Feb 01 2016 00:00:00 GMT+0530 (India Standard Time), Tue Mar 01 2016 00:00:00 GMT+0530 (India Standard Time), Fri Apr 01 2016 00:00:00 GMT+0530 (India Standard Time), Sun May 01 2016 00:00:00 GMT+0530 (India Standard Time), Wed Jun 01 2016 00:00:00 GMT+0530 (India Standard Time), Fri Jul 01 2016 00:00:00 GMT+0530 (India Standard Time), Mon Aug 01 2016 00:00:00 GMT+0530 (India Standard Time), Thu Sep 01 2016 00:00:00 GMT+0530 (India Standard Time), Sat Oct 01 2016 00:00:00 GMT+0530 (India Standard Time), Tue Nov 01 2016 00:00:00 GMT+0530 (India Standard Time), Thu Dec 01 2016 00:00:00 GMT+0530 (India Standard Time)]

var axisLabelFormatter = function (self, serieData2) {                    
    var label = Highcharts.dateFormat('%b %Y', serieData2[self.value]);
    return label;                    
};

$scope.chartData = {
    chart: {
        type: 'column'
    },
    title: {
        text: ''
    },
    time: {
        useUTC: false
    },
    xAxis: {
        type: 'datetime',
        labels: {
            formatter: function() {
                return axisLabelFormatter(this, $scope.chartxAxisData);
            },
            style: {
                fonFamily: 'Verdana,sans-serif,aria',
                fontSize: 13
            },
            overflow: false
        },
        min: 0,
        max: $scope.chartxAxisData.length - 1
    },
    yAxis: {
        min: 0,
        title: {
            text: 'ADR',
            style: {
                fontSize: '20px'
            }
        },
        labels: {
            formatter: function() {
                return $scope.kpiprefix + this.axis.defaultLabelFormatter.call(this);
            }
        }
    },
    tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat: '<table><tr><td style="padding:0"><b>' + $scope.kpiprefix + '{point.y:.1f}</b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
    },
    plotOptions: {
        column: {
            pointPadding: 0.1,
            borderWidth: 0
        },
        series: {
            color: '#a3ca5f'
        }
    },
    series: [{
        showInLegend: false,
        name: 'series',
        data: $scope.chartSeriesData
    }]
};

Вывод enter image description here

Он должен начинаться с января 2016 .

1 Ответ

0 голосов
/ 25 мая 2018

Ваше время выходит за рамки, так как вы сталкиваетесь с проблемами часового пояса, анализатор, вероятно, анализирует длинные значения в другом часовом поясе, что приводит к времени в предыдущем месяце.Вы должны применить эту функцию к своим графикам.Это глобальная функция, которая устанавливает часовой пояс для всех ваших графиков.

Highcharts.setOptions({
    time: {
        timezone: 'Asia/Kolkata'
    }
});

Или замените
time: { useUTC: false }
в своем старшем коде, который вы уже разместили, чтобы изменить его локально.

Кроме того, чтобыдля работы, вы также должны импортировать некоторые библиотеки moment.js.

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone-with-data-2012-2022.min.js"></script>

Найти больше информации о времени в Highcharts API

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...