EXCEPTION: TypeError: Cannot read property 'Chart' of undefined
Closed this issue · 1 comments
rafbermudez commented
When I try to use the example code (or any other code to create charts) in angular 5 (Dartlang 2 stable) I always get this error:
EXCEPTION: TypeError: Cannot read property 'Chart' of undefined
I'm debugging the code, everything seems correct except the last line.
I tried renaming the import (as prefix) and the problem persisted. ¿Any Idea?
These are my dependencies:
dependencies:
angular: ^5.0.0
angular_forms: ^2.0.0
angular_router: ^2.0.0-alpha+19
bootstrap_sass: any
json_serializable: ^1.2.1
chartjs: ^0.5.0
dev_dependencies:
angular_test: ^2.0.0
build_runner: ^0.10.0
build_test: ^0.10.2
build_web_compilers: ^0.4.0
test: ^1.0.0
sass_builder: ^2.0.0
And this is the code:
void ngOnInit() {
new Future.delayed(const Duration(seconds: 2), () => createChart());
}
void createChart() {
var rnd = new math.Random();
var months = <String>[
'January',
'February',
'March',
'April',
'May',
'June'
];
var data = new LinearChartData(labels: months, datasets: <ChartDataSets>[
new ChartDataSets(
label: 'My First dataset',
backgroundColor: 'rgba(220,220,220,0.2)',
data: months.map((_) => rnd.nextInt(100)).toList()),
new ChartDataSets(
label: 'My Second dataset',
backgroundColor: 'rgba(151,187,205,0.2)',
data: months.map((_) => rnd.nextInt(100)).toList())
]);
var config = new ChartConfiguration(
type: 'line', data: data, options: new ChartOptions(responsive: true));
CanvasElement canvas = querySelector('#canvas');
new Chart(canvas, config);
}
Cheers
rafbermudez commented
Solved! I made an error with the Chart.js library path in the head of my index.html
Works fine with a correct file path
<script src="correct-path/Chart.js"></script>