Pembuatan grafik ternyata tidak harus rumit dengan tools tertentu. Grafik masih bisa disiasati dengan menggunakan kombinasi teknik CSS dan HTML. Tentu saja tidak semua grafik dapat dibentuk, karena keterbatasan CSS dan HTML. Disini kita pelajari grafik yang mudah seperti grafik batang/bar, dimana seluruh value akan dibentuk dengan menggunakan Bar. Lihat contoh dibawah ini:

 

Calon 1
Calon 2
Calon 3
Calon 4
Calon 5

 

 

Contoh Grafik Pemilihan Kepala Desa

Pembuatan grafik ini ternyata tidak sulit. Yaitu hanya dengan melakukan pembuatan elemen DIV yang diberi warna tertentu, dan diberi panjang tertentu, yang tentu saja panjangnya nanti akan menyesuaikan dari dalam tabel asal.

Sebagai contoh, apa yang terjadi apa bila kita membuat sintaks seperti demikian:

Calon 1

Calon 2

Calon 3

Calon 4

Calon 5

Hasilnya tentu saja akan langsung seperti tabel di atas. Panjangnya batang akan mengikuti aturan width pada div yang bersangkutan. Grafik tersebut juga dapat kita kombinasikan dengan link href. Grafik tersebut dibuat dengan cara menempatkan sebuah elemen div yang berukuran panjang yang diatur dari database. Div tersebut juga harus rata kiri untuk dapat dibaca dengan jelas

Kita pun dapat membuat grafik dalam posisi vertikal. Hanya saja, karena tabel html memiliki karakter standard rata vertikal tengah, maka kita harus menambahkan valign=bottom

Sebagai contoh adalah sebagai berikut

Calon 1
Calon 2
Calon 3
Calon 4
Calon 5

Hasilnya akan menjadi seperti ini:

Calon 1	Calon 2	Calon 3	Calon 4	Calon 5

Nah ternyata cukup sederhana. Tinggal kita akhirnya dapat melakukan manipulasi angka tersebut dengan menggunakan PHP dan mengambil dari database server MySQL.

Untuk grafik lanjut berbasis image, dapat dilihat di :

https://blogit.bimosaurus.com/2012/04/21/contoh-cara-membuat-grafik-dengan-jpgraph-dengan-php-dan-mysql dan
https://blogit.bimosaurus.com/2012/04/19/contoh-1-dasar-membuat-grafik-dengan-jpgraph-di-php