@rfprodz/client-d3-charts
v1.5.5
Published
Angular chart components based on D3JS (https://d3js.org).
Downloads
86
Maintainers
Readme
Angular D3 Chart Components Module
This library was generated with Nx.
Description
The Angular chart components based on the D3.js library.
Supported chart types:
- bar chart;
- line chart;
- pie chart;
- radar chart;
- force-directed chart;
The library contains Angular components as well as basic utility functions that can be used to implement the chart types mentioned above in TypeScript.
Usage
Within the development workspace
Import the charts module
import { AppD3ChartsModule } from '@app/client-d3-charts';
As an external package
Install the package
yarn add @rfprodz/client-d3-charts @angular/common @angular/core @types/d3 d3
Import the charts module
import { AppD3ChartsModule } from '@rfprodz/client-d3-charts';
Use the chart components
in templates
<!-- bar chart -->
<app-bar-chart></app-bar-chart>
<!-- line chart -->
<app-line-chart></app-line-chart>
<!-- pie chart -->
<app-pie-chart></app-pie-chart>
<!-- gauge chart -->
<app-gauge-chart></app-gauge-chart>
<!-- radar chart -->
<app-radar-chart></app-radar-chart>
<!-- force-directed chart -->
<app-force-directed-chart></app-force-directed-chart>
in classes
import {
AppBarChartComponent,
AppForceDirectedChartComponent,
AppGaugeChartComponent,
AppLineChartComponent,
AppPieChartComponent,
AppRadarChartComponent,
} from '@rfprodz/client-d3-charts';
Chart examples
See the chart eamples components
import { AppChartExamplesComponent } from '@rfprodz/client-d3-charts';
or the source code of the chart examples component
Developer commands reference
npx nx run tools:help --search client-d3-charts: