https://github.com/PioneerCode/pioneer-charts
Data Visualization Charting library for Angular deployments.
https://github.com/PioneerCode/pioneer-charts
angular charts d3 data-visualization pioneer-charts pioneer-code
Last synced: 13 days ago
JSON representation
Data Visualization Charting library for Angular deployments.
- Host: GitHub
- URL: https://github.com/PioneerCode/pioneer-charts
- Owner: PioneerCode
- License: mit
- Created: 2018-03-09T21:02:17.000Z (over 7 years ago)
- Default Branch: main
- Last Pushed: 2025-10-09T17:50:29.000Z (19 days ago)
- Last Synced: 2025-10-14T16:29:24.731Z (14 days ago)
- Topics: angular, charts, d3, data-visualization, pioneer-charts, pioneer-code
- Language: TypeScript
- Homepage: https://charts.pioneercode.com
- Size: 3.72 MB
- Stars: 4
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: .github/CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
- fucking-awesome-angular - pioneer-charts - An Angular library for creating responsive, customizable charts using D3.js—supports bar, line, pie, and more. (Third Party Components / Charts)
- awesome-angular - pioneer-charts - An Angular library for creating responsive, customizable charts using D3.js—supports bar, line, pie, and more. (Third Party Components / Charts)
README
# Pioneer Charts
## Documentation
See the [docs site](https://charts.pioneercode.com) for guides, API reference, and examples.
## Overview
Pioneer Charts is an Angular library for building beautiful, customizable, and responsive data visualizations. It leverages [D3.js](https://d3js.org/) for rendering and supports a variety of chart types including bar, line/area, pie, and more.
## Features
- Beautiful default theme, easily customizable via SCSS.
- Supports Bar, Line/Area, Pie charts, and Legends.
- Event emitters for user interaction.
- Strongly typed configuration contracts.
- Open source and actively maintained.
## Quick Start
### 1. Install Pioneer Charts
```bash
npm install --save @pioneer-code/pioneer-charts
```
### 2. Import Component Modules
Import the modules you need in your `AppModule`:
```typescript
import { PcacBarVerticalChartModule, PcacLineAreaChartModule } from '@pioneer-code/pioneer-charts';
@NgModule({
imports: [
PcacBarVerticalChartModule,
PcacLineAreaChartModule,
// ...other modules
],
})
export class AppModule { }
```
### 3. Import Styles
Add the Pioneer Charts CSS to your global styles:
```scss
@import "~@pioneer-code/pioneer-charts/pcac.css";
```
## Usage Example
```html
```
## License
MIT © [Chad Ramos & Pioneer Code](LICENSE)