CARA MEMBUAT DIAGRAM LINGKARAN ( PIE ) DENGAN PHP DAN DATABASE MYSQL
 |
| Diagram Lingkaran Organisasi Kesenian |
Selamat Datang di Blog Orang IT . Postingan saya sebelumnya membahas bagaimana membuat Diagram Batang dengan PHP dan MySql . Postingan kali ini masih dengan Database yang sama saya akan membahas Cara membuat Diagram Lingkaran Pie dengan PHP dan database MySql .
Bahan :
Soal :
 |
| Isi Tabel Seniman |
 |
| Field Tabel Seniman |
// Buat Koneksi
<?php
$host = ‘localhost’;
$user = ‘root’;
$pass = ”;
$db = ‘registerkesenian’;$conn = mysql_connect($host, $user, $pass);
mysql_select_db($db, $conn);
?>
// Load Jquery
<div id=”tooplate_main”>
<script type=”text/javascript” src=”js/jquery1.min.js”></script>
<script type=”text/javascript”>
$(function () {$(document).ready(function () {
// Buat diagram lingkaran
$(‘#container’).highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: ‘Jumlah Organisasi Seniman’
},
tooltip: {
// Tampilkan dalam bentuk persen
pointFormat: ‘{series.name}: <b>{point.percentage:.1f}%</b>’
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: ‘pointer’,
dataLabels: {
enabled: false
},
showInLegend: true
}
},
series: [{
type: ‘pie’,
name: ‘Data Check List’,
data: [
// Query Perbatang untuk menampilkan data berdarkan kategori yang dipilih
[‘Jaranan’, <?php
$result = mysql_query(“SELECT * FROM seniman WHERE namaorga like ‘%jaranan%’ “);
$num_rows = mysql_num_rows($result);
echo $num_rows; ?>.0],
[‘Kuda Lumping’, <?php
$result = mysql_query(“SELECT * FROM seniman WHERE namaorga like ‘%kuda%'”);
$num_rows = mysql_num_rows($result);
echo $num_rows; ?>.0],
[‘Tari’, <?php
$result = mysql_query(“SELECT * FROM seniman WHERE namaorga like ‘%tari%'”);
$num_rows = mysql_num_rows($result);
echo $num_rows; ?>.0],
[‘Helmy’, <?php
$result = mysql_query(“SELECT * FROM seniman WHERE namaorga like ‘%helmy%'”);
$num_rows = mysql_num_rows($result);
echo $num_rows; ?>.0],
]
}]
});
});});
</script>
</head>
<body>
// Supaya tampilanya 3D gunakan plugin Highcart
<script src=”js/highcharts.js”></script>
<div id=”container” style=”min-width: 310px; height: 400px; max-width: 900px; margin: 0 auto”></div>
3. Hasilnya seperti gambar dibawah :
|
| Diagram Lingkaran Organisasi Kesenian |
 |
| Diagram Lingkaran Organisasi Kesenian 2 |
Hasilnya seperti gambar diatas , tentunya menggunakan plugin highcart agar hasilnya bagus dan 3D . Jika anda ingin mencoba silahkan Download Diagram Lingkaran PHP helmykkediri lengkap dengan Plugin Highcart + Database dan JQuery melalui link dibawah ini
