Как использовать плагины в chartjs и laravel chart consoletvs / chartsjs

Question

Нужно использовать метки данных плагина chartjs в laravel 5.8 и consoletvs / chartsjs ver 6. *

Эта строка генерирует ошибку в laravel.

$диаграммы-> плагины (['datalabels' => ['color' => '# 223388']]);

    $chart = new Chart;
    $chart->labels($arrHora);
    $chart->dataset('Propostas Por Hora','bar', $arrQtdHora)
          ->backgroundColor('#64b5f6');
    $chart->options([
        'responsive' => true,
        //'aspectRatio' => 1,
        'tooltips' => ['enabled'=>false],
        'legend' => ['display' => false],
        'scales' => [
            'yAxes'=> [[
                        'display'=>false,
                        'ticks'=> ['beginAtZero'=> true],
                        'gridLines'=> ['display'=> false],
                      ]],
            'xAxes'=> [[
                        'categoryPercentage'=> 0.55,
                        //'barThickness' => 100,
                        'barPercentage' => 0.5,
                        'ticks' => ['beginAtZero' => true],
                        'gridLines' => ['display' => false],
                      ]],
        ],
    ]);
    $chart->plugins(['datalabels'=>['color'=>'#223388']]);
     //dd($chart);
            //->backgroundColor('#64b5f6');
    return view('dashboard', ['chart' => $chart]);

Answer 1

Я поделюсь здесь полным решением моего кода, и если у вас есть какие-либо комментарии или предложения, вы будете рады.

/ * Контроллер * /

<?php
namespace App\Http\Controllers\dashboard;
use Illuminate\Http\Request;
use App\Http\Controllers\Controller;
use Illuminate\Support\Facades\Auth;
use ConsoleTVs\Charts\Classes\Chartjs\Chart;
use DB;
class DashBoardController extends Controller
{
  public function index() {
$result = DB::select('select 
                            convert(varchar(10),data_da_solicitacao,121) data,
                            convert(varchar(2),data_da_solicitacao,114) hora,
                            COUNT(id_controle_proposta_pac) qtdHora
                            from contact_std_parceiros_propostas (nolock) p
                            where convert(varchar(10),data_da_solicitacao,121) between convert(varchar(10),getdate(),121) and convert(varchar(10),getdate(),121) 
                            and not exists (select * from contact_std_parceiros_propostas_fora (nolock) f where f.id_controle_proposta_pac = p.id_controle_proposta_pac)
                            Group by convert(varchar(10),data_da_solicitacao,121), convert(varchar(2),data_da_solicitacao,114)
                            Order by 1');

    $arrHora = array();
    $arrQtdHora = array();
    $i = 0;
    foreach ( $result as $r )
    {
        $arrHora[$i] = $r->hora;
        $arrQtdHora[$i] = $r->qtdHora;
        $i++;
    }
        $chart = new Chart;
        $chart->labels($arrHora);
        $chart->dataset('Propostas Por Hora no dia de hoje','bar', $arrQtdHora)->backgroundColor('#64b5f6');
        $chart->options([
            'responsive' => true,
            'legend' => ['display' => true],
            'tooltips' => ['enabled'=>true],
            //'aspectRatio' => 1,
            'scales' => [
                'yAxes'=> [[
                            'display'=>false,
                            'ticks'=> ['beginAtZero'=> true],
                            'gridLines'=> ['display'=> false],
                          ]],
                'xAxes'=> [[
                            'categoryPercentage'=> 0.8,
                            //'barThickness' => 100,
                            'barPercentage' => 1,
                            'ticks' => ['beginAtZero' => true],
                            'gridLines' => ['display' => false],
                          ]],
            ],
            'plugins' => '{datalabels: {color: \'red\'}}',
        ]);
        return view('dashboard',compact('chart'));
    }
}

/ * просмотр * /

@extends('layout.main')
@section('titulo','Pac - DashBoard')
@section('conteudo')
<div class="row">
    <div class="col s6 col m12 l12">
        <div class="x_panel">
            <div class="x_title">
                <div class="col s6 m6 l6"><h2>Propostas do dia</h2></div>
                <ul class="nav navbar-right panel_toolbox">
                    <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                    <li><a class="close-link"><i class="fa fa-close"></i></a></li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content" style="display: block;">
                <div class="row">
                    <div class="row top_tiles" id="card-0"></div>
                    <div class="row">
                        <div class="col s4 m7 l7">
                            <div id="graph-0" class="x_panel" style="height: 250px">   
                                <!--<canvas id="bar-0" style="width: 70% !important;height: auto !important;">-->
                                 {!! $chart->container() !!} 
                                @foreach($chart->plugins as $plugins)
                                        @include($chart->pluginsViews[$plugins])
                                  @endforeach 

                                <!--</canvas>-->
                            </div> 
                        </div> 
                        <div class="col s3 m5 l5">
                            <div id="graph-1" class="x_panel">
                                <canvas id="pie-1" style="width: 100% !important;height: auto !important;"></canvas>
                            </div> 
                        </div> 
                    </div> 
                </div>
            </div>
        </div>
    </div>
</div>
{!! $chart->script() !!}
@endsection

Answer 2

Две вещи, которые я должен уточнить, поиграв с библиотекой, я получил следующие результаты:

Первый: Функция $chart->plugins используется только для создания inline plugins, в файле chartjs / script.blade.php файл начинается с:

Таким образом, для каждого определяемого вами массива plugin он будет загружать представление из массива pluginsView с тем же именем, но я думаю, что он еще не полностью разработан, и поскольку вопрос не в этом. давайте двигаться дальше.

Второе: Вы можете прекрасно использовать вложенный вариант, используя options -> plugin, как я предлагал ранее, но есть одна вещь, с которой вам придется быть осторожным, это то, что «плагины» не могут быть массив, как и другие, и вот почему:

Функция ожидает, что строка будет напечатана в необработанном виде, поэтому вы можете использовать что-то вроде:

$chart->options([
    //...
    'plugins' => '{datalabels: {color: \'red\'}}',
    //...
]);

Который будет работать как положено: