Угловой с ng2charts для гистограммы показывает NAN%, когда нет данных

Question

Я реализовал гистограмму с использованием угловых диаграмм ng2 (chartjs), но проблема в том, что когда нет данных для баров, тогда он показывает NAN% на YAxes.Смотрите мой график ниже Это мой код

public barChartData: ChartDataSets[] = [{ label: 'Playbooks', data: this.playbookList }];
        public barChartLabels: Label[] = this.dayslist;


        public barChartOptions: (ChartOptions & { annotation: any }) ={
            scales: {
                xAxes: [{
                    display: true,
                    scaleLabel: {
                        display: true,
                        labelString: 'Days'
                    }
                }],
                yAxes: [{
                    display: true,
                    ticks: {
                        beginAtZero: true,
                        callback: function(value) {if (value % 1 === 0) {return value;}}
                    },
                    scaleLabel: {
                        display: true,
                        labelString: 'Playbooks'
                    }
                }]
            },
        };
        public barChartColors: Color[] = [
            {
                borderColor: 'silver',
                backgroundColor: '#55a3d1',
                Color:'#fff'
            },
        ];

Код шаблона ниже

<div *ngIf='data1.length != 0'>
          <canvas baseChart height="80"  [datasets]="barChartData" [labels]="barChartLabels" [options]="barChartOptions"
            [colors]="barChartColors" [legend]="barChartLegend" [chartType]="barChartType">
          </canvas>
        </div>

Может кто-нибудь помочь мне в этом, как решитьэтот выпуск.

getplaybooksCountApi(id) {
                this.handler.activateLoader();
                this.testSuiteService.getPlaybooksCounts(id).subscribe(results => {
                if (this.handler.handle(results)) {
                return;
                }
                this.playbooksData = results['data'];
                console.log(this.playbooksData)
                if (this.playbooksData && this.playbooksData.length > 0) {
                for (var i = 0; i < this.playbooksData.length; i++) {
                if (this.playbooksData[i].day)
                this.dayslist.push(this.playbooksData[i].day);

                if (this.playbooksData[i].playbookCount && this.playbooksData[i].playbookCount!=0)
                this.playbookList.push(this.playbooksData[i].playbookCount);
                if (this.playbooksData[i].playbookCount==0) 
                {
                this.playbooksData[i].playbookCount = 0;
                this.playbookList.push(this.playbooksData[i].playbookCount);
                }
                }
                }

                }, error => {
                this.handler.hideLoader();
                this.handler.error(error);
                });
                }

Answer 1

Поместите цикл for для списка playbook и проверьте, присутствуют ли данные или нет, и, если они отсутствуют, замените их на ноль.