So erstellen Sie dynamische Apexcharts mit dem Larapex Charts-Paket in Laravel 11

Dieses Tutorial zeigt die Erstellung dynamischer ApexCharts innerhalb einer Laravel 11-Anwendung mit dem Paket larapex-charts.

ApexCharts, eine JavaScript-Diagrammbibliothek, vereinfacht die Erstellung optisch ansprechender und interaktiver Diagramme für Websites. Seine Vielseitigkeit ermöglicht verschiedene Diagrammtypen (Balken, Linien, Kreise usw.), Anpassungsoptionen, Animationen und interaktive Datenexploration. Seine Benutzerfreundlichkeit und die attraktive Ausgabe tragen zu seiner Beliebtheit bei.

In diesem Beispiel werden Beispielbenutzerdaten generiert und ein Kreisdiagramm angezeigt, das jeden Monat des aktuellen Jahres darstellt. Lassen Sie uns dieses Diagramm in Ihr Laravel 11-Projekt integrieren.

Erstellen dynamischer Apexcharts mit Larapex Charts in Laravel 11

Schritt 1: Einrichten von Laravel 11 (optional)

Dieser Schritt ist nur erforderlich, wenn Sie noch keine Laravel 11-Anwendung erstellt haben. Verwenden Sie den folgenden Befehl:

<code class="language-bash">composer create-project laravel/laravel example-app</code>

Schritt 2: Installation des larapex-charts-Pakets

Installieren Sie das arielmejiadev/larapex-charts-Paket über Composer:

<code class="language-bash">composer require arielmejiadev/larapex-charts</code>

Konfigurationsdatei veröffentlichen:

<code class="language-bash">php artisan vendor:publish --tag=larapex-charts-config</code>

Schritt 3: Route definieren

Erstellen Sie eine Route für die Diagrammerstellung. Fügen Sie dies Ihrer routes/web.php-Datei hinzu:

<code class="language-php"><?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ApexchartsController;

Route::get('charts', [ApexchartsController::class, 'index']);</code>

Schritt 4: Erstellen der Diagrammklasse

Erstellen Sie ein Charts-Verzeichnis in Ihrem app-Verzeichnis. Erstellen Sie darin MonthlyUsersChart.php mit dem folgenden Code:

<code class="language-php">
<?php

namespace App\Charts;

use ArielMejiaDev\LarapexCharts\LarapexChart;
use App\Models\User;
use DB;

class MonthlyUsersChart
{
    protected $chart;

    public function __construct(LarapexChart $chart)
    {
        $this->chart = $chart;
    }

    public function build()
    {
        $users = User::select(DB::raw("COUNT(*) as count"), DB::raw("MONTHNAME(created_at) as month_name"))
                    ->whereYear('created_at', date('Y'))
                    ->groupBy(DB::raw("Month(created_at)"))
                    ->pluck('count', 'month_name');

        return $this->chart->pieChart()
            ->set</code>

Das obige ist der detaillierte Inhalt vonSo erstellen Sie dynamische Apexcharts mit dem Larapex Charts-Paket in Laravel 11. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!