Laravel 11에서 Larapex 차트 패키지를 사용하여 동적 Apexchart를 만드는 방법

이 튜토리얼에서는 larapex-charts 패키지를 사용하여 Laravel 11 애플리케이션 내에서 동적 ApexCharts를 구축하는 방법을 보여줍니다.

JavaScript 차트 라이브러리인 ApexCharts를 사용하면 시각적으로 매력적이고 대화형 웹사이트용 차트를 쉽게 만들 수 있습니다. 다양한 기능을 통해 다양한 차트 유형(막대, 선, 원형 등), 사용자 정의 옵션, 애니메이션 및 대화형 데이터 탐색이 가능합니다. 사용하기 쉽고 매력적인 출력이 인기에 기여합니다.

이 예에서는 샘플 사용자 데이터를 생성하고 올해의 각 달을 나타내는 원형 차트를 표시합니다. 이 차트를 Laravel 11 프로젝트에 통합해 보겠습니다.

Laravel 11에서 Larapex 차트를 사용하여 동적 Apexchart 만들기

1단계: Laravel 11 설정(선택 사항)

이 단계는 아직 Laravel 11 애플리케이션을 생성하지 않은 경우에만 필요합니다. 다음 명령을 사용하십시오:

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

2단계: larapex-charts 패키지 설치

Composer를 통해 arielmejiadev/larapex-charts 패키지를 설치합니다.

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

구성 파일 게시:

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

3단계: 경로 정의

차트 생성을 처리할 경로를 만듭니다. routes/web.php 파일에 다음을 추가하세요:

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

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

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

4단계: 차트 클래스 생성

Charts 디렉터리 내에 app 디렉터리를 만듭니다. 내부에서 다음 코드를 사용하여 MonthlyUsersChart.php을 생성합니다.

<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>

위 내용은 Laravel 11에서 Larapex 차트 패키지를 사용하여 동적 Apexchart를 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!