html file
<div style="width: 100%; display: block">
<canvas
*ngIf="loaded"
baseChart
[data]="barChartData"
[labels]="barChartLabels"
[options]="barChartOptions"
[legend]="barChartLegend"
[chartType]="barChartType"
>
</canvas>
</div>
ts.file
barChartOptions: any = {
scaleShowVerticalLines: false,
responsive: true
};
barChartLabels: string[] =[];
barChartType: string = 'horizontalBar';
barChartLegend: boolean = true;
barChartData: any[] =[];
loaded = false;
this.service.Salescount(form).subscribe((data) => {
this.name = data.result;
this.barChartLabels = this.name.map((item) => item.name);
this.barChartData = this.name.map((item) => item.sales);
this.loaded = true;
})
There are 4 values in barchart.labels and barchartdata. While running i m getting error as " Type 'string' is not assignable to type 'ChartType'"
And also I have imported ChartModules in app.module.ts
CodePudding user response:
Change your barChartType
type from string
to ChartType
and import it from chart.js.
import { ChartOptions, ChartType, ChartDataSets } from 'chart.js';
public barChartType: ChartType = 'bar';
Demo: https://stackblitz.com/edit/ng2-charts-bar-template?file=src/app/app.component.ts
CodePudding user response:
Maybe if you change CharType datatype to any?