Angular 2/4/5/6 - несколько диаграмм для chart.js на одном полотне

Question

ОБНОВЛЕНИЕ

В качестве исправления я использовал графики прайменга.

Я инициализировал объект диаграммы (данные) и поместил его в массив диаграмм (dataArray).

<div *ngFor="let data of dataArray; let i=index">
    <p-chart #chart type="pie" [data]="dataArray[i]" [options]="optionsArray[i]" width="600" height="600"></p-chart>
  </div>

Начальный вопрос

Как распечатать несколько диаграммchart.js на том же холсте?

canvas.component.html

<div>
   <canvas #canvas>{{charts}}</canvas>
</div>

canvas.component.ts

export class CanvasComponent implements OnInit, AfterViewInit {

charts: Chart[] = []; //assume populated
@ViewChildren("canvas") canvas;

constructor(){}

ngAfterViewInit() {
  console.log(this.canvas); //gives me a query list?
}

Список запросов выглядит следующим образом:

Подобная проблема здесь, но решение не ясное, буду очень признателенПомогите! Chart.js + Angular 5 - создать несколько динамических диаграмм