ng2-nvd3
Angular component for nvd3 (uses d3 v3!). It has similar technique as angular-nvd3 for angular 1, but designed for angular 2+ and without extra features (like extended mode) you won't need.
Demos
Online demos:
Install
npm install ng2-nvd3
it requires angular2+
, d3
(v3.5.17) and nvd3
as dependencies.
Basic usage
Simple bar chart
Note: d3
and nvd3
should be also included in your project bundle.
Simple discrete bar chart:
Module
;;;; // d3 and nvd3 should be included somewhere;;
Component
;declare let d3: any; @ implements OnInit options; data; { thisoptions = chart: type: 'discreteBarChart' height: 450 margin : top: 20 right: 20 bottom: 50 left: 55 {return dlabel;} {return dvalue;} showValues: true { return d3d; } duration: 500 xAxis: axisLabel: 'X Axis' yAxis: axisLabel: 'Y Axis' axisLabelDistance: -10 thisdata = key: "Cumulative Return" values: "label" : "A" "value" : -29765957771107 "label" : "B" "value" : 0 "label" : "C" "value" : 32807804682612 "label" : "D" "value" : 19645946739256 "label" : "E" "value" : 019434030906893 "label" : "F" "value" : -98079782601442 "label" : "G" "value" : -13925743130903 "label" : "H" "value" : -51387322875705 ; }
Tests
npm test
Thanks
Special thanks to Tobias Walle and MaibornWolff team for the huge updates #51 !
Change Log
2.0.0 (master)
Fixed aot
issue #104
2.0.0-rc3
- Angular 4
1.1.3
- Angular2 - v2.0.0-rc4
1.1.2
- Angular2 - v2.0.0-rc3
1.1.1
- Angular2 - v2.0.0-rc2
1.1.0
- Angular2 - v2.0.0-rc1
1.0.7
- Angular2 - v2.0.0-beta.3
License
MIT