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