Grafik_1

<?php
include 'config/konek.php';
echo " <font color=#000>
    <b>Filter Tanggal Berdasarkan ";
echo "<form method=POST action=?module=graph>
    Tanggal Mulai : <input type='text' name='tanggal' size='10'>
    Tanggal Akhir : </b><input type='text' name='tanggal_2' size='10'>
     <input type='submit' name='cari' value='Cari'>
     </form><br>";

$query = "select count(*) as Berhasil from plan where Terlaksana = 'Berhasil'";
$hasil = mysql_query($query);
$data  = mysql_fetch_array($hasil);
$Berhasil= $data['Berhasil'];

// mencari jumlah kegagalan dari database
$query = "select count(*) as Gagal from plan where Terlaksana != 'Berhasil'";
$hasil = mysql_query($query);
$data  = mysql_fetch_array($hasil);
$Gagal = $data['Gagal'];

// menghitung total training
$total = $Berhasil+ $Gagal;

// menghitung presentase berhasil dan gagal
if ($total == 0) {
    echo "Tidak ada Pelatihan yang terjadi";
}else {
$keberhasilan = $Berhasil/$total * 100;
$kegagalan = $Gagal/$total * 100;
}

?>
<html>
        <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                <title>TCH Drop Rate vs TCH Traffic</title>

                <!-- 1. Add these JavaScript inclusions in the head of your page -->
                <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
                <script type="text/javascript" src="js/highcharts.js"></script>

                <!-- 1a) Optional: add a theme file -->
                <!--
                        <script type="text/javascript" src="../js/themes/gray.js"></script>
                -->

                <!-- 1b) Optional: the exporting module -->
                <script type="text/javascript" src="js/modules/exporting.js"></script>


                <!-- 2. Add the JavaScript to initialize the chart on document ready -->
                <script type="text/javascript">

                      var chart;
$(document).ready(function() {
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column'
        },
        title: {
            text: 'Monthly Average Rainfall'
        },
        subtitle: {
            text: 'Source: WorldClimate.com'
        },
        xAxis: {
            categories: [
                'Jan',
                'Feb',
                'Mar',
                'Apr',
                'May',
                'Jun',
                'Jul',
                'Aug',
                'Sep',
                'Oct',
                'Nov',
                'Dec'
            ]
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Rainfall (mm)'
            }
        },
        legend: {
            layout: 'vertical',
            backgroundColor: '#FFFFFF',
            align: 'left',
            verticalAlign: 'top',
            x: 100,
            y: 70,
            floating: true,
            shadow: true
        },
        tooltip: {
            formatter: function() {
                return ''+
                    this.x +': '+ this.y +' mm';
            }
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            }
        },
            series: [{
            name: 'Berhasil',
            data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]

        }, {
            name: 'Gagal',
            data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1]

        }]
    });
});
                </script>

        </head>
        <body>

                <!-- 3. Add the container -->
                <div id="container" style="width: 800px; height: 400px; margin: 0 auto"></div>


        </body>
</html><?php

echo "<b> <h3> Jumlah Pelatihan saat ini : $total pelatihan</h3></b>";
?>