Minggu, 19 Januari 2020

PHP GRAFIK ONLINE


  <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Year', 'Bimbel', 'Course'],
          ['2020',  1000,      400],
          ['2018',  1170,      460],
          ['2019',  660,       1120],
          ['2020',  2030,      2540]
        ]);

        var options = {
          title: 'LP2M ARAY GRAPH',
          curveType: 'function',
          legend: { position: 'bottom' }
        };

        var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="curve_chart" style="width: 900px; height: 500px"></div>
  </body>
</html>






  <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Bimbel PHP');
      data.addColumn('number', 'Bimbel Android');
      data.addColumn('number', 'Bimbel 3D / Animasi');

      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  11.7, 18.8, 10.5],
        [5,  11.9, 17.6, 10.4],
        [6,   8.8, 13.6,  7.7],
        [7,   7.6, 12.3,  9.6],
        [8,  12.3, 29.2, 10.6],
        [9,  16.9, 42.9, 14.8],
        [10, 12.8, 30.9, 11.6],
        [11,  5.3,  7.9,  4.7],
        [12,  6.6,  8.4,  5.2],
        [13,  4.8,  6.3,  3.6],
        [14,  4.2,  6.2,  3.4]
      ]);

      var options = {
        chart: {
          title: 'Difficulty Studying and Earnings in Two Weeks of Starting',
          subtitle: 'Level Kesulitan Pembelajaran (Siswa)'
        },
        width: 900,
        height: 500
      };

      var chart = new google.charts.Line(document.getElementById('curve_chart'));

      chart.draw(data, google.charts.Line.convertOptions(options));
    }
   </script>
 </head>
  <body>
    <div id="curve_chart" style="width: 900px; height: 500px"></div>
  </body>
</html>


  <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Guardians of the Galaxy');
      data.addColumn('number', 'The Avengers');
      data.addColumn('number', 'Transformers: Age of Extinction');

      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  11.7, 18.8, 10.5],
        [5,  11.9, 17.6, 10.4],
        [6,   8.8, 13.6,  7.7],
        [7,   7.6, 12.3,  9.6],
        [8,  12.3, 29.2, 10.6],
        [9,  16.9, 42.9, 14.8],
        [10, 12.8, 30.9, 11.6],
        [11,  5.3,  7.9,  4.7],
        [12,  6.6,  8.4,  5.2],
        [13,  4.8,  6.3,  3.6],
        [14,  4.2,  6.2,  3.4]
      ]);


var pilihan2 = {
        chart: {
          title: 'Average Temperatures and Daylight in Iceland Throughout the Year'
        },
        width: 900,
        height: 500,
        series: {
          // Gives each series an axis name that matches the Y-axis below.
          0: {axis: 'Temps'},
          1: {axis: 'Daylight'}
        },
        axes: {
          // Adds labels to each axis; they don't have to match the axis names.
          y: {
            Temps: {label: 'Temps (Celsius)'},
            Daylight: {label: 'Daylight'}
          }
        }
      };
  
      var pilihan1 = {
        chart: {
          title: 'Box Office Earnings in First Two Weeks of Opening',
          subtitle: 'in millions of dollars (USD)'
        },
        width: 900,
        height: 500
      };

      var chart = new google.charts.Line(document.getElementById('curve_chart'));

      chart.draw(data, google.charts.Line.convertOptions(pilihan2));
    }
   </script>
 </head>
  <body>
    <div id="curve_chart" style="width: 900px; height: 500px"></div>
  </body>
</html>




