Charts & Plugins

Charts, calendars, maps and rich inputs are powered by optional JavaScript libraries that AdminLTE 4 for Laravel lazy-loads. A plugin's assets are only emitted on pages that actually use it, keeping the base layout lean — managed by the PluginManager singleton and the @pluginStyles / @pluginScripts Blade directives.

Components auto-enable their plugin

Plugin-backed components call PluginManager::enable() in their constructor, so simply using the component on a page emits the right assets — no config or manual wiring required:

A chart in two lines

<x-adminlte-chart type="bar"
    :series="[['name' => 'Sales', 'data' => [30, 40, 35, 50]]]"
    :categories="['Q1', 'Q2', 'Q3', 'Q4']" height="320px" />

<x-adminlte-calendar :events="[
    ['title' => 'Launch', 'start' => '2026-06-01'],
]" height="600px" />

<x-adminlte-vector-map map="world_merc"
    :markers="[['name' => 'London', 'coords' => [51.5, -0.12]]]" height="450px" />

Each component serializes its config to a data-*-config attribute; the published resources/js/adminlte.js feature-detects the global library and initializes matching elements on DOM-ready (charts via [data-apexchart], maps via [data-jsvectormap], etc.).

The plugins config

Each plugin is defined under the plugins key in config/adminlte.php, with enabled, an optional css, and a js path (string or array). Paths resolve via asset(), relative to public/:

'plugins' => [
    'apexcharts' => [
        'enabled' => false,
        'js' => 'vendor/apexcharts/apexcharts.min.js',
    ],
    'jsvectormap' => [
        'enabled' => false,
        'css' => 'vendor/jsvectormap/jsvectormap.min.css',
        'js' => [
            'vendor/jsvectormap/jsvectormap.min.js',
            'vendor/jsvectormap/maps/world.js',   // loads the 'world' map
        ],
    ],
],

Set enabled => true to load a plugin on every page; otherwise it loads only when a component turns it on. Drive it manually from a view if needed:

@php app(\ColorlibHQ\AdminLte\Plugins\PluginManager::class)->enable('apexcharts'); @endphp

Vendor files

php artisan adminlte:install copies the JS-only plugins (ApexCharts, jsVectorMap, FullCalendar, SortableJS) and the AdminLTE RTL stylesheet from node_modules into public/vendor/. The remaining plugins (Flatpickr, Tom Select, Tabulator, Quill) are bundled through Vite and are disabled by default — install them only when you enable them:

npm install -D flatpickr@^4.6 tom-select@^2.4 tabulator-tables@^6.0 quill@^2.0