I'm in a php project which need to show the chart. I intend to use Morrisjs to show which use Jquery. But I find out the angularjs is more interesting. Is there person can show me how can I use chart on angularjs with Ajax with data from php return.
Add a comment
|
4 Answers
Below the link for Google Chart Tools Directive Module for AngularJS
https://github.com/bouil/angular-google-chart
http://gavindraper.com/2013/07/30/google-charts-in-angularjs/
Comments
First you have to create a service to get your data.
Take a look at this plnkr http://plnkr.co/edit/KbBg67
$http.get('posts.json').success(function(data) {
instead of posts.json get your data
Below that you can see how we push the data to an array, the file is well commented.
And now, from a controller you can access that said data.
Now you have to create a directive to render the charts.
Here is a really good example that could be adapted to what you want. http://eric-schaefer.com/blog/2013/07/26/rendering-flot-charts-through-angular-js/
Comments
After receiving the data as Arthur described the next step is to bind this data to a directive which visualizes your data. angular-chart does this job for you.
It is an easy to use directive which connects D3.js with the AngularJS 2-Way-DataBinding. This way the chart gets automatically updated whenever you change the configuration options and at the same time the charts saves its state (zoom level, ...) to make it available in the AngularJS world.
Check out the examples to get convinced.
Comments
If you are using angularjs, no need to use jquery ajax. Use everything with the help of angularjs.
This is all for charts , Just follow it. First play with dummy data (don't retrive from DB).
Try to implement.