<html>
<head>
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Day');
      data.addColumn('number', 'Guardians of the Galaxy');
      data.addColumn('number', 'The Avengers');
      data.addColumn('number', 'Transformers: Age of Extinction');

      data.addRows([
        [1,  37.8, 80.8, 41.8],
        [2,  30.9, 69.5, 32.4],
        [3,  25.4,   57, 25.7],
        [4,  11.7, 18.8, 10.5],
        [5,  11.9, 17.6, 10.4],
        [6,   8.8, 13.6,  7.7],
        [7,   7.6, 12.3,  9.6],
        [8,  12.3, 29.2, 10.6],
        [9,  16.9, 42.9, 14.8],
        [10, 12.8, 30.9, 11.6],
        [11,  5.3,  7.9,  4.7],
        [12,  6.6,  8.4,  5.2],
        [13,  4.8,  6.3,  3.6],
        [14,  4.2,  6.2,  3.4]
      ]);

      var options = {
        chart: {
          title: 'Box Office Earnings in First Two Weeks of Opening',
          subtitle: 'in millions of dollars (USD)'
        },
        width: 900,
        height: 500,
        axes: {
          x: {
            0: {side: 'top'}
          }
        }
      };

      var chart = new google.charts.Line(document.getElementById('line_top_x'));

      chart.draw(data, google.charts.Line.convertOptions(options));
    }
  </script>
</head>
<body>
  <div id="line_top_x"></div>
</body>
</html>


DB
<?php
require_once"konmysqli.php";
$tbrsl="tb_rsl";


$i=0;
 $sql="select distinct(id_site) from `$tbrsl` order by `id_rsl` asc";
 $jum=getJumM($conn,$sql);
  $arr=getDataM($conn,$sql);
$max=0;
foreach($arr as $d) {
$id_site=$d["id_site"];
$arID[$i]=$id_site;
$arNM[$i]="S".getSite($conn,$id_site);

$j=0;
$sqlv="select `out_3` from `$tbrsl`  where `id_site`='$id_site'";
$jumv=getJumM($conn,$sqlv);
$arJUM[$i]=$jumv;
$arrv=getDataM($conn,$sqlv);
foreach($arrv as $dv) {
$ar[$i][$j]=rand(10,100);//$dv["out_3"];
$j++;
}
if($max<$jumv){$max=$jumv;}
$i++;
}

for($j=0;$j<$i;$j++){
$awal=$arJUM[$j];
for($k=$awal;$k<$max;$k++){
$ar[$j][$k]=$ar[$j][$k-1];
}
}


for($j=0;$j<$i;$j++){
for($k=0;$k<$max;$k++){
//echo "$j-$k=".$ar[$j][$k]."<br>";
}
}
?>

 <html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">

      google.charts.load('current', {'packages':['line']});
      google.charts.setOnLoadCallback(drawChart);

    function drawChart() {

      var data = new google.visualization.DataTable();
      data.addColumn('number', 'Site');
  <?php
  $gab="";
    for($i=0;$i<$jum;$i++){
?>
data.addColumn("number", "<?php echo $arNM[$i];?>");
<?php
}
  for($i=0;$i<$max;$i++){
  $no=$i+1;
  $gab2="";
  for($j=0;$j<$jum;$j++){
$gab2.=",".$ar[$j][$i]; 
  }
  $gab.="[$no  $gab2],";
  }
$gab=substr($gab,0,strlen($gab)-1);
  ?>
   
   
      data.addRows([<?php echo $gab;?>]);

      var options = {
        chart: {
          title: 'Difficulty Studying and Earnings in Two Weeks of Starting',
          subtitle: 'Level Kesulitan Pembelajaran (Siswa)'
        },
        width: 900,
        height: 500
      };

      var chart = new google.charts.Line(document.getElementById('curve_chart'));

      chart.draw(data, google.charts.Line.convertOptions(options));
    }
   </script>
</head>
  <body>
    <div id="curve_chart" style="width: 900px; height: 500px"></div>
  </body>
</html>




<?php
 echo $gab;
 ?>






















































Tidak ada komentar:

Posting Komentar

global_priv WARNING Selalu

 Jika muncul pesan kesalahan: Warning in .\libraries\classes\Dbal\DbiMysqli.php#209  mysqli::query(): (HY000/1034): Index for table 'glo...