Using d3 with dependency injection in AngularJS

Today I will show that how to use d3 with Angular JS.

Usually, what you can do is add d3.js to your index.html file.  However, in order to keep global namespace clean in your angular module, it is better by using dependency injection like how Angular JS normally does.

To start, just create a d3 provider for the d3Service.

We use promise here to assure that d3 will be loaded in our browser.

To use d3 Service, just inject d3Service like other in AngularJs. For instance,