Skip to content

Instantly share code, notes, and snippets.

@mkhuda

mkhuda/index.php

Last active December 16, 2015 18:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mkhuda/5475979 to your computer and use it in GitHub Desktop.
Save mkhuda/5475979 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.php
<!DOCTYPE html>
<html>
<head>
<title>Chart Kuesioner</title>
<!-- Meng-embed Google API -->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<!-- Mengembed Jquery -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// Meload paket API dari Google Chart
google.load('visualization', '1', {'packages':['corechart']});
// Membuat Callback yang meload API visualisasi Google Chart
google.setOnLoadCallback(drawChart);
function drawChart() {
var json = $.ajax({
url: 'json.php', // file json hasil query database
dataType: 'json',
async: false
}).responseText;
// Mengambil nilai JSON
var data = new google.visualization.DataTable(json);
var options = {
title: 'Hasil Kuesioner Fakultas',
colors: ['#e6693e'],
width: 800,
height: 600
};
// API Chart yang akan menampilkan ke dalam div id
var chart = new google.visualization.BarChart(document.getElementById('tampil_chart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<!-- Menampilkan dalam bentuk chart dengan ukuran yang telah disesuaikan -->
<div id="tampil_chart" style="width: 500px; height: 500px;"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment