Jika teman-teman mempunyai kesulitan untuk membuat sebuah grafik dengan menggunakan PHP, kalian dapat mencoba cara lain dengan menggunakan jQuery. Salah satu plugin jQuery yang dapat membantu kita untuk membuat sebuah grafik yaitu Plugin Fusion Chart. Dengan plugin tersebut kita hanya perlu membuat sebuah tabel yang berisi data-data yang akan dibuat grafiknya, kemudian Fusion Chart akan langsung meng-generate tabel tersebut menjadi sebuah grafik.
Cara penggunaan Plugin Fusion Chart dapat dilihat pada script berikut.
Perhatikan pada kode script jQuery-nya.
$('#myHTMLTable').convertToFusionCharts({swfPath: "Charts/",type: "MSColumn3D",data: "#myHTMLTable",dataFormat: "HTMLTable",});
Di situ terdapat 4 buah parameter, yaitu:
- swfPath, merupakan lokasi URL file swf diletakkan.
- type, merupakan jenis grafik yang digunakan. Di contoh ini kita menggunakan grafik kolom 3D.
- data, merupakan id tabel yang akan di-generate menjadi grafik.
- dataFormat, merupakan jenis data yang digunakan. Di contoh ini karena kita menggunakan data dari tabel, maka dataFormat-nya berupa HTMLTable.
Gimana teman menurut kalian? Kalau ada yang kurang jelas silakan kunjungi situsnya di http://www.fusioncharts.com/jquery/. Di situ juga menyediakan dokumentasi yang cukup lengkap lho tentang Plugin Fusion Chart.
Semoga bermanfaat.
24 Comment:
hmm mantabh ini bang.. thx infonya
gimana kalau tabelnya dinamis, alias menggunakan database. Saya pernah coba, tapi gak muncul chartnya.???
Sudah pernah saya coba bisa kok sob, caranya tinggal ganti saja angka2nya dengan variabel PHP yang nilainya berasal dari database.
Seumpama masih belum jelas, silakan bisa kirim contoh coding+database nya ke email saya. Insyaalah nanti akan saya bantu.
iy, pakai database bisa, lalu panggil data nya lewat PHP. tp, klo saya mau tablenya ga muncul bisa ga? jd yg muncul hanya grafiknya aja.
thx
kalau nampilin grafik yang isi nya kita select dari combo gimanan gan, misalnya nampilin grafik pertahun,
gimana tu..?
bantuin gan..?
hee david.reflexs@gmail.com
Saya juga pake cara ini gan..:)
tp saya pingin menghilangkan 2 angka di belakang koma.
ktanya bisa pke atribut decimal precision di set 0.,
tapi saya bingung menempatkan-y dimana klo pke cara ini..
Mohon pencerahannya yah...
mkasih sebelum-y..:)
nLs:
Bisa diakali pakai CSS.. Kalo pakai contoh diatas, id tablenya adalah myHTMLTable, maka kode CSSnya seperti ini:
#myHTMLTable{ display: none; }
thanks for sharing .... bermanfaaat gan ...
Kalo grafik pie ada modelnya nga? tks
kenapa flash.??
mas kalo ukuran grafiknya bisa diatur ga ya>?
saya pake fusion chart tapi menu drop down nya malah gak muncul kenapa ia. . .
wah, makasih banget mas tutorialnya, sangat membantu sekali dalam pembuatan skripsi saya, salam kenal. :D
kalo nilai 3000 menjadi 3,00K, gimana kalo untuk merubah angka sesuai data, dan menghilangkan decimal juga ya.. thx
admin: bisa, caranya dengan menambahkan parameter width, contoh: width: "600".
heru: menu drop-down yang mana ya?
elfridatse2: sama-sama.. terimaksih juga sudah mau berkunjung. Salam kenal :))
Gan gimana kalo untuk merubah angka sesuai data??
ex: 382822 // data aslinya
menjadi 382,82k
pertanyaan yang sama, jika nilai 1000 kom menjadi 1k ya? gimana caranya biar angka 1000 tetep menjadi 1000 bukan 1k?? mohon pencerahan dari agan2 semua.. :D
Gan Kalo di Codeigniter gmana gan.. Saya coba kok file .swf nya ga mau keload ya.. Padahal directori swfnya uda bener.. Mohon pencerahannya.. Trims..
Uda Bisa ga... Keep Share.. Suwun... :D
makasi ya om untuk infonya
great..
check your number in http://historynumber.com
saya coba kok ngga muncul grafiknya ya, padahal saya sudah download filenya yg Folder Charts sama Folder JS..
atau ada yg kurangnya,, cuma muncul judul sama Tabel nya aja, grafik nya ngga muncul...
Mohon penjelasannya..
mantap nih ilmu php nya, makasih infonya mas bro?
thank's for your information...
visit me...
http://pcomtricks.blogspot.com
gan mau tanya, ane dah buat grafik dengan jquery tapi kok pas ane hosting gak muncul ya gan grafiknya, tapi kalo lacal mau. ada yang bisa bantu gk. makasih sebelumnya
Post a Comment