```sh npm install @odx/angular-chart-js ```
npm install @odx/angular-chart-jssh
npm install @odx/angular-chart-js
`
Import the Charts CSS theme file @import '@odx/ui/core/charts-theme.css' from @odx/ui;
$3
Add provideChartsTheme() from @odx/angular-chart-js to the providers to set the ODX color palette for your charts.
Similar to provideCharts() from ng2-charts, this provider sets configuration options for ODX charts. It offers a range of customizable settings and styles to create visually appealing and interactive charts. For more details, refer to the ng2-charts documentation. Additionally, this provider responds to changes in the ODX theme.
You can also provide custom configurations:
`ts
import { withDefaultRegisterables } from 'ng2-charts';
import { provideChartsTheme } from '@odx/angular-chart-js';
bootstrapApplication(AppComponent, {
providers: [
provideChartsTheme(withDefaultRegisterables(), {
defaults: {
font: { family: 'Verdana' },
backgroundColor: '#297f31',
},
}),
],
}).catch((err) => console.error(err));
`
Use BaseChartDirective:
`html
``