Pertemuan#06 - Membuat sebuah soal bangun ruang dimana ada 4 pilihan dalam 1 gambar sprite
- 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]
}
- Mendapatkan Data soal
function MyFungsi6(){
var pil = RandomAngkaAtoB(-1,4);
var arrSalah = [32,
28,
24,
20
]
var ArSisi = [pil];
var benar = arrSalah[pil];
do{
var arrSalah = RandomMyArray(arrSalah);
var ff1 = arrSalah[0]==benar || arrSalah[1]==benar || arrSalah[2]==benar;
}while(ff1);
return [ArSisi,benar,arrSalah];
}
- Memasukkan gambar ke canvas
function Gambar6(nmcanvas,Arr){
const canvas = document.getElementById(nmcanvas);
const ctx = canvas.getContext("2d");
// menambahkan image pada canvas //
let base_image = new Image();
base_image.src = "Gambar6.png";
base_image.onload = function () {
ctx.drawImage(base_image, 0, 0-Arr[0]*142,base_image.width, base_image.height);
}
return 0;
}
-------------------------------------------
- Bagian utama :
- Program Utama
function GetSoal6(){
const MyData = MyFungsi6();
var ArSisi=MyData[0];
var benar=MyData[1];
var arrSalah=MyData[2];
const DrawPGL = Gambar6("myCanvas6",ArSisi);
var ss
ss = "Gambar di atas adalah mainan anak-anak yang berbentuk balok. <br>Tersusun dari kubus-kubus satuan yang kongruen. <br>Jika seluruh permukaan balok tersebut di cat, banyaknya kubus satuan yang terkena cat pada dua sisinya saja ada ... ";
var Ar = [];
// jawaban
Ar[0] = benar;
Ar[1] = arrSalah[0];
Ar[2] = arrSalah[1];
Ar[3] = arrSalah[2];
var jawab = Ar[0];
Ar = RandomMyArray(Ar);
var noBenar = NoJawabanBenar(Ar, jawab);
var textSoal = ss+" <p>A. "+Ar[0]+" buah<br>B. "+Ar[1]+" buah<br>C. "+Ar[2]+" buah<br>D. "+Ar[3]+" buah</p>";
var textJawab = jawab+"</p>";
var ArFix = [];
ArFix.push(textSoal);
ArFix.push(GetABCD(noBenar));
return ArFix;
}
- Nomor soal dan kalimat sebelum gambar
document.write("<p>6. Perhatikan gambar!<p>");
- Menyiapkan canvas untuk gambar
<canvas id="myCanvas6" width="190" height="142" style="border:0px solid grey;"> </canvas>
- Mencetak soal
var ss
ss = GetSoal6();
document.write("<p>"+ss[0]+"</p>");
document.write("Jawaban : "+ss[1]);
-------------------------------------------