Display pie-chart based on spendings per tag at reports view
MODIFY
app/Http/Controllers/ReportsController.php
app/Http/Controllers/ReportsController.php
@@ -13,6 +13,7 @@ class ReportsController extends Controller {
$currentYear = date('Y');
+ //
$monthlyEarnings = [];
for ($i = 1; $i <= 12; $i ++) {
@@ -25,6 +26,32 @@ class ReportsController extends Controller {
$monthlySpendings[] = $user->spendings()->whereRaw('MONTH(date) = ?', [$i])->sum('amount');
}
- return view('reports', compact('currentYear', 'monthlyEarnings', 'monthlySpendings'));
+ //
+ $tl = [];
+ $tc = [];
+ $td = [];
+
+ foreach ($user->spendings()->whereNotNull('tag_id')->get() as $spending) {
+ $hit = null;
+
+ for ($i = 0; $i < count($tl); $i ++) {
+ if ($tl[$i] == $spending->tag->name) {
+ $hit = $i;
+
+ break;
+ }
+ }
+
+ if (!is_numeric($hit)) {
+ $tl[] = $spending->tag->name;
+ $tc[] = '#' . dechex(rand(0x000000, 0xFFFFFF));
+ $td[] = $spending->amount;
+ } else {
+ $td[$i] += $spending->amount;
+ }
+ }
+
+ //
+ return view('reports', compact('currentYear', 'monthlyEarnings', 'monthlySpendings', 'tl', 'tc', 'td'));
}
}

MODIFY
resources/views/reports.blade.php
resources/views/reports.blade.php
<h1>Reports for {{ $currentYear }}</h1>
</div>
<div class="wrapper spacing-top-large spacing-bottom-large">
+ <div class="row gutter">
+ <div class="column">
<div class="box">
<div class="section">
<canvas id="earningsSpendingsChart"></canvas>
</div>
</div>
</div>
+ <div class="column">
+ <div class="box">
+ <div class="section">
+ <canvas id="tagsChart"></canvas>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
@endsection
@section('scripts')
data: {!! json_encode($monthlyEarnings) !!},
borderColor: 'rgba(151, 206, 86, 1)',
backgroundColor: 'rgba(151, 206, 86, .1)'
- },
-
- {
+ }, {
label: 'Spendings',
data: {!! json_encode($monthlySpendings) !!},
borderColor: 'rgba(255, 95, 94, 1)',
}
}
});
+
+ var context2 = document.getElementById('tagsChart').getContext('2d');
+
+ var chart2 = new Chart(context2, {
+ type: 'pie',
+
+ data: {
+ labels: {!! json_encode($tl) !!},
+
+ datasets: [{
+ backgroundColor: {!! json_encode($tc) !!},
+ data: {!! json_encode($td) !!}
+ }]
+ },
+
+ options: {
+ animation: {
+ duration: 0
+ }
+ }
+ });
</script>
@endsection

Display pie-chart based on spendings per tag at reports view