Ошибка Laravel 5 Chart Js при рендеринге нескольких диаграмм в шаблоне блейда - PullRequest
0 голосов
/ 03 мая 2018

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

Laravel Версия: 5.6 Пакет: https://github.com/fxcosta/laravel-chartjs

     $chartjs = app()->chartjs
            ->name('lineChartTest')
            ->type('line')
            ->size(['width' => 400, 'height' => 200])
            ->labels($date)
            ->datasets([
                [
                    "label" => "Gesammelte Coins",
                    'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                    'borderColor' => "rgba(38, 185, 154, 0.7)",
                    "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                    "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                    "pointHoverBackgroundColor" => "#fff",
                    "pointHoverBorderColor" => "rgba(220,220,220,1)",
                    'data' => $coins,
                ]
            ])
            ->options([]);

  $chartjs2 = app()->chartjs
          ->name('lineChartTest')
          ->type('line')
          ->size(['width' => 400, 'height' => 200])
          ->labels($date2)
          ->datasets([
              [
                  "label" => "Gesammelte Coins",
                  'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                  'borderColor' => "rgba(38, 185, 154, 0.7)",
                  "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                  "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                  "pointHoverBackgroundColor" => "#fff",
                  "pointHoverBorderColor" => "rgba(220,220,220,1)",
                  'data' => $coins2,
              ]
          ])
          ->options([]);    


      return view('vendor/voyager/dashboard', [

                                                 'chartjs' => $chartjs,
                                                 'chartjs2' => $chartjs2
     ]);

 //blade template
       <div style="background:#FFF; margin-top:20px;" class="col-md-6">
                   {!! $chartjs->render() !!}
                </div>
                <div style="background:#FFF; margin-top:20px;" class="col-md-6">
                  {!! $chartjs2->render() !!}
               </div>

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

1 Ответ

0 голосов
/ 03 мая 2018

Я думаю, вам нужно изменить свойство name chartjs.

в приведенном выше примере у вас одинаковое имя для 2 графиков.

Итак, просто измените имя свойства:

и первый график дает ей имя: lineChartTestOne

 $chartjs = app()->chartjs
        ->name('lineChartTestOne')
        ->type('line')
        ->size(['width' => 400, 'height' => 200])
        ->labels($date)
        ->datasets([
            [
                "label" => "Gesammelte Coins",
                'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                'borderColor' => "rgba(38, 185, 154, 0.7)",
                "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                "pointHoverBackgroundColor" => "#fff",
                "pointHoverBorderColor" => "rgba(220,220,220,1)",
                'data' => $coins,
            ]
        ])
        ->options([]);

и второй график дает ей имя: lineChartTestTow

$chartjs2 = app()->chartjs
        ->name('lineChartTestTow')
        ->type('line')
        ->size(['width' => 400, 'height' => 200])
        ->labels($date)
        ->datasets([
            [
                "label" => "Gesammelte Coins",
                'backgroundColor' => "rgba(38, 185, 154, 0.31)",
                'borderColor' => "rgba(38, 185, 154, 0.7)",
                "pointBorderColor" => "rgba(38, 185, 154, 0.7)",
                "pointBackgroundColor" => "rgba(38, 185, 154, 0.7)",
                "pointHoverBackgroundColor" => "#fff",
                "pointHoverBorderColor" => "rgba(220,220,220,1)",
                'data' => $coins,
            ]
        ])
        ->options([]);
...