Integrate Yii2-Highcharts Using Database

Selamat malam teman-teman, semoga hari ini menyenagkan, ada kalanya ketika membuat report perlu data visual agar mudah menarik kesimpulan dengan cepat, sebenernya kasus ini adalah kasus di kantor dimana teman-teman kesulitan membuat datavisual, nah data visual ini berupa Chart/grafik, lalu bagaimana ya jika kita integrasi chart kita dengan Yii2?

yuk ikut langkah berikut:

Langkah-1, akses ke halaman berikut:
https://github.com/miloschuman/yii2-highcharts

Langkah-2, pada CMD
composer require –prefer-dist miloschuman/yii2-highcharts-widget “dev-master”

Langkah-3, buatlah controller untuk menarik data

$data = Yii::$app->db->createCommand('select 
 regional,
 sum(msisdn) as jmlmsisdn,
 sum(bill_amount_1) as jmlba,
 sum(cb_bill_1) as jmlcb,
 sum(cb_bucket_1) as jmlcbu
 from dash_summary_aging_tracking 
 group by regional')->queryAll();
 //print_r($data);
 return $this->render('diagram', [
 'ddiagram' => $data 
 ]);

Langkah-4, buat view diagram kemudian tampilkan grafik.

<?php

use miloschuman\highcharts\Highcharts;
/* @var $this yii\web\View */

$this->title = 'Monitoring Collection';
 
foreach($ddiagram as $values){ 
 $a[0]= ($values['regional']); 
 $c[]= ($values['regional']); 
 $b[]= array('type'=> 'column', 'name' =>$values['regional'], 'data' => array((int)$values['jmlmsisdn'], 
 (int)$values['jmlba'],(int)$values['jmlcb'], (int)$values['jmlcbu']) ); 
}
 
echo 
Highcharts::widget([
 'options' => [
 'title' => ['text' => 'Monitoring Collection'],
 'xAxis' => [
 'categories' => ['jmlmsisdn', 'jmlba', 'jmlcb', 'jmlcbu']
 ],
 'yAxis' => [
 'title' => ['text' => 'Collection Data']
 ],
 'series' => $b
 ]
]);

Done

Semoga teman-teman dapat terbantu,

Reference:
https://github.com/miloschuman/yii2-highcharts

Advertisements