Kali ini kita coba gunakan Google Charts untuk membuat Grafik Roti (Pie Chart), kita buat pie-chart-google-charts.html dengan isi kode program berikut ini :
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart2);
function drawChart2() {
var data2 = google.visualization.arrayToDataTable([
['Kegiatan', 'Waktu(Jam)'],
['Bekerja', 11],
['Makan', 2],
['Perjalanan', 2],
['Hiburan / TV', 2],
['Tidur', 7]
]);
var options2 = {
title: 'Kegiatan Sehari-Hari'
};
var chart2 = new google.visualization.PieChart(document.getElementById('chart_div2'));
chart2.draw(data2, options2);
}
</script>
</head>
<body>
<div id="chart_div2" style="width: 900px; height: 500px;"></div>
</body>
</html>
Hasilnya seperti ini :
Grafik Pie yang sangat bagus.
Project selengkapnya silakan didownload. Jika kesulitan, caranya mendownloadnya seperti ini.
File HTML tersebut siap disimpan, kemudian klik dua kali dan dijalankan langsung pada Browser dengan syarat komputer dalam keadaan online ke Internet dan menggunakan Web Browser yang populer dan versi terbaru. Misalnya Chrome, Firefox atau Opera.
Semoga bermanfaat.
Tidak ada komentar:
Posting Komentar