Cara Membuat Grafik di Website

Bagaimana cara membuat grafik diwebsite ? baik pada tulisan kali ini saya akan berbagi cara membuat grafik pada webiste. grafik dapat berupa line, bar, pie dan lain sebagainya. yang akan saya lakukan adalah membuat grafik bar :

yang pertama saya menggunakan template admin LTE 3. didalam koding nya terdapat kombinasi HTML, Java Scrip dan PHP.

            <div class="card">
              <div class="card-header">
                <h3 class="card-title">Statistik Upload Perangkat Pembelajaran</h3>
              </div>
                 <!-- /.card-header -->
              <div class="card-body">
                <div class="row">
                  <div class="col-md-8">
                    <div class="chart-responsive">
                      <canvas id="myGrafik" height="150"></canvas>
                    </div>
                    <!-- ./chart-responsive -->
                  </div>

                  <!-- /.col -->
                </div>
                <!-- /.row -->
              </div>


<script src="<?= base_url('myassets/adminlte') ?>/plugins/chart.js/Chart.min.js">
</script>

        <script>
        var ctx = document.getElementById("myGrafik").getContext('2d');
        var myChart = new Chart(ctx, {
            type: 'pie',
            data: {
                labels: ["SD", "MTS", "WUSTHA", "SMA"],
                datasets: [{
                    label: '',
                    data: [
                    <?php echo
                    $jumlah_teknik = $this->db->query("select * from tbl_pembelajaran 
                    where jenjang_id='2'")->num_rows();
                    ?>, 
                    <?php echo
                    $jumlah_ekonomi = $this->db->query("select * from tbl_pembelajaran 
                    where jenjang_id='3'")->num_rows();
                    ?>, 
                    <?php echo
                    $jumlah_fisip = $this->db->query("select * from tbl_pembelajaran 
                    where jenjang_id='4'")->num_rows();
                    ?>, 
                    <?php echo
                    $jumlah_pertanian = $this->db->query("select * from tbl_pembelajaran
                     where jenjang_id='6'")->num_rows();
                    ?>
                    ],
                    backgroundColor: [
                    'rgba(255, 99, 132, 0.2)',
                    'rgba(54, 162, 235, 0.2)',
                    'rgba(255, 206, 86, 0.2)',
                    'rgba(75, 192, 192, 0.2)'
                    ],
                    borderColor: [
                    'rgba(255,99,132,1)',
                    'rgba(54, 162, 235, 1)',
                    'rgba(255, 206, 86, 1)',
                    'rgba(75, 192, 192, 1)'
                    ],
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero:true
                        }
                    }]
                }
            }
        });
    </script>