Canvas from ng-charts won't be displayed

Question

I am trying to display some charts based on data that I have in my API. However, I am unbale to see the charts even though I can console.log the wanted data. Can anyone tell me where I am wrong hopefully this will help others with canvas too.

component.ts :

export class PageComponent implements OnInit {

  
  public  chartData : any = {
    data:[],
    label:'',
    labels:[],
    backgroundColor:["#46a0db", "#1c3359", "#90dcd8", "#4aa49e", "#b4d77d", "#dfce88", 

html :

<div style="display:block">
  <canvas baseChart [datasets]="chartData
    [options]="chartOptions" [legend]="chartLegend">
  </canvas>
</div>

I've tried different formats for the datasets of the canvas but got no luck

Answer 1

Your canvas code requires [data] parameter with data, as well as different formating for type. The working example is:

<canvas baseChart class="myActivityChart"
  [data]="myActivityDataWeek"
  [options]="myActicityOptions"
  [type]="'line'"
  >
</canvas>