datalogix / laravel-charts
Laravel charts is a package to simplify the use of charts.
Requires
- php: ^7.3|^8.0
- composer/composer: ^2.3
- illuminate/console: ^7.0|^8.0|^9.0
- illuminate/contracts: ^7.0|^8.0|^9.0
- illuminate/http: ^7.0|^8.0|^9.0
- illuminate/support: ^7.0|^8.0|^9.0
Requires (Dev)
- graham-campbell/testbench: ^5.7
- mockery/mockery: ^1.5
- phpunit/phpunit: ^8.5|^9.5.10
- spatie/phpunit-watcher: ^1.0
README
Laravel charts is a package to simplify the use of charts.
Features
- Autoregister your charts
- Customize routing, middleware and prefix to your charts
- Command to create a new chart
php artisan make:chart ChartName
Installation
You can install the package via composer:
composer require datalogix/laravel-charts
The package will automatically register itself.
Configuration
The defaults are set in config/charts.php
. Copy this file to your own config directory to modify the values. You can publish the config using this command:
php artisan vendor:publish --provider="Datalogix\Charts\ChartsServiceProvider" --tag="config"
Commands
You can start creating charts with the typical make
command by laravel artisan.
php artisan make:chart SampleChart
This will create a SampleChart
class under App\Charts
namespace.
Render Charts
Laravel charts can be used without any rendering on the PHP side. Meaning it can be used and server as an API endpoint. There's no need to modify the configuration files or the chart to do such.
However, if you do not plan to develop the front-end as a SPA or in a different application and can use the
laravel Blade syntax, you can then use the @chart
helper to create charts.
The @chart
blade helper does accept a string containing the
chart name to get the URL of. The following example can be used as a guide:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Charts example</title> </head> <body> <!-- Chart container --> <div id="chart" style="height: 300px;"></div> <!-- Chart library --> <script src="https://unpkg.com/echarts/dist/echarts.min.js"></script> <!-- Chartisan --> <script src="https://unpkg.com/@chartisan/echarts/dist/chartisan_echarts.js"></script> <!-- Your application script --> <script> const chart = new Chartisan({ el: '#chart', url: "@chart('sample_chart')", }); </script> </body> </html>