Laboratorium Virtual | Dokumentasi Library Simulasi Dasar

var grafData = {startX:50, startY:100, dataW:20, dataH:10, tileW:25, skalaX:1, skalaY:1, 
desimalX:0, desimalY:0, offsetX:10, offsetY:5, xLabel:'x (cm)', yLabel:'y (cm)', 
fontLabel:'11pt Calibri', warnaBG:'#daf6fb', warnaGaris:'#000', warnaLabel:'#000'}

No	Parameter	Deskripsi
1	startX	posisi x awal (pojok kiri atas) penggambaran grafik
2	startY	posisi y awal (pojok kiri atas) penggambaran grafik
3	dataW	jumlah data pada sumbu axis (sumbu x)
4	dataH	jumlah data pada sumbu ordinat (sumbu y)
5	tileW	lebar tiap satuan data dalam satuan pixel
6	skalaX	Skala data sumbu x. Misal : jika diisi 2, maka data sumbu x akan menjadi kelipatan 2 (0, 2, 4, ...)
7	skalaY	Skala data sumbu y. Misal : jika diisi 2, maka data sumbu y akan menjadi kelipatan 2 (0, 2, 4, ...)
8	desimalX	Format desimal data pada sumbu x. Misal : jika diisi 2, maka data sumbu x menjadi (1.00, 2.00, ....dst)
9	desimalY	Format desimal data pada sumbu y. Misal : jika diisi 2, maka data sumbu y menjadi (1.00, 2.00, ....dst)
10	offsetX	pergeseran posisi sumbu X
11	offsetY	pergeseran posisi sumbu Y
12	labelX	Keterangan data pada sumbu X
13	labelY	Keterangan data pada sumbu Y
14	fontLabel	Jenis teks untuk menampilkan data pada sumbu koordinat
15	warnaBG	warna background pada sumbu koordinat
16	warnaGaris	warna garis sumbu koordinat
17	warnaLabel	warna huruf label pada sumbu koordinat

Contoh Penggunaan

aturCanvas();
var graf = {startX:50, startY:100, dataW:20, dataH:10, tileW:25, skalaX:1, skalaY:1, desimalX:0, desimalY:0, offsetX:10, offsetY:5, xLabel:'x (cm)', yLabel:'y (cm)', fontLabel:'11pt Calibri', warnaBG:'#daf6fb', warnaGaris:'#000', warnaLabel:'#000'}
 
var P = {x:5, y:3};		
var Q = {x:8, y:1};		
			
function setSimulasi(){
	//menambahkan background warna
	hapusLayar("#e8e8e8");	
	//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;
	//transformasi titik P dan Q ke koordinat layar
	var Px1 = x0 + (P.x*graf.tileW/graf.skalaX);
	var Py1 = y0 - (P.y*graf.tileW/graf.skalaY);
	var Qx1 = x0 + (Q.x*graf.tileW/graf.skalaX);
	var Qy1 = y0 - (Q.y*graf.tileW/graf.skalaY);
	//membuat garis
	garis (Px1, Py1, Qx1, Qy1, 5, "blue");
}
 
setSimulasi();

Share ( Ayo Berbagi )

Leave me a comment

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