How to make Bar Chart in YII Framework (using ext yii.Highcharts)

Hello again everyone, this last few weeks, i’ve been dealing with Graph in Java Web, espescially using D3.js but i’ll share about D3 in my next post may be.

Last time i posted about Yii Framework and now i will add one more post about it. Now, i want to share just a simple post (again) about how to make charts in Yii Framework. Well, may be you notice that i really like to use yii framework to my side-projects (outside of my works in the office building). Yes, i really like it. One of my reason is i can do the things in yii easily and more efficient code. Like one in THIS POST.

Well, back to Highcharts~ On my last projects, turns out that i need to make some graph on it, then, ok i will try some of it. One of the way to make it is using yii extension, and one of the famous one is Yii Highcharts. Well, now i will share about how to using it in my yii projects.

First, we need to download and extract yii.highchart extenstion inside protected/extensions folder. Do not forget to remove the version number in the folder name. Just like this :

Now, we need to modify config/main.php to add yii.highchart extension, on this line :

// autoloading model and component classes
‘import’=>array(
‘application.models.*’,
‘application.components.*’,
‘ext.yii-highcharts.*’,
‘ext.print.*’,
),

then we can use highchart extension like this -> “ext.yii-highcharts.highcharts.HighchartsWidget”

And we’re ready to use our highchart ext.

// BEGIN BAR CHART
$this->widget(‘ext.yii-highcharts.highcharts.HighchartsWidget’, array(
‘options’=>array(
‘chart’=> array(‘defaultSeriesType’=>’column’,),
‘title’ => array(‘text’ => ‘Fruits’),
‘legend’=>array(‘enabled’=>false),
‘xAxis’=>array(‘categories’=>array(‘Apples’, ‘Mangos’, ‘Strawberries’, ‘Grapes’, ‘Oranges’),),
‘yAxis’=> array(
‘min’=> 0,
‘title’=> array(
‘text’=>’Total’
),
),
‘series’ => array(
array(‘data’ => array(10,9,13,15,20))
),
‘tooltip’ => array(‘formatter’ => ‘js:function() {return “<b>”+ this.x +”</b><br/>”+”Fruits : “+ this.y; }’),
‘plotOptions’=>array(‘pie’=>(array(
‘allowPointSelect’=>true,
‘showInLegend’=>true,
‘cursor’=>’pointer’,
)
)
),
‘credits’=>array(‘enabled’=>false),
)
));

And the chart will looks like this :

Also, we can configure more about the chart widgets where you can read more here -> http://www.yiiframework.com/extension/highcharts/

Okay , that’s all. A very very simple post this morning. Btw, i”ve used plugin for syntax highlighter years ago, but looks like it doesn’t appear anymore. T.T

Advertisements

Dependency Injection and Reflection

Yesterday i got some discussion with my Uncle, Mozkuri Eas (not his real name) about mobile application (again) and got some issue about the app i want to built. Then the discussion drive us (again) into “Dependency Injection and Reflection). My uncle said, i have to minimalize my code, he said i have to ensure that i have to split code in individual component that can be run without have any dependency with the other componen.  Separate it, make it as a Lib.

“Try dependency injection and reflection.” That’s the code my uncle said, and then “Artinya cari dan pelajari sendiri” As usual, “autodicact, self-taught” Oke, feni, you’re strong enaugh.

So let’s start gooling and found some good artcile. I don’t mind what programming language to describe dependency injection, i also use different language to my different apps.

“Jangan mengotak-kotakkan dirimu hanya dalam satu bahasa pemrograman, yang penting paham logicnya, Insya Allah yang lain juga bisa. Masalah script paling cuma beda dikit-dikit, logicnya tetap sama. Ga harus hafal semua code juga,  masih buka docsnya atau broswing aja. Fenifa 2017”

In software engineering, Dependency Injection is a design principle in which code creating a new object supplies the other objects that the new object depends upon for operation. This is a special case of inversion of control. Often a dependency injection framework (or “container”) is used to manage and automate the construction and lifetimes of interdependent objects.

A dependency is an object that can be used (a service). An injection is the passing of a dependency to a dependent object (a client) that would use it. The service is made part of the client’s state. Passing the service to the client, rather than allowing a client to build or find the service, is the fundamental requirement of the pattern.

Dependency injection separates the creation of a client’s dependencies from the client’s behavior, which allows program designs to be looselycoupled and to follow the dependency inversion and single responsibility principles. It directly contrasts with the service locator pattern, which allows clients to know about the system they use to find dependencies.

An injection, the basic unit of dependency injection, is not a new or a custom mechanism. It works in the same way that “parameter passing” works. Referring to “parameter passing” as an injection carries the added implication that it’s being done to isolate the client from details.

An injection is also about what is in control of the passing (never the client) and is independent of how the passing is accomplished, whether by passing a reference or a value.

Dependency injection involves four roles:

  • the service object(s) to be used
  • the client object that is depending on the services it uses
  • the interfaces that define how the client may use the services
  • the injector, which is responsible for constructing the services and injecting them into the clien

(source)

Dependency injection simply means receiving collaborators as constructor parameters instead of fetching them ourselves. (source)

Reflection is the ability to introspect and reverse engineer functions, classes, methods and interfaces during runtime. This makes it possible to find specific information about your code, such as a classes internal properties, methods & even doc blocks for those methods.

One of my favourite uses for the Reflection API is to have all of my class dependencies automatically injected when possible. If you’re new to dependency injection, then don’t worry, it’s quite simple. This makes my code cleaner to look at, and far more maintainable as the codebase grows. We’ve recently updated our company starter theme/framework to do just this. I figure it’s something I can show you how to do to. The full code & example can be found at the bottom of this post (TL/DR). (source)

Iseng – Contoh Program Java Sederhana – transfer bank

sekedar iseng sih, bantuin adek kost semester 2 yang lagi belajar object oriented programming. Java nih, udah lama gak megang sih, tapi untuk program sesederhana ini, saya masih lancar lah~~ heuheuheu…  cuma contoh transfer bank sederhana..

public class nasabah{

//deklarasi variabel
private String nama;
private int norek;
private int saldo;
private int jumlah;

public nasabah ( string nama, int norek, int saldo){
this.nama=nama;
this.norek=norek;
this saldo=saldo;
}

//buat method untuk ceksaldo

public void ceksaldo(){
System.out.println(“Nama Anda : “+nama);
System.out.println(“Nomor Rekening Anda : “+norek);
System.out.println(“Saldo Anda Saat Ini : “+saldo);
}

//method setorUang, return valuenya adalah saldo

public int setorUang(int jumlah){
this.jumlah=jumlah;
saldo=saldo-jumlah;
return saldo;
}

//method tarikUang, return valuenya adalah jumlah yg ditarik

public int terimaUang(int jumlah){
this.jumlah=jumlah;
saldo=saldo+jumlah;
return jumlah;
}

public static void main (String args[]){

//buat object dari class nasabah
nasabah nasabah1 = new nasabah (“nasabah 1”,123,500000);
nasabah nasabah2 = new nasabah (“nasabah 2”,123,300000);

nasabah1.ceksaldo();
nasabah2.ceksaldo();

//transfer
int jumlahtransfer=100000;

System.out.println(“====Saldo nasabah setelah transfer sejumlah “+jumlahtransfer+”====”);

nasabah1.tarikUang(nasabah2.terimaUang(jumlahtransfer));

nasabah1.ceksaldo();
nasabah2.ceksaldo();

}

}