@extends('layouts.dashboard.app')

@section('style')
    <style>
        .hide {
            display: none;
        }
    </style>
@endsection
@section('content')
    <div class="row">
        <div class="card">
            <div class="card-body">
                <div class="col-12">
                        <div class="col-8">
                            <canvas id="linechart"></canvas>
                        </div>
                    {{-- @elseif ($d =='d2') --}}


                </div>
            </div>
        </div>
    </div>
@endsection
@section('script')
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>

    <script>
        var month = {!! json_encode($month) !!};
        var avg = {!! json_encode($avg) !!};

        const ctx = document.getElementById('linechart');

        new Chart(ctx, {
            type: 'line',
            data: {
                labels: month,
                datasets: [{
                    label: '',
                    data: avg,
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    y: {
                        beginAtZero: true
                    }
                }
            }
        });
    </script>
@endsection
