Tutorial Highcharts Codeigniter
Holaaa sobat ceplukan, ini nih postingan mengenai update teknologi pertama dari admin. Dasarnya admin memang suka dengan kemajuan teknologi terutama di teknologi informasi yang memudahkan orang dalam melakukan pekerjaanya.
Kali ini admin akan memberikan tutorial menggunakan plugins highcharts yang akan di implementasikan di website framework codeigniter. Seiring perkembangan jaman, untuk memasang plugin yang disediakan pihak ketiga semakin lama semakin mudah. Tinggal download dan tempel sedikit konfigurasi, taraaa jadilah.
Oke tanpa berlama lama, step pertama yang harus dialukan adalah download plugin highchart tentunya di halaman resmi highchart ya.
Silahkan download highcharts terbaru, dalam contoh ini highcharts 7.0.3. Bentuk download nanti berupa zip file yang akan kamu ekstrak ke folder codeigniter. Ada sedikit tips nih untuk penggunaan framework codeigniter, karena sudah menggunakan model MVC (model, view, controller) kamu akan lebih mudah untuk melakukan edit file. Nah untuk lebih mempermudah penggunaan plugin juga, ada baiknya kamu kelompokkan semua plugin yang ada di satu folder misal “plugins” seperti berikut:
Enaknya dengan foldering seperti ini sih misla mau update plugin tidak perlu bingung mencarinya. Oke step selanjutnya testing plugin sudah berjalan di folder aplikasi codeigniter anda atau belum. buat view misal test.php dan copy paste script demo yang disediakan oleh highchart, gambarannya sebagai berikut:
Jangan lupa untuk memanggil file dasar plugin highchart yaitu:
- highcharts/highcharts.js
- highcharts/exporting.js
Dua komponen diatas adalah komponen dasar untuk menampilkan chart simple dan dapat dilakukan export data berbentuk pdf, image atau excel. Beberapa tampilan dasar cari chart udah disediakan oleh highchart diantaranya:
- Line chart (seperti script diatas)
- Area chart
- Column and Bar chart
- Pie chart
dan masih banyak lagi lainnya. Oh iya, highchart ini juga sudah menyediakan fitur 3D untuk format chartnya. Ceplukers hanya perm menambahkan script:
options3d: { enabled: true, }
dibawah type. Nantinya tampilan akan berbentuk grafik 3 dimensi dengan settingan yang dapat ditambahkan sesuai keinginan.
Biasanya admin membuat script pengolahan data yang akan ditampilkan di folder controller supaya dapat dipanggi di file view di folder view. Enaknya melakukan semua proses di controller salah satunya tidak perlu melakukan definisi ulang untuk variable tertentu yang mungkin sudah pernah digunakan untuk menunjukkan data tertentu.
Panggilah id yang sudah didefinisikan di controller shingga tidak banyak script dipakai di view. Nanti kalau ceplukers sudah paham dasar dari implementasi highchart di codeigniter, admin akan memberikan tutorial untuk membuat helper atau library generator highchart sehingga tidak perlu mengulang ulang hal yang sama yaitu memasukkan script highchart. Ceplukers tinggal menginputkan parameter di fungsi yang sudah dibuat dan chart atu grafik akan tampil dengan sendirinya.
Tapi itu nanti setelah mahir menggunakan highchart beserta codeigniter ini. Selamat mencoba buat celpukers apabila ada petanyaan atau butuh penjelasan bisa komen dibawah ya. Maklum admin ceplukan baru dalah hal blog blogan ini. Terimakasih sudah mampir.