https://github.com/flexmonster/pivot-angular
Angular pivot grid example with Flexmonster
https://github.com/flexmonster/pivot-angular
angular angular-cli angular14 angular16 pivot-grid pivot-tables
Last synced: 15 days ago
JSON representation
Angular pivot grid example with Flexmonster
- Host: GitHub
- URL: https://github.com/flexmonster/pivot-angular
- Owner: flexmonster
- Created: 2018-03-29T15:54:02.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2025-01-23T11:24:23.000Z (3 months ago)
- Last Synced: 2025-04-05T02:01:47.474Z (24 days ago)
- Topics: angular, angular-cli, angular14, angular16, pivot-grid, pivot-tables
- Language: TypeScript
- Homepage: https://www.flexmonster.com
- Size: 1.04 MB
- Stars: 12
- Watchers: 2
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Angular pivot table | Flexmonster Pivot Table & Charts sample project with Angular
[](https://www.flexmonster.com?r=sample_ngx)
Website: [flexmonster.com](https://www.flexmonster.com?r=sample_ngx)
[](https://github.com/flexmonster) [](https://twitter.com/Flexmonster)
## Flexmonster Pivot Table & Charts
Flexmonster Pivot Table & Charts is a powerful and fully customizable JavaScript component for web reporting. It is packed with all core features for data analysis and can easily become a part of your Angular data visualization project. The tool supports popular frameworks like Angular, React, Vue, Blazor, and [more](https://www.flexmonster.com/doc/available-tutorials-integration?r=sample_ngx). Also, Flexmonster connects to any data source, including SQL and NoSQL databases, JSON and CSV files, OLAP cubes, and Elasticsearch.
This repository contains a sample [Angular](https://angular.io/) project for Flexmonster Pivot Table & Charts.
**Note:** This version of the project uses the [ngx-flexmonster](https://github.com/flexmonster/ngx-flexmonster) wrapper, which is Ivy-compatible. Switch to the [ng-flexmonster](https://github.com/flexmonster/pivot-angular/tree/ng-flexmonster) branch for the project with the legacy `ng-flexmonster` wrapper.
Table of contents:
* [Prerequisites](#prerequisites)
* [Installation](#installation)
* [What is inside the project](#what-is-inside-the-project)
* [Related Flexmonster docs](#related-flexmonster-docs)
* [Support and feedback](#support-and-feedback)
* [Flexmonster licensing](#flexmonster-licensing)
* [Social media](#social-media)
## Prerequisites
- [Node.js 18 through 22](https://nodejs.org/en/)
## Installation
1. Download a `.zip` archive with the sample project or clone it from GitHub with the following command:
```bash
git clone https://github.com/flexmonster/pivot-angular.git && cd pivot-angular
```
2. Install the npm dependencies described in `package.json`:
```bash
npm install
```
3. Run the sample project:
```bash
ng serve
```
To see the result, open `http://localhost:4200/` in your browser.
## What is inside the project
Angular sample project contains several examples of Flexmonster Pivot usage and customization:
- **Pivot table demo** shows how to define the `report`, `toolbar`, `height`, `beforetoolbarcreated`, and `shareReportConnection` initialization parameters in the pivot grid for Angular.
- **Handling events** demonstrates how to subscribe to events and unsubscribe from them.
- **Using API calls** illustrates how to use Flexmonster's methods.
- **Updating data** is an example of using the `updateData()` method.
- **Customizing the Toolbar** illustrates how to customize the Toolbar.
- **Customizing the grid** shows how to customize the pivot table using the `customizeCell()` API call.
- **Integration with Highcharts** demonstrates how to integrate with the Highcharts charting library.
- **Integration with amCharts** is an example of integration with the amCharts charting library.
You can try all of these examples right from the project’s starting page.
## Related Flexmonster docs
- [Integration with Angular](https://www.flexmonster.com/doc/integration-with-angular/?r=sample_ngx) — learn how to integrate Flexmonster into an Angular project.
- [Usage examples in Angular](https://www.flexmonster.com/doc/usage-examples-angular/?r=sample_ngx) — see details on Flexmonster usage.
## Support and feedback
In case of any issues, visit our [troubleshooting section](https://www.flexmonster.com/doc/typical-errors?r=sample_ngx). You can also search among the [resolved cases](https://www.flexmonster.com/technical-support?r=sample_ngx) for a solution to your problem.
To share your feedback or ask questions, contact our Tech team by raising a ticket on [Flexmonster Help Center](https://www.flexmonster.com/help-center?r=sample_ngx). You can also find a list of samples, technical specifications, and a user interface guide there.
## Flexmonster licensing
This sample project uses [Flexmonster Angular wrapper](https://github.com/flexmonster/ngx-flexmonster), which is released as an MIT-licensed (free and open-source) add-on to Flexmonster Pivot.
To learn about Flexmonster Pivot licenses, visit the [Flexmonster licensing page](https://www.flexmonster.com/pivot-table-editions-and-pricing?r=sample_ngx).
If you want to test our product, we provide a 30-day free trial.
If you need any help with your license — fill out our [Contact form](https://www.flexmonster.com/contact-our-team?r=sample_ngx), and we will get in touch with you.
## Social media
Follow us on social media and stay updated on our development process!
[](https://linkedin.com/company/flexmonster) [](https://youtube.com/user/FlexMonsterPivot) [](https://twitter.com/flexmonster)