search

GrantMStevens / amCharts-Angular

Angular directive for amCharts library
Apache License 2.0
63 stars 39 forks source link

Cannot read property 'data' of undefined when ngRoute module used in application #44

Closed Nicoleyy closed 8 years ago

Nicoleyy commented 8 years ago

my App module and controller is separated, i have gave the data in my controller. here is some of my code: /* App Module */ angular.module('myModule',['ngRoute','amChartsDirective']). config(['$routeProvider', function($routeProvider) { $routeProvider. when('/getDataset', { templateUrl: 'views/index.html', controller: AppCtrl }). otherwise({ redirectTo: '/getDataset' }); }]);

/* Controllers */ function AppCtrl($scope,$http){ $http.get('/getDataset').success(function(respose){ console.log("i got a data respose"); $scope.options = { type: "serial", categoryField: "Data", rotate: true, pathToImages: 'https://cdnjs.cloudflare.com/ajax/libs/amcharts/3.13.0/images/', legend: { enabled: true }, chartScrollbar: { enabled: true, }, categoryAxis: { gridPosition: "start", parseDates: false }, valueAxes: [{ position: "top", title: "Million USD" }], graphs: [{ type: "column", title: "Income", valueField: "income", fillAlphas: 1, }] } $scope.options.data = respose; }); }

thanks for any help

Nicoleyy commented 8 years ago

Oh, I have this err because before the http called the chart was rendered, how should I render it after the http call is completed? can anyone help me ?

GrantMStevens commented 8 years ago

Look in the source code for the directive and you will see events towards the bottom that I have exposed. You can use the amCharts.updateData event to update the chart data, or you can use the amCharts.renderChart event to completely re-render the chart.

Your other option is to pass a promise in as the data property on amChartOptions. There is an example of how to use promises like this in the readme.

Nicoleyy commented 8 years ago

Thanks a lot !