B3nissa
B3nissa

Reputation: 11

I can't change the legend position in Laravel Charts & ChartJS

I am using Laravel Charts (https://charts.erik.cat/) with ChartJS and I'm running into a problem. I can't change the label position in my Chart.

I have tried the below but my label stays on top. I also tried to copy an example on the documentation with tooltips, but that also doesn't work. The backgroundColor function works for some reason.

    $typeChart->dataset('Aantal', 'pie', [$countCustomers, $countProspects, $countColdLeads, $countHotLeads])
            ->options([
                'backgroundColor' => 'green',
                'displayLegend' => true,
                'legend' => [
                    'position' => 'right',
                    'align' => 'right',
                    'display' => true
                ],
                'tooltip' => [
                    'show' => false
                ]
            ]);
    //        $typeChart->options([
    //            'tooltip' => [
    //                'show' => true // or false, depending on what you want.
    //            ],
    //        ]);

Upvotes: 1

Views: 946

Answers (2)

It only works in this order: $chart->options(...)->dataset()

dataset returns the data set which has different options and is on dataset level. ->labels() returns a BaseChart and there the option value works on chart level. If the chain is ->dataset()->options() it doesn't work since the dataset doesn't have a configurable legend.

Upvotes: 0

Giga
Giga

Reputation: 77

I had the same problem - I could not pass some configurations using the "options"-method.

I solved it adding my own method to the UserChart class

namespace App\Charts;

use ConsoleTVs\Charts\Classes\ChartJs\Chart;

class UserChart extends Chart
{
    /**
     * Initializes the chart.
     *
     * @return void
     */
    public function __construct()
    {
        parent::__construct();
    }
    
    public function legendPosition(string $position)
    {
        return $this->options([
            'legend' => [
                'position' => $position,
            ],
        ]);
    }
}

Upvotes: 1

Related Questions