Pertemuan#03 - Membuat sebuah soal bangun ruang untuk mencari luas permukaan bangun ruang berikut gambar ilustrasi
- Bagian pendukung :
- Mendapatkan sebuah angka acak
function RandomAngkaAtoB(a,b){
var r = a+Math.ceil(Math.random() * b);
return r;
}
- Mengacak isi sebuah array
function RandomMyArray(Arr){
for (var i=0; i<Arr.length; i++){
var r = Math.floor(Math.random() * Arr.length);
var a = Arr[i];
Arr[i] = Arr[r];
Arr[r] = a;
}
return Arr
}
- Mendapatkan nomor urut jawaban benar
function NoJawabanBenar(Arr, jwb){
for (var i=0; i<Arr.length; i++){
if (Arr[i]==jwb){
return i;
break;
}
}
}
- Mendapatkan huruf jawaban
function GetABCD(no){
var ABCD = ["A","B","C","D"]
return ABCD[no]
}
- Memecah n-digit angka menjadi array
function SplitString(ff){
var gg = new Array();
var strff = ""+ff;
var len = strff.length;
for (var i=0; i<len; i++){
gg.push(strff.substr(i,1));
}
return gg;
}
- Membuat angka ribuan menjadi ada titik seperti 1234 menjadi 1.234
function StringRibuan(str){
var strfix = "";
var arfix = new Array();
var StrArray = SplitString(str);
for (var i=0; i<StrArray.length; i++){
arfix.push(StrArray[i]);
}
var ct = 0;
var m = 0;
var n = 0;
var ctmax = StrArray.length;
var arct = new Array();
for (var i=StrArray.length-1; i>=0; i--){
ct++;
ctmax--;
if(ct==3){
ct = 0;
m++;
arct.push(3);
}
}
var n = StrArray.length - 3*arct.length;
var iter=-1;
strfix="";
for (var i=0; i<n; i++){
iter++;
strfix += arfix[iter];
}
if (n>0)
strfix += ".";
for (var i=0; i<m; i++){
for (j=0; j<3; j++){
iter++;
strfix += arfix[iter];
}
strfix += ".";
}
var leng = strfix.length;
strfix = strfix.substr(0, leng-1);
return strfix
}
- Mendapatkan Data soal
function MyFungsi3(){
var pyth = [[4,3,5],[12,5,13],[6,8,10],[24,7,25],[8,15,17]];
var pil = RandomAngkaAtoB(-1,5);
var dd = RandomAngkaAtoB(2,9);
var aa = dd+pyth[pil][0];
do{
var bb = RandomAngkaAtoB(2,4);
var cc = pyth[pil][2];
var tt = pyth[pil][1];
}while(bb==cc);
var luas = 2*(aa+dd)/2*tt + dd*bb + aa*bb + bb*cc + bb*tt;
var luas1 = (aa+dd)/2*tt + dd*bb + aa*bb + bb*cc + bb*tt;
var luas2 = 2*(aa+dd)/2*tt + dd*bb + aa*bb + bb*cc;
var luas3 = 2*(aa+dd)/2*tt + dd*bb + aa*bb + bb*tt;
var luas4 = 2*(aa+dd)*tt + dd*bb + aa*bb + bb*cc + bb*tt;
var ArSisi = [aa,bb,cc,dd];
var benar = luas;
var salah1 = luas1;
var salah2 = luas2;
var salah3 = luas3;
var salah4 = luas4;
var arrSalah = [salah1,salah2,salah3,salah4];
arrSalah = RandomMyArray(arrSalah);
return [ArSisi,benar,arrSalah];
}
- Memasukkan gambar ke canvas
function Gambar3(nmcanvas,Arr){
const canvas = document.getElementById(nmcanvas);
const ctx = canvas.getContext("2d");
// menambahkan image pada canvas //
let base_image = new Image();
base_image.src = "Gambar3.png";
base_image.onload = function () {
ctx.drawImage(base_image, 0, 0,base_image.width, base_image.height);
InsertText(Arr);
}
function InsertText(Arr){
ctx.font = "bold 12px Times New Roman";
ctx.textAlign = "center";
ctx.fillText(Arr[0]+" cm",105,190);
ctx.fillText(Arr[1]+" cm",225,193);
ctx.fillText(Arr[2]+" cm",213,97);
ctx.fillText(Arr[3]+" cm",123,30);
}
return 0;
}
-------------------------------------------
- Bagian utama :
- Program Utama
function GetSoal3(){
const MyData = MyFungsi3();
var ArSisi=MyData[0];
var benar=MyData[1];
var arrSalah=MyData[2];
const DrawPGL = Gambar3("myCanvas3",ArSisi);
var ss
ss = "Luas permukaan bangun tersebut adalah ... ";
var Ar = [];
// jawaban
Ar[0] = benar;
Ar[1] = arrSalah[0];
Ar[2] = arrSalah[1];
Ar[3] = arrSalah[2];
Ar[0] = StringRibuan(Ar[0]);
Ar[1] = StringRibuan(Ar[1]);
Ar[2] = StringRibuan(Ar[2]);
Ar[3] = StringRibuan(Ar[3]);
var jawab = Ar[0];
Ar = RandomMyArray(Ar);
var noBenar = NoJawabanBenar(Ar, jawab);
var textSoal = ss+" <p>A. "+Ar[0]+" cm²<br>B. "+Ar[1]+" cm²<br>C. "+Ar[2]+" cm²<br>D. "+Ar[3]+" cm²</p>";
var ArFix = [];
ArFix.push(textSoal);
ArFix.push(GetABCD(noBenar));
return ArFix;
}
- Nomor soal dan kalimat sebelum gambar
document.write("<p>4. Perhatikan bangun prisma trapesium siku-siku berikut!<p>");
- Menyiapkan canvas untuk gambar
<canvas id="myCanvas3" width="277" height="215" style="border:0px solid grey;"> </canvas>
- Mencetak soal
var ss
ss = GetSoal3();
document.write("<p>"+ss[0]+"</p>");
document.write("Jawaban : "+ss[1]);
-------------------------------------------