06 December 2012

Menggunakan JFreechart untuk membuat Chart pada Aplikasi Swing

Pembaca yang budiman, entah kenapa semakin hari saya semakin gemar mengoprek-oprek Java Swing. Dari mulai mengintegrasikan Spring Framework dengan Swing Framework, sampai yang terakhir saya mencoba bermain-main dengan JFreechart.
JFreechart adalah sebuah tools yang banyak digunakan oleh aplikasi java untuk membuat chart sebagai perspektif lain dari laporan dalam aplikasi bisnis. JFreechart mendukung begitu banyak tipe chart yang bisa kita pakai untuk membuat chart, dari mulai tipe Bar, Line, Pie dan lain-lain. Hadirnya JFreechart membuat aplikasi Java Swing semakin lebih baik dan lebih bervariasi.
Artikel kali ini kita akan memahami pembuatan chart dengan menggunakan JFreechart, kita akan membuat sebuah chart dengan tipe bar, dan data statis yang berisi tentang prosentase pengguna handset. Di akhir percobaan ini, saya mengharapkan para pembaca dapat memahami konsep pembuatan chart ini, dan bisa mengembangkan kembali dengan data yang mungkin lebih dinamis, dan mungkin sesuai dengan keperluan pembaca.
Ok, mari kita langsung saja membuatnya. Siapkan sebuah project menggunakan apache maven sebagai otomatisasi development-nya seperti percobaan-percobaan kita sebelumnya. Kita tambahkan dependency freechart dalam file pom.xml seperti contoh berikut ini:

<dependency>
    <groupId>org.jfree</groupId>
    <artifactId>jfreechart</artifactId>
    <version>1.0.14</version>
</dependency>

Yap, kita menambahkan library jfreechart versi 1.0.14 seperti yang terlihat pada blok dependency diatas.
Langsung saja kita buat sebuah class dengan nama ChartTools, dimana class tersebut berisi properti-properti: String title, String horizontalLabel, String verticalLabel, dan Map paramData. Properti title berfungsi sebagai judul chart kita nantinya, sementara properti horizontalLabel akan berfungsi sebagai label mendatar, dan properti verticalLabel akan berfungsi sebagai label ke atas, dan yang terakhir adalah properti paramData akan berfungsi sebagai penampung data yang akan kita tampilkan dalam chart tersebut.
Kelas diatas bisa kita buat seperti contoh kode dibawah ini:


public class ChartTools {

    private String title;
    private String horizontalLabel;
    private String verticalLabel;
    private Map<String,Number> mapParam;

    //constructor, getter, dan setter dibawah nya..
}

Kemudian kita akan membuat sebuah fungsi yang berisi logic pengolahan data pada class tersebut. Fungsi ini memiliki nilai kembalian (return value) CategoryDataSet yang dimiliki oleh library Jfreechart, dan memiliki parameter Map yang berisi data-data yang ingin kita tampilkan. Berikut kode fungsi tersebut:

private CategoryDataset createDataset(Map<String,Number> paramData){
    DefaultCategoryDataset dataset = new DefaultCategoryDataset();
    for (Map.Entry<String, Number> entry : paramData.entrySet()) {
        dataset.addValue(entry.getValue(),verticalLabel, entry.getKey());
    }
    return dataset;
}

Fungsi diatas bernama createDataset dengan flow logika meng-iterasi/me-loop parameter dan kemudian mengisi variabel dataset dengan key dan value dari parameter tersebut.
Kemudian kita buat sebuah fungsi lagi yang akan berguna meng-generate chart tersebut berdasarkan properti-properti yang tersedia dalam kelas tersebut. Mari kita lihat kode berikut ini:

private ChartPanel createChart() {
    JFreeChart chart = ChartFactory.createBarChart
            (title,                  // chart title
            horizontalLabel,         //yLabel
            verticalLabel,           //xLabel
            createDataset(mapParam), // data
            PlotOrientation.VERTICAL,//orientation
            true,                    // include legend
            true,
            false);

    CategoryPlot cPlot = chart.getCategoryPlot();
    cPlot.setForegroundAlpha(0.5f);
    ChartPanel chartPanel = new ChartPanel(chart);
    chartPanel.setPreferredSize(new Dimension(500, 300));
    return chartPanel;
}

Fungsi diatas adalah flow dimana chart yang berbentuk bar akan dibuat. Yang paling harus kita perhatikan adalah nilai kembalian dari fungsi ini berupa ChartPanel, yang nantinya akan bisa kita letakkan di dalam sebuah JFrame sebab ChartPanel merupakan turunan komponen dari Swing Framework sehingga memungkinkan untuk kita letakkan di dalam JFrame ataupun JPanel pada aplikasi Swing. ChartPanel tersebut juga kita set dimensinya sehingga chart akan bisa tampil dengan dimensi ukuran 500x300.
Oh ya, hampir lupa, kedua fungsi di atas kita tuliskan di class yang sama yaitu kelas ChartTools yang pertama kita buat tadi. Sekarang saatnya kita gunakan fungsi-fungsi tersebut untuk membuat sebuah chart sesuai dengan skenario kita. Perhatikan kode dibawah ini sebagai method utama yang akan menjalankan class tersebut:


public static void main(String[] args) {
    ChartTools tools = new ChartTools();
   
   //create data
    Map<String, Number> mapParam = new LinkedHashMap<String, Number>();
    mapParam.put("IPhone", 25);
    mapParam.put("Android", 45);
    mapParam.put("Blackberry",20);
    mapParam.put("Others", 5);

    //setting masing-masing property class ChartTools
    tools.setMapParam(mapParam);
    tools.setTitle("Testing JFreechart");
    tools.setHorizontalLabel("Jenis Gadget");
    tools.setVerticalLabel("Pengguna");

  //Tampilkan dalam JFrame
    JFrame frame = new JFrame("Freechart Testing");
    frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
    frame.setContentPane(tools.createChart());
    frame.pack();
    frame.setVisible(true);
}

Nah method utama ini bisa kita letakkan di class ChartTools juga atau class lain yang anda bisa buat sendiri. Namun yang paling penting adalah membuat data sampel yang akan digunakan chart tersebut. Bisa pembaca lihat disana bahwa pembuatan datanya hanya semudah itu, dan pembaca bisa mengisinya dengan data statis ataupun data dinamis.
Jika sudah dibuat method tersebut sekarang jalankan file yang berisi method utama yang baru saja kita buat tadi, maka seharusnya akan muncul sebuah tampilan seperti gambar yang berada paling atas pada artikel ini. Silahkan pembaca mengembangkannya sendiri sesuai dengan kebutuhan. Dan link berikut ini adalah file source-code java yang kita buat tadi.




Menteng, 07 Desember 2012

Semoga bermanfaat


Josescalia

7 comments:

Tutorial SEO Terbaru said...

jempol om :) semangat yaa, teruslah berbagi

holil_pro said...

Pake Netbean bisa g om?
Visit me Back

JoseScalia said...

Lah ini bikinnya pake Netbeans...:P

Ajengmas said...

halo om, mau tanya adakah referensi untuk membuat grafik yang datanya diambil dari pilihan (misal combobox)dan database?

trimakasih untuk responnya :)

JoseScalia said...

Kalo referensi sih belum nemu, tapi yang saya bikin diatas bisa dikembangkan pengambilan datanya dari database, saya sendiripun sudah sering menggunakannya, hanya saja memang dalam tutorial ini saya memperkenalkan batasan-batasan fundamental saja..

bang dey said...

mantap, teruskan. biar generasi muda gamelupakan nenek moyang javascript

bang dey said...

mantap.. lanjutkan biar generasi muda tidak melupakan nenek moyang javascript