arbermustafa / filament-google-charts-widgets
Chart widgets for Filament Php using Google Charts
Installs: 4 328
Dependents: 1
Suggesters: 0
Security: 0
Stars: 15
Watchers: 2
Forks: 5
Open Issues: 1
Requires
- php: ^8.1
- filament/widgets: ^3.0
- spatie/laravel-package-tools: ^1.13.5
Requires (Dev)
- pestphp/pest: ^2.10
README
Create chart widgets using Google Charts.
Installation
You can install the package into a Laravel app that uses Filament via composer::
composer require arbermustafa/filament-google-charts-widgets
Filament V2 - if you are using Filament v2.x, you can use this section
You can publish the config file with:
php artisan vendor:publish --tag=filament-google-charts-widgets-config
The config
file contains default global customization options for better charts rendering in light/dark theme based on the great work of Weekdone
Optionally, you can publish the view using:
php artisan vendor:publish --tag=filament-google-charts-widgets-views
Usage
Pie chart
use ArberMustafa\FilamentGoogleCharts\Widgets\PieChartWidget; class DemoPieChart extends PieChartWidget { protected static ?int $sort = 1; protected static ?array $options = [ 'legend' => [ 'position' => 'top', 'alignment' => 'center', ], 'height' => 400, 'is3D' => false, ]; protected function getHeading(): string { return 'Pie chart'; } protected function getData(): array { return [ ['Label', 'Aggregate'], ['Col1', 7.2], ['Col2', 23.7], ['Col3', 11.1], ]; } }
Donut chart
use ArberMustafa\FilamentGoogleCharts\Widgets\DonutChartWidget; class DemoDonutChart extends DonutChartWidget { protected static ?string $heading = 'Donut chart'; protected static ?int $sort = 2; protected static ?float $pieHole = 0.5; protected static ?array $options = [ 'legend' => [ 'position' => 'top', ], 'height' => 400, ]; protected function getData(): array { return [ ['Label', 'Aggregate'], ['Col1', 17.2], ['Col2', 23.7], ['Col3', 11.1], ]; } }
Available chart types
Below is a list of available chart widget classes which you may extend, and their corresponding Google Charts documentation page, for inspiration what to return from getData():
ArberMustafa\FilamentGoogleCharts\Widgets\AreaChartWidget
- Google Charts documentationArberMustafa\FilamentGoogleCharts\Widgets\BarChartWidget
- Google Charts documentationArberMustafa\FilamentGoogleCharts\Widgets\ColumnChartWidget
- Google Charts documentationArberMustafa\FilamentGoogleCharts\Widgets\DonutChartWidget
- Google Charts documentationArberMustafa\FilamentGoogleCharts\Widgets\LineChartWidget
- Google Charts documentationArberMustafa\FilamentGoogleCharts\Widgets\PieChartWidget
- Google Charts documentation
Live updating (polling)
By default, chart widgets refresh their data every 5 seconds.
To customize this, you may override the $pollingInterval
property on the class to a new interval:
protected static ?string $pollingInterval = '10s';
Alternatively, you may disable polling altogether:
protected static ?string $pollingInterval = null;
Chart configuration options
You may specify an $options
variable on the chart class to control the many configuration options that the Google Charts library provides. For instance, you could change the position off the legend for PieChartWidget class and set a custom height:
protected static ?array $options = [ 'legend' => [ 'position' => 'bottom', ], 'height' => 300, ];
Changelog
Please see CHANGELOG for more information on what has changed recently.
Contributing
If you want to contribute to this package, you may want to test it in a real Filament project:
- Fork this repository to your Github account.
- Create a Filament app locally.
- Clone your fork in your Filament app root directoy.
- In the
/filament-google-charts-widgets
directory, create a branch for your fix/improvement, e.g.fix/pie-chart
.
Install the packages in your app's composer.json
:
"require": { "arbermustafa/filament-google-charts-widgets": "dev-fix/pie-chart as dev-main", }, "repositories": [ { "type": "path", "url": "./filament-google-charts-widgets" } ]
Now run composer update
.
Please see CONTRIBUTING for details.
Security Vulnerabilities
Please review our security policy on how to report security vulnerabilities.
Credits
License
The MIT License (MIT). Please see License File for more information.