Can't bind to 'chartType' since it isn't a known property of

Topic: Can't bind to 'chartType' since it isn't a known property of 'canvas'.

renatoveronese free asked 6 years ago

I'm trying to put a pie chart in my page using the mdb, but i receive:

Can't bind to 'chartType' since it isn't a known property of 'canvas'.

I try to put exactly code that have in the pie chart mdb:

<div style="display: block">

<canvas mdbChart

[chartType]="chartType"

[datasets]="chartDatasets"

[labels]="chartLabels"

[colors]="chartColors"

[options]="chartOptions"

[legend]="true"

(chartHover)="chartHovered($event)"

(chartClick)="chartClicked($event)">

</canvas>

</div>

In the TS:

  public chartType: string = 'pie';

  public chartDatasets: Array<any> = [

    { data: [300, 50, 100, 40, 120], label: 'My First dataset' }

  ];

  public chartLabels: Array<any> = ['Red', 'Green', 'Yellow', 'Grey', 'Dark Grey'];

  public chartColors: Array<any> = [

    {

      backgroundColor: ['#F7464A', '#46BFBD', '#FDB45C', '#949FB1', '#4D5360'],

      hoverBackgroundColor: ['#FF5A5E', '#5AD3D1', '#FFC870', '#A8B3C5', '#616774'],

      borderWidth: 2,

    }

  ];

  public chartOptions: any = {

    responsive: true

  };

  public chartClicked(e: any): void { }

  public chartHovered(e: any): void { }

There's something special that i have to do?
Thanks

Add comment

Damian Gemza staff answered 6 years ago

1 0 Best answer

Dear @renatoveronese

Please do not import ChartsModule from ng2-charts.

Instead of it, please import ChartsModule from 'ng-uikit-pro-standard' or 'angular-bootstrap-md' (ng-uikit-pro-standard is a pro version, and angular-bootstrap-md is a free version).

Best Regards,

Damian

Add comment

renatoveronese free answered 6 years ago

0 0 Best answer

Yes, i

import { ChartsModule } from 'ng2-charts';

and

import { Chart } from 'chart.js';

Add comment

renatoveronese free answered 6 years ago

0 0 Best answer

Yes, i

import { ChartsModule } from 'ng2-charts';

and

import { Chart } from 'chart.js';

Add comment

Damian Gemza staff answered 6 years ago

0 0 Best answer

Dear @renatoveronese

Could you please tell me, if you have installed chart.js and @types/chart.js in your application?

I have tried to reproduce your problem on fresh MDB Angular application, and I didn't encounter your problem.

Best Regards,

Damian

shahnisargweb free commented 3 years ago

chart js and ng 2-charts requireded to install or not i also face same problem in this pl help me out

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

ForumUser: Free
Premium support: No
Technology: MDB Angular
MDB Version: 7.0.0
Device: Desktop
Browser: Opera
OS: Windows 10
Provided sample code: Yes
Provided link: No

renatoveronese

45Support score
3Questions 3Answers 0Snippets