Jumat, 11 Juli 2014

Tugas 6 Membuat Grafik Dengan HTML5

Marhaban Ya Ramadhan selamat menunaikan ibadah puasa bagi yang beragama islam.. bismillahirohmanirohim pada kesempatan siang hari ini saya akan memposting cara membuat grafik dengan HTML5. Bagi yang ingin download program jadinya disini.

<!DOCTYPE HTML>
<html lang="en">
<head>
<title>GRAFIK HASIL TES SD NEGERI PENDTIUM</title>
</head>
<body bgcolor="#999999">
<h3 align="center">GRAFIK HASIL TES SD NEGERI PENDTIUM</h3>
<table border =0 align="center" cellspacing=0 cellpadding=10>
<!-- Header -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="35"><b>100</b/</td>
<td bgcolor= "#000000" width="1" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
<td bgcolor= "#999999" width="10" height="35"></td>
</tr>
<!-- Baris data pertama -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data kedua -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data ketiga -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#000000" width="1" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#FF0000" width="10" height="40"></td>
<td bgcolor= "#0000FF" width="10" height="40"></td>
<td bgcolor= "#00FF00" width="10" height="40"></td>
<td bgcolor= "#FFFF00" width="10" height="40"></td>
<td bgcolor= "#00FFFF" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="40"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data keempat -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data kelima -->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"><b>50</b/</td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data keenam-->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data ketujuh-->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data ketujuh-->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data kedelapan-->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>
<!-- Baris data kesembilan-->
<tr>
<!-- Mengatur lebar dan tinggi kolom -->
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#000000" width="1" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#FF0000" width="10" height="5"></td>
<td bgcolor= "#0000FF" width="10" height="5"></td>
<td bgcolor= "#00FF00" width="10" height="5"></td>
<td bgcolor= "#FFFF00" width="10" height="5"></td>
<td bgcolor= "#00FFFF" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
<td bgcolor= "#999999" width="10" height="5"></td>
</tr>

Semoga Bermanfaat. kritik dan saran saya harapkan bagi perbaikan blog serta menambah pengetahuan saya. terima kasih

Sumber : CaramembuatgrafikHTML5.com dan berbagai sumber
Diposting oleh di Tidak ada komentar:
Langganan: Postingan (Atom)