VB – Chart Top Author

Hallo ^^

Setelah berhasil untuk menampilkan jumlah artikel yang dimiliki oleh iRAN, cermi dapat dilihat DISINI. Kali ini Lilis ingin menampilkan diagram dari top author. Pada diagram ini akan terlihat 10 besar author yang paling banyak membuat artikel pada iRAN. Untuk dapat menampilkan diagram ini Lilis masih menggunakan PHP Code. Dibawah ini tampilan dari diagram top author.

Untuk menampilkan diagram top author seperti yang diatas berikut ini Lilis lampirkan source codenya.

<? //CHART POSTING ?>
<!DOCTYPE HTML><html>    <head>        <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>        <title>Dashboard</title>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js”></script>        <style type=”text/css”>${demo.css}        </style>
</head>
<script src=”https://code.highcharts.com/highcharts.js”></script><script src=”https://code.highcharts.com/highcharts-3d.js”></script><script src=”https://code.highcharts.com/modules/exporting.js”></script> <?php $author = “author_aktif”;
//include kedalam file koneksi WP, mungkin didalam iMe sama filenya sepert iniinclude “wp-config.php”;
//Sintak Koneksi mysql$conn = mysql_connect (DB_HOST, DB_USER, DB_PASSWORD ) or die (“tidak bisa connect ke database: ” . mysql_error());mysql_select_db (DB_NAME) or die (“tidak bisa pilih database: ” . mysql_error());
//Situs yang akan dijalankan$site = “iran.ilearning.me”;
//”Query” (di sesuaikan dengan kebutuhan)$sql = “SELECT blog_idFROM wp_blogsWHERE domain =’$site'”;$query=mysql_query($sql);$r = mysql_fetch_array($query);
$sql1 = “SELECT COUNT(ID)-(SELECT COUNT(ID)FROM wp_$r[0]_posts WHERE post_status = ‘publish’ AND post_type = ‘page’) as p, SUM(comment_count) as cFROM wp_$r[0]_posts WHERE post_status = ‘publish’ AND post_type = ‘post'”;$query1=mysql_query($sql1);$r1 = mysql_fetch_array($query1);
$sql2 = “SELECT wp_users.ID,wp_users.user_login, wp_users.display_name,COUNT(wp_$r[0]_posts.post_content) as Post,SUM(wp_$r[0]_posts.comment_count) as Comment,wp_usermeta.meta_valueFROM wp_$r[0]_posts LEFT JOIN wp_usersON wp_$r[0]_posts.post_author = wp_users.IDINNER JOIN wp_usermetaON wp_users.ID = wp_usermeta.user_idWHERE wp_usermeta.meta_key = ‘wp_$r[0]_capabilities’ ANDwp_usermeta.meta_value LIKE ‘%author_aktif%’ ANDwp_$r[0]_posts.post_status = ‘publish’AND wp_$r[0]_posts.post_type = ‘post’ group by wp_users.display_nameORDER BY Post DESC LIMIT 10″;$query2=mysql_query($sql2);
?>
<script type=”text/javascript”>$(function () {    // Set up the chart    var chart = new Highcharts.Chart({        chart: {            renderTo: ‘containerpost’,            type: ‘column’,            options3d: {                enabled: true,                alpha: 0,                beta: 0,                depth: 100,                viewDistance: 25            }        },        title: {            text: ’10 Penulis Artikel Terbanyak’        },        plotOptions: {            column: {                depth: 25            }        }, xAxis: {            categories: [                ‘Penulis’            ]        }, yAxis: {            min: 0,            title: {                text: ‘Jumlah’            }        },        series: [ <?php while($r2=mysql_fetch_array($query2)){ $nama = str_replace(“‘”,””,$r2[‘display_name’]); echo “{ name: ‘”.$nama.”‘,data: [“.$r2[‘Post’].”]},”; } ?>        ]    });
function showValues() {        $(‘#alpha-value’).html(chart.options.chart.options3d.alpha);        $(‘#beta-value’).html(chart.options.chart.options3d.beta);        $(‘#depth-value’).html(chart.options.chart.options3d.depth);    }
// Activate the sliders    $(‘#sliderspost input’).on(‘input change’, function () {        chart.options.chart.options3d[this.id] = this.value;        showValues();        chart.redraw(false);    });
showValues();});        </script><style>#containerpost, #sliderspost {    min-width: 310px;     max-width: 800px;    margin: 0 auto;}#containerpost {    height: 400px; }</style>
<div id=”containerpost”></div>

Untuk mengetahui cara pembuatan diagram seperti diatas menggunakan PHP Code dapat melihat cermi DISINI.

Sekian cermi kali ini. Terima kasih 🙂

Leave a Reply

You must be logged in to post a comment.