Download the PHP package happones/filament-apex-charts without Composer
On this page you can find all versions of the php package happones/filament-apex-charts. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download happones/filament-apex-charts
More information about happones/filament-apex-charts
Files in happones/filament-apex-charts
Package filament-apex-charts
Short Description Apex Charts integration for Filament PHP.
License MIT
Homepage https://github.com/happones/filament-apex-charts
Informations about the package filament-apex-charts
Filament Apex Charts
Apex Charts integration for Filament
Installation
You can install the package via composer:
Register the plugin for the Filament Panels you want to use:
Filament V2 - if you are using Filament v2.x, you can use this section
Usage
Start by creating a widget with the command:
Available chart samples
You may choose:
- Area
- Bar
- Boxplot
- Bubble
- Candlestick
- Column
- Donut
- Heatmap
- Line
- Mixed-LineAndColumn
- Pie
- PolarArea
- Radar
- Radialbar
- RangeArea
- Scatter
- TimelineRangeBars
- Treemap
- Funnel
You may also create an empty chart by selecting the Empty option.
This command will create the BlogPostsChart.php file in app\Filament\Widgets. Ex:
Now, check out your new widget in the dashboard.
Available options
The getOptions()
method is used to return an array of options based on Apex Charts Options. This structure is identical with the Apex Chart library, which Filament Apex Charts
uses to render charts. You may use the Apex Chart documentation to fully understand the possibilities to return from getOptions().
Examples
Setting a widget title
You may set a widget title:
Optionally, you can use the getHeading()
method.
Hiding header content
You can hide header content by NOT providing these
- $heading
- getHeading()
- getFormSchema()
- getOptions()
Setting a chart id
You may set a chart id:
Setting a widget height
You may set a widget height:
Optionally, you can use the getContentHeight()
method.
Setting a widget footer
You may set a widget footer:
You can also use the getFooter()
method:
Custom view:
Html string:
Filtering chart data
You can set up chart filters to change the data shown on chart. Commonly, this is used to change the time period that chart data is rendered for.
Filter forms
You may use components from the Form Builder to create custom filter forms:
The data from the custom filter form is available in the $this->filterFormData array. You can use the active filter form values within your getOptions()
method:
Also, if you want your chart data to update when the value of a filter changes, you have to combine reactive()
with afterStateUpdated()
:
Single select
To set a default filter value, set the $filter
property:
Then, define the getFilters()
method to return an array of values and labels for your filter:
You can use the active filter value within your getOptions()
method:
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:
Alternatively, you may disable polling altogether:
Defer loading
This can be helpful when you have slow queries and you don't want to hold up the entire page load:
Loading indicator
You can change the loading indicator:
You can also use the getLoadingIndicator()
method:
Dark mode
The dark mode is supported and enabled by default now.
Optionally, you can disable it:
You can also set the theme in the getOptions method:
Extra options and Formatters
You can use the extraJsOptions
method to add additional options to the chart:
Publishing views
Optionally, you can publish the views using:
Testing
Changelog
Please see CHANGELOG for more information on what has changed recently.
Contributing
Please see CONTRIBUTING for details.
Security Vulnerabilities
If you discover a security vulnerability within this package, please send an e-mail to [email protected].
Credits
- Leandro Costa Ferreira
- All Contributors
License
The MIT License (MIT). Please see License File for more information.
All versions of filament-apex-charts with dependencies
filament/filament Version ^3.0
illuminate/contracts Version ^9.0|^10.0
livewire/livewire Version ^3.0
spatie/laravel-package-tools Version ^1.13.0