Get Started
Charts

Quick Start ​

You can install the charts package via composer:

bash
composer require settleup/charts

The charts package requires settleup/visualizations which will be installed automatically as a dependency.

Chart Registration ​

Charts are registered using the Route::chart() macro. This should be placed in your routes file:

php
Route::chart(RevenueChart::class);

Usage ​

To create a new chart, define a class that extends the Chart class and implements the required methods. You can use the artisan command php artisan make:chart {name} to scaffold one. Below is a sample chart class:

php
<?php

namespace App\Charts;

use Illuminate\Database\Query\Builder;
use Illuminate\Support\Collection;
use Illuminate\Support\Facades\DB;
use SettleUp\Visualizations\Charts\Abstracts\Chart;
use SettleUp\Visualizations\Charts\Datasets\Bar;
use SettleUp\Visualizations\Charts\Datasets\Line;
use SettleUp\Visualizations\Charts\Labels\Label;
use SettleUp\Visualizations\FloatingFilters\DateRange;

class RevenueChart extends Chart
{
    public function getLabel(): Label
    {
        return Label::make('DATE_FORMAT(orders.created_at, "%Y-%m")', 'Month');
    }

    public function getDatasets(): Collection
    {
        return collect([
            Bar::make('SUM(orders.total)', 'Total Revenue'),
            Line::make('COUNT(orders.id)', 'Order Count'),
        ]);
    }

    public function getQuery(): Builder
    {
        return DB::table('orders')
            ->groupByRaw('DATE_FORMAT(orders.created_at, "%Y-%m")');
    }

    public function getFloatingFilters(): Collection
    {
        return collect([
            DateRange::make('DATE(orders.created_at)', 'Order Date'),
        ]);
    }
}

In this example, the RevenueChart class defines a label for the x-axis (months), two datasets (total revenue as bars and order count as a line), and a floating filter for date range.

Once registered, the following routes will be available. Using RevenueChart as an example:

POST       charts/revenues/data .......................... charts.revenues.data
POST       charts/revenues/schema ........................ charts.revenues.schema