search

GraFiddle / angular-chart

AngularJS directive for adjustable dynamically updating c3 charts
http://grafiddle.github.io/angular-chart/
MIT License
127 stars 40 forks source link

Can't create chart from within another Directive as throws "No Data Provided" #65

Closed owaaa closed 9 years ago

owaaa commented 9 years ago

I'm trying to use the chart from within another directive. In this directive the scope where I set the data is created in local scope of my directive's link function. However the link function for the chart has already ran and thrown a fail on this line:

https://github.com/maxklenk/angular-chart/blob/develop/src/chart.js#L120

The watcher's are then never set after this is thrown in the rest of the link function below. The chart data is determined from within my directive so it appears I'm stuck? Am I missing something or how do I deal with this before I fork the project? I've never had a similar issue with other directives.

maxklenk commented 9 years ago

Hey @owaaa, thanks for reporting. I have not experienced this issue yet, what are you passing in tho the dataset variable? A $promise?

Perhaps the simple use of if (!scope.dataset) {} isn't the best to determine if the dataset key is present in the scope.

owaaa commented 9 years ago

I think the problem is the scope promise is from another directive vs a controller which already exists. Angular builds and links children first so the chart directive is post_linked before the link is called in my directive. Therefore nothing exists in dataset the first time its called. Normally this isn't an issue with other directives as when you compile the binding {{}} or use a watch angular will populate it when the parent has the data and everything works. I was tempted to fork and just remove the throw and let it continue to set up the watchers.

I just found a workaround where if I set an ng-if on the chart and wait for the dataset it works.

I have hence hit a second issue. I need to cap the y-axis to a max, but it doesn't seem to be respecting that option? I also can't seem to find a way to set a tick interval on the x/y axes?

maxklenk commented 9 years ago

I tried my best to handle all kind of promises and late assignment in the new release. Please try if it works like expected.

Furthermore setting ranges for the axes can be accomplished using the same api c3 provides, have a look a this grafiddle to see a working example.