Latest Blog

Membuat kurva persamaan kuadrat pada sebuah diagram kartesian pada dasarnya relatif sederhana apabila menggunakan library simulasiDasar. Kita hanya membutuhkan sebuah variabel untuk koordinat kartesian, dan 3 buah variabel untuk mengatur nilai x dan y pada persamaan kuadrat. Rumus persamaan kuadrat :

y = ax² + bx + c

Dapat kita gambarkan ke dalam koordinat kartesian dengan operasi berulang FOR. Sebagai contoh pada diagram kartesian di atas, dibuat kurva persamaan kuadrat, dan sebuah tombol untuk mengacak nilai a,b dan c. Untuk membuat nya perhatikan langkah-langkah berikut :

Bukalah aplikasi Notepad++. Kemudian, ketikan kode berikut :

<!DOCTYPE html>
<html>
<head>
	<title>Membuat kurva persamaan kuadrat</title>
	<script type="text/javascript" src="http://www.wandah.org/js/simulasiDasar.js"></script>
</head>
<body>
	<center>
	<canvas id="scene" width="800" height="600">
    </canvas>
	</center>
</body>
<script>
	aturCanvas();
	canvas.onmouseup = mouseUp;
	var graf = {startX:50, startY:100, dataW:16, dataH:16, tileW:20, skalaX:1, skalaY:1, desimalX:0, desimalY:0, offsetX:8, offsetY:8, xLabel:'x (cm)', yLabel:'y (cm)', fontLabel:'8pt Calibri', warnaBG:'#daf6fb', warnaGaris:'#000', warnaLabel:'#000'}
 
	var a = 2;	
	var b = 3;		
	var c = 4;
	var op_a = "";
	var op_b = " + ";
	var op_c = " + ";
	var label = "Persamaan Kuadrat: <br> y = "+a+"x<sup>2</sup>"+op_b+b+"x"+op_c+c;
			
	function setSimulasi(){
		//menambahkan background warna
		hapusLayar("#e8e8e8");	
		//menambahkan judul
		teks("Persamaan Kuadrat", 320, 30);		
		//membuat kordinat kartesius
		grafik(graf);
		//titik pusat koordinat kartesian
		var x0 = graf.startX + graf.offsetX*graf.tileW;
		var y0 = graf.startY + graf.offsetY*graf.tileW;
		//membuat teks 
		teksHTML(label, 400, 300, 200, "14pt-Cambria-left-1.6", "#000");
		tombol("Acak", 400, 380, 80, 30, "bold 12pt Calibri", "white", "#12b098", "#12b098", "r");
		//membuat kurva
		var y1 = a*8*8+b*8+c;
		konten.beginPath();
		konten.lineWidth = 2;
		konten.strokeStyle = "red";
		konten.moveTo(x0+8*graf.tileW, y0-y1*graf.tileW);
		for ( var i = -80; i<80;i++){
			var d = i/10;
			y1 = a*d*d+b*d+c;
			konten.lineTo(x0+d*graf.tileW, y0-y1*graf.tileW);
		}
		konten.stroke();
	}
	function mouseUp(event){
		//prosedure mengecek tombol
		var tombolAktif = cekTombol(event);
		if (tombolAktif == "Acak"){
			a = acak(6)-acak(6);
			b = acak(6)-acak(6);
			c = acak(6)-acak(6);
			if (a == 0 && b == 0) a = 2;
			if (a == 0){op_a = ""} else {op_a = a +" x<sup>2</sup> ";}
			if (b == 0){
				op_b = "";
			}else{
				if (b < 0) {op_b = b+"x "} else {
					if (a == 0) {op_b = b+"x "}else {op_b = "+ "+b+"x "}
				}
			}
			if (c == 0){
				op_c = "";
			}else{
				if (c < 0) {op_c = c} else {op_c = "+ "+c;}
			}
			label = "Persamaan Kuadrat: <br> y = "+op_a+op_b+op_c;
			setSimulasi();			
		}
	}
	setSimulasi();
</script>
</html>

Simpan dengan nama tutorial-3.html
Dobel klik file tutorial-3.html tersebut, untuk membukanya dengan internet browser default di komputer anda, maka akan anda dapatkan koordinat kartesian dengan garis persamaan kuadrat seperti pada gambar di atas

Share ( Ayo Berbagi )

Leave me a comment

untuk pertanyaan lebih baik di email langsung ke wandah [at] wandah [dot] com agar cepat direspon