Jika ingin menampilkan data dalam sebuah chart pada web anda tidak perlu repot untuk belajar coding dan scripting. Dengan Dreamweaver dan addon FusionCharts for Dreamweaver anda sudah bisa membuat Chart yang menarik. Dreamweaver Tutorial kali ini akan share cara Membuat Chart Dengan FusionCharts For Dreamweaver .Berikut tutorialnya.
Buka Dreamweaver dan buat halaman baru simpan dengan nama chart.asp (ASP Vbscript) , jangan lupa sebelumnya harus melakukan langkah Define Site dan membuat Koneksi Database terlebih dahulu.
Buat Recordset baru, pilih mode Advanced selanjutnya ketik query nya dan jangan lupa di Test
Jika recordset tersebut sudah dibuat, masuk ke menu Insert -- FusionCharts For DW -- Insert Dynamic Simple Chart
Pada Tab Data- Step 1- Select Data Source pilih opsi Use Data From Already Defined Recordset, pada Step 2 Configure Data Source, pada bagian Define Category pilih Recordset dengan nama recordset yang telah kita buat, Isi Column dengan Field Data hasil query yang ingin dijadikan sebagai sumbu X nya, disini saya isi dengan Field THTUNGG, selanjutnya pada Define Series pilih Recordset dengan nama recordset yang telah kita buat, Isi Column dengan Field Data hasil query, disini saya isi dengan Field BAYAR sebagai sumbu Y nya
Selanjutnya Pilih Tab Chart Selection, pilih Chart Colum 3D, selanjutnya pada bagian Chart Preset pilih True Values untuk menampilkan data secara utuh, pada bagian Style Presets dan Color Schemes bisa dipilih sesuai selera.
Selnjutnya Pilih Tab General Options, isi Chart Name dengan nama bebas, Isi Caption dan Subcaption sesuai Judul Chart, selanjutnya klik Ok sampai Finish sehingga hasilnya seperti gambar berikut
Ketika dipreview hasilnya seperti gambar di bawah.. Selamat Mencoba
3 komentar
saya sudah mencoba langkah-langkahnya namun pada step2 configure data source recordset muncul tapi coloum nya kosong begitu juga define series colomn tidak muncul (kosong)
Min gmana kalo semua langkah udah di coba tapi keluar peringatan server eror itu gmana min..
ada screen shootnya?
EmoticonEmoticon