Названия месяцев Morris.Js с данными JSON - PullRequest
1 голос
/ 14 марта 2019

У меня есть гистограмма Морриса и данные JSON. Данные JSON вернули два данных с угловым foreach следующим образом:

data:[
{y:'01', a:25 ,b:45},
{y:'02', a:35 ,b:65}
]

«y» означает «xkey» и означает месяц, а «01» = январь и «02» = февраль. поэтому я хочу показать все месяцы в xlabel и только выбранные данные активны.

Как я могу сделать это с угловым foreach и с названиями месяцев?

Код:

 function barChart() {
  window.barChart = Morris.Bar({
   element: 'bar-chart',
   data: PeriodData,
   xkey: 'y',
   ykeys: ['a', 'b'],
   labels: ['Toplam Ciro', 'Toplam Paket'],
   postUnits: ' TL',
   lineColors: ['#1e88e5', '#ff3321'],
   lineWidth: '3px',
   xLabelAngle: 60,
   resize: true,
   redraw: true,
   hoverCallback: function(index, options, content, row) {
    var indexb = 2;
    var txtToReplace = $(content)[indexb].textContent;
    return content.replace(txtToReplace, txtToReplace.replace(options.postUnits, ""));
   }
  });
 }

и periodData;

angular.forEach(data, function(value, index) {
           PeriodData.push({
    y: data[index][dateType.toUpperCase()],
    a: data[index].TOTAL_CIRO,
    b: data[index].DELIVERY_TOTAL});
           });

1 Ответ

0 голосов
/ 16 марта 2019

Вы можете использовать функцию xLabelFormat следующим образом:

Morris.Line({
    element: 'chart_line_1',
    lineColors: ['#1e88e5', '#ff3321'],
    data: [
        {y:'01', a:25 ,b:45},
        {y:'02', a:35 ,b:65}
    ],
    xkey: 'date',
    ykeys: ['a', 'b'],
    labels: ['Toplam Ciro', 'Toplam Paket'],
    parseTime: false,
    dataLabels: false,
    xLabelFormat: function (x) { 
        if (x.src.y == '01') { return 'January'; }
        else if (x.src.y == '02') { return 'February'; }
        else { return '#NA'; }
    }
});
...