Angularjs-nvd3-directives

directives for and

Home # Line Charts # Stacked Area Charts # Multi Bar Charts # Multi Bar Horizontal Charts # Discrete Bar Charts # Pie Charts # Scatter Charts # Sparkline Charts # Cumulative Line Charts # Line with Focus Chart # Bullet Charts # Events

Quickly create nvd3.js charts with Angular.js

Angular.js Directives “are a way to teach HTML new tricks”. Directives are Angular’s way of extending HTML to create new elements and functionality.

Directives hide the complexity and code that is necessary to create d3.js, and nvd3.js charts, which makes adding charts to an Angular.js application quicker, and simpler than typical methods.

The following charts can be created with just a few lines of JavaScript and HTML code.

Line Charts 11/09/200401/10/200806/30/200202/29/2012020406080100120 Cumulative Line Charts 0304060809110212020406080100120-11.569146943813133.41437346605Re-scale y-axisSeries 4 values cannot be calculated for this time period. Line with Focus Charts 06/30/200202/29/2012020406080100120-11.569146943813133.4143734660506/30/200202/29/20120-11.569146943813133.41437346605 Stacked Area Charts 11/09/200401/10/200806/30/200202/29/2012050100150200250300 Discrete Bar Charts JunJulAugSepOctNovDecJanFebMarAprMayJun-20-15-10-505 Multi Bar Charts 06/30/200210/31/200201/31/200305/31/2003-20-15-10-505 Multi Bar Horizontal Charts
Pie Charts OneTwoThreeFourFiveSixSeven Scatter Charts
-2-1012-2-1012
Sparkline Charts
Bullet Charts