PHPackages matheusmarnt/livecharts - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Admin Panels](/categories/admin) 4. / 5. matheusmarnt/livecharts ActiveLibrary[Admin Panels](/categories/admin) matheusmarnt/livecharts ======================= Elevate your data visualization with reactive charts in Laravel. v2.7.8(1mo ago)4335—0%MITPHPPHP ^8.2CI passing Since May 2Pushed 1mo agoCompare [ Source](https://github.com/matheusmarnt/livecharts)[ Packagist](https://packagist.org/packages/matheusmarnt/livecharts)[ Docs](https://github.com/matheusmarnt/livecharts)[ GitHub Sponsors](https://github.com/matheusmarnt)[ RSS](/packages/matheusmarnt-livecharts/feed)WikiDiscussions main Synced 3w ago READMEChangelog (10)Dependencies (28)Versions (59)Used By (0) [![LiveCharts](art/livecharts.png)](art/livecharts.png) [![Latest Version on Packagist](https://camo.githubusercontent.com/b582228ec8e5344b6d6b4e3fb7027d31a7e98528a83c9f2df968e74ae27011e7/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6d6174686575736d61726e742f6c6976656368617274732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/matheusmarnt/livecharts) [![Tests](https://camo.githubusercontent.com/8efac954a37160ce2fd5c4c1a37f34ae5dd2676e7ba290aaadd870d931f74beb/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6d6174686575736d61726e742f6c6976656368617274732f72756e2d74657374732e796d6c3f6272616e63683d6d61696e266c6162656c3d7465737473267374796c653d666c61742d737175617265)](https://github.com/matheusmarnt/livecharts/actions?query=workflow%3Atests+branch%3Amain) [![Code Style](https://camo.githubusercontent.com/e850ee739193a33ee9560042c7c541d2d1910922511b0ec9b3dd9a3b4393cef9/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6d6174686575736d61726e742f6c6976656368617274732f6669782d7068702d636f64652d7374796c652d6973737565732e796d6c3f6272616e63683d6d61696e266c6162656c3d636f64652b7374796c65267374796c653d666c61742d737175617265)](https://github.com/matheusmarnt/livecharts/actions?query=workflow%3A%22Fix+PHP+code+style+issues%22+branch%3Amain) [![Total Downloads](https://camo.githubusercontent.com/7508ebf626cacd687e0bba977d1d7f45123257ef7ab274544c8ec4c2d34c2c65/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6d6174686575736d61726e742f6c6976656368617274732e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/matheusmarnt/livecharts) [![License](https://camo.githubusercontent.com/c090e080484e2a2bc766446291d04437db823929042bf614b26a1643660ddf6f/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e3f7374796c653d666c61742d737175617265)](LICENSE.md) [![Laravel](https://camo.githubusercontent.com/d0567ae9c2afd9c58dad8730e3efde36f2ab6bb80973d8f510839c29fe319021/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c61726176656c2d31302537433131253743313225374331332d4646324432303f7374796c653d666c61742d737175617265266c6f676f3d6c61726176656c266c6f676f436f6c6f723d7768697465)](https://laravel.com) [![Livewire](https://camo.githubusercontent.com/4500bb19e4fbadde33dc9692f268c45222283802a762610fa4fea1a9ef534afb/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c697665776972652d33253743342d4642373041393f7374796c653d666c61742d737175617265)](https://livewire.laravel.com) LiveCharts ========== [](#livecharts) Reactive chart abstraction for Laravel — pure PHP API, multi-engine rendering, Livewire delivery. LiveCharts unifies ApexCharts and Chart.js behind a single fluent PHP API. Define charts in PHP, render them with one Livewire component, and update them reactively from your application state — no JavaScript boilerplate, no engine-specific configuration leaking into your views. Features -------- [](#features) - **Fluent + class-based builders** — `LiveCharts::line()->labels(...)->dataset(...)` or `class extends Chart` - **18 chart types** — line, bar, area, pie, donut, radar, scatter, bubble, heatmap, range bar, radial bar, polar area, box plot, treemap, candlestick, matrix, sankey, plus a generic factory - **Multi-engine** — ApexCharts and Chart.js out of the box, with `LiveCharts::registerEngine()` for custom adapters - **Livewire-native rendering** — single `` component handles mount, hydration, and re-render - **Reactive updates** — bind chart data to Livewire properties; the component re-renders when state changes - **Polling** — `Chart::poll(5000)` + `wire:poll="refresh"` integration with a `livecharts:refreshed` event for userland data hydration - **Interaction events** — `onDataPointClick`, `onZoom`, `onSelection`, `onScroll` map directly to Livewire events - **Broadcasting** — push chart updates over Laravel Echo channels with `broadcastOn()` / `broadcastAs()` - **Theme-aware color tokens** — 289-case `TwColor` enum (all Tailwind v4 families + 4 extensions × 11 shades) with `dark:`/`light:` named-arg API: `->titleColor(dark: TwColor::Amber300, light: TwColor::Amber600)`. Charts re-color live on dark-mode toggle — no Livewire roundtrip - **Palette presets** — `->palette(TwPalette::Vibrant)` auto-fills dataset colors from theme-aware preset schemes - **Typography** — `->titleFont(size: 18, weight: 'bold', family: 'Inter')` for title, legend, and tooltip - **Theme detection** — `auto`, `light`, or `dark` modes; JS observer watches `` (or `prefers-color-scheme`) and re-colors charts live - **Local-first assets with CDN fallback** — engine bundles (`apexcharts.js`, `chartjs.js`) and Chart.js plugin bundles (treemap/matrix/sankey/financial/luxon/adapter-luxon) ship pre-built in `resources/dist`; switch between `local`, `cdn`, or `both` via config - **Vite build pipeline** — lib-mode IIFE outputs for `livecharts.js` + every engine and plugin shim, verified in CI - **Stub publishing** — `livecharts:install` can publish chart class stubs to `stubs/livecharts` for project-level customization - **Browser preview** — `php artisan livecharts:preview` launches a gallery of every chart type in your default browser - **i18n** — ships with `en`, `pt_BR`, and `es` translations - **Type-safe** — PHPStan level 8, PHP 8.2+, strict types throughout Quick Start ----------- [](#quick-start) ``` composer require matheusmarnt/livecharts php artisan livecharts:install ``` This will: 1. Publish `config/livecharts.php` 2. Copy the LiveCharts JS runtime + engine bundles to `public/vendor/livecharts/js` (local-first delivery with CDN fallback by default — `LIVECHARTS_ASSETS_MODE=both`) 3. Optionally publish chart class stubs to `stubs/livecharts` > **Note:** The default asset mode is `both` (local first, CDN fallback). The files in `public/vendor/livecharts/js/` must exist for this to work. If you skip the install step or need to restore the assets after deployment, run: > > ``` > php artisan vendor:publish --tag=livecharts-assets --force > ``` > > > > If you prefer no local files at all, set `LIVECHARTS_ASSETS_MODE=cdn` in `.env` — no publish step needed. Then build a chart and render it: ``` use Matheusmarnt\LiveCharts\Facades\LiveCharts; $chart = LiveCharts::line() ->title('Monthly Revenue') ->labels(['Jan', 'Feb', 'Mar']) ->dataset('2026', [100, 200, 150]) ->colors(['#3B82F6']); ``` ``` ``` Place the asset directive once in your layout, **before `@livewireScripts`** and before the closing `` tag (or in the `` when using a Blade layout with `@extends`/`@section`): ``` {{-- must come BEFORE @livewireScripts — livecharts.js registers Alpine components before Alpine starts --}} @liveChartsScripts @livewireScripts ``` Building Charts --------------- [](#building-charts) ### Fluent builder [](#fluent-builder) Every method returns `$this`, so chains read top-down: ``` LiveCharts::bar() ->title('Sales by Region') ->subtitle('Q1 2026') ->labels(['North', 'South', 'East', 'West']) ->dataset('Sales', [400, 300, 600, 250]) ->colors(['#10B981']) ->stacked() ->height(420) ->theme('auto'); ``` Available factories: `line`, `bar`, `area`, `pie`, `donut`, `radar`, `scatter`, `bubble`, `heatmap`, `rangeBar`, `radialBar`, `polarArea`, `boxPlot`, `treemap`, `candlestick`, `matrix`, `sankey`, plus `make()` for the generic factory. ### Class-based charts [](#class-based-charts) Generate a dedicated class for reusable charts: ``` php artisan make:chart RevenueChart --type=bar ``` ``` namespace App\Charts; use Matheusmarnt\LiveCharts\Charts\Chart; use Matheusmarnt\LiveCharts\Charts\Dataset; class RevenueChart extends Chart { protected string $type = 'bar'; public function __construct() { parent::__construct(); $this ->title('Revenue') ->labels(['Jan', 'Feb', 'Mar']) ->datasets([ Dataset::make('2026')->data([400, 300, 600])->color('#10B981'), ]); } } ``` ``` ``` > **Stubs:** running `livecharts:install` and accepting the stubs prompt publishes the generator stub to `stubs/livecharts/chart.stub`. Edit that file to customize the boilerplate emitted by `make:chart`. Reactive Charts --------------- [](#reactive-charts) ### Polling [](#polling) ``` $chart->poll(5000); // refresh every 5 seconds ``` The Livewire component subscribes via `wire:poll="refresh"` and dispatches a browser event on every tick: ``` window.addEventListener('livecharts:refreshed', (e) => { // e.detail.id — chart DOM id }) ``` Hydrate fresh data inside `refresh()` on a parent Livewire component, or react to the event on the client. ### Click and zoom events [](#click-and-zoom-events) ``` $chart ->onDataPointClick('chart-clicked') ->onZoom('chart-zoomed') ->onSelection('chart-selected'); ``` In the parent component: ``` use Livewire\Attributes\On; #[On('chart-clicked')] public function handle(array $data): void { // $data: ['seriesIndex' => 0, 'dataPointIndex' => 2, 'value' => 150, 'label' => 'Mar'] } ``` ### Broadcasting [](#broadcasting) ``` $chart->broadcastOn('private-charts.'.$user->id)->broadcastAs('chart.updated'); ``` Subscribe via Laravel Echo and the chart re-renders when the channel fires. Multi-Engine ------------ [](#multi-engine) The default engine is `apexcharts`. Override globally in `config/livecharts.php` or per chart: ``` LiveCharts::line()->engine('chartjs')->labels(...)->dataset(...); ``` Register a custom adapter at runtime: ``` use App\LiveCharts\Engines\HighchartsAdapter; use Matheusmarnt\LiveCharts\Facades\LiveCharts; LiveCharts::registerEngine('highcharts', HighchartsAdapter::class); ``` Implement `Matheusmarnt\LiveCharts\Contracts\EngineAdapter` and the engine becomes selectable from any chart. Commands -------- [](#commands) CommandDescription`livecharts:install`Publish config, copy the JS runtime + engine bundles, optionally publish chart stubs`make:chart {name} {--type=} {--engine=}`Generate a new chart class under `app/Charts`; `--type`/`--engine` derived from `Chart::TYPES` and `EngineFactory::names()``livecharts:preview {--no-open}`Open the gallery of every chart type at `/livecharts/preview` in your default browser; `--no-open` only prints the URLDocumentation ------------- [](#documentation) - [Installation guide](docs/installation.md) — step-by-step setup, asset modes, engine selection, customization Testing ------- [](#testing) ``` composer test ``` Runs the Pest suite (301 tests) against the package's testbench harness — including 17 Pest arch rules, payload + adapter routing for every chart type, Livewire color-roundtrip tests (Bugs 1 & 5), ApexCharts themed-color path tests, script-stack idempotency tests, wire:navigate asset strategy tests, and integration tests for UC-01 dashboard, UC-02 drill-down, UC-03 polling, and UC-04 multi-tenant flows. CI matrix: PHP 8.2-8.5 × Laravel 11/12/13 × Livewire 3/4 × prefer-lowest/stable × Ubuntu/Windows, with a `--min=90` coverage gate and PHPStan level 8 enforcement. Changelog --------- [](#changelog) See [CHANGELOG](CHANGELOG.md) for release history. Contributing ------------ [](#contributing) See [CONTRIBUTING](CONTRIBUTING.md) for details. Security -------- [](#security) If you discover a security vulnerability, please email instead of opening a public issue. Credits ------- [](#credits) - [Matheus Mariano](https://github.com/matheusmarnt) - [All Contributors](../../contributors) License ------- [](#license) MIT — see [LICENSE](LICENSE.md). ### Health Score 48 — FairBetter than 94% of packages Maintenance90 Actively maintained with recent releases Popularity21 Limited adoption so far Community9 Small or concentrated contributor base Maturity60 Established project with proven stability Bus Factor1 Top contributor holds 73.2% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~1 days Recently: every ~7 days Total 42 Last Release 51d ago Major Versions v1.19.0 → v2.0.02026-05-02 ### Community Maintainers ![](https://avatars.githubusercontent.com/u/105521310?v=4)[Matheus Mariano — Eng. Software | IA & GovTech](/maintainers/matheusmarnt)[@matheusmarnt](https://github.com/matheusmarnt) --- Top Contributors [![matheusmarnt](https://avatars.githubusercontent.com/u/105521310?v=4)](https://github.com/matheusmarnt "matheusmarnt (131 commits)")[![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?v=4)](https://github.com/github-actions[bot] "github-actions[bot] (42 commits)")[![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4)](https://github.com/dependabot[bot] "dependabot[bot] (6 commits)") --- Tags alpinejsanalyticsapexchartschart-librarychartjschartscomposer-packagedashboarddata-visualizationlaravellaravel-packagelivewirelivewire-3livewire-4livewire-chartslivewire-componentphpphp-packagereactivereal-timelaravellivewirechartjsapexchartsmatheusmarntlivecharts ### Code Quality TestsPest Static AnalysisPHPStan Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/matheusmarnt-livecharts/health.svg) ``` [![Health](https://phpackages.com/badges/matheusmarnt-livecharts/health.svg)](https://phpackages.com/packages/matheusmarnt-livecharts) ``` ### Alternatives [filament/support Core helper methods and foundation code for all Filament packages. 2331.0M270](/packages/filament-support)[spatie/laravel-pdf Create PDFs in Laravel apps 1.0k4.8M48](/packages/spatie-laravel-pdf)[rawilk/profile-filament-plugin Profile & MFA starter kit for filament. 3914.8k](/packages/rawilk-profile-filament-plugin)[andreia/filament-ui-switcher Add a modal with options to switch between different UI layouts and styles (colors, fonts, font sizes). 246.4k](/packages/andreia-filament-ui-switcher)[tomshaw/electricgrid A feature-rich Livewire package designed for projects that require dynamic, interactive data tables. 119.4k](/packages/tomshaw-electricgrid)[a2insights/filament-saas Filament Saas for A2Insights 191.7k](/packages/a2insights-filament-saas) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)