- Pada kanvas, lakukan klik mouse dua buah titik yang merepresentasikan simpul pembentuk garis.
- Garis akan muncul sesuai koordinat simpul yang diinput dari lokasi klik mouse.
- Objek yang berhasil di render akan dimunculkan pada tabel sisi kanan halaman.
2. Square
- Klik tombol “Draw Square” di bawah color bar.
- Pada kanvas, lakukan klik mouse satu buah titik yang merepresentasikan koordinat salah satu titik dari persegi.
- Persegi akan muncul sesuai koordinat titik yang diinput dari lokasi klik mouse.
- Objek yang berhasil di render akan dimunculkan pada tabel sisi kanan halaman.
3. Rectangle
- Klik tombol “Draw Rectangle” di bawah color bar.
- Pada kanvas, lakukan klik mouse dua buah titik yang merepresentasikan diagonal dari persegi panjang tersebut.
- Persegi panjang akan muncul sesuai koordinat diagonal yang diinput dari lokasi klik mouse.
- Objek yang berhasil di render akan dimunculkan pada tabel sisi kanan halaman.
4. Polygon
- Klik tombol “Draw Polygon” di bawah color bar.
- Kemudian akan muncul form yang bertuliskan “Input Vertex Count”, yang menandakan berapa banyak simpul dari poligon yang akan digambar. Isi pada kolom input bilangan bulat positif ≥ 3. Untuk tipe poligon, simpul minimum sebanyak 3 simpul, input dibawah 3 tidak akan diterima. Jika sudah selesai melakukan input, klik tombol “Draw to Canvas” untuk mulai menggambar.
- Pada kanvas lakukan klik menggunakan mouse, menandakan koordinat simpul-simpul dari objek yang ingin dibentuk pada kanvas.
- Poligon akan muncul/di-render pada kanvas apabila sudah terdapat jumlah klik mouse pada kanvas sejumlah banyaknya simpul/vertex yang diinput, yang koordinat dari simpul tergantung pada lokasi klik mouse.
- Objek yang berhasil di-render akan dimunculkan propertinya di tabel pada sisi kanan halaman.
B. How to move, clear, change color, etc
1. Move Control Point
- Secara default, mode klik pada simpul objek memungkinkan pengguna untuk menggeser koordinat simpul yang dipilih pengguna. Pastikan bahwa mode pergeseran objek (Move Object) sudah mati (dapat dilihat dengan adanya tombol “Start Moving Object”).
- Klik (menggunakan klik kiri mouse) salah satu simpul yang ingin digeser koordinatnya.
- Setelah diklik, untuk menggeser koordinat simpul dapat dengan menggerakan mouse pada kanvas (tidak perlu melakukan hold left mouse button).
- Jika sudah selesai menggerakan simpul, dapat dengan melakukan double click atau klik 2 kali pada simpul di koordinat yang diinginkan. .
2. Drag or drop objects on the canvas
- Secara default, mode klik pada simpul objek memungkinkan pengguna untuk menggeser koordinat simpul yang dipilih pengguna. Untuk mematikan mode pergeseran titik kontrol (fitur no.4), dapat melakukan klik tombol “Start Moving Object”, yang akan menyalakan mode pergeseran objek.
- Klik (menggunakan klik kiri mouse) salah satu simpul yang ingin digeser koordinatnya.
- Setelah diklik, untuk menggeser koordinat simpul dapat dengan menggerakan mouse pada kanvas (tidak perlu melakukan hold left mouse button), simpul-simpul lain akan bergerak secara otomatis.
- Jika sudah selesai menggerakan simpul, dapat dengan melakukan double click atau klik 2 kali pada simpul di koordinat yang diinginkan.
- Untuk mematikan mode ini atau kembali ke mode pergeseran titik simpul dapat dengan menekan tombol “Stop Moving Object”.
3. Change the length or size of lines/sides/distance between vertices
- Input/ubah nilai pada form di kolom “Change Size” di tabel objek untuk objek yang ingin diubah ukurannya. Pastikan input merupakan bilangan bulat.
- Ukuran baru akan langsung di-render pada kanvas ketika nilai pada form berubah.
4. Change object color
- Untuk objek yang akan digambar dapat dirubah dengan merubah warna pada color bar di bawah kanvas (di bawah label “Choose Color”).
- Untuk mengubah warna objek yang sudah di-render dapat dengan memanfaatkan form input warna pada tabel objek (kolom “Change Color”).
5. Clear object from canvas
- Hal ini dapat dilakukan dengan mengatur input menjadi nol (0) di kolom “Change Size” pada tabel objek seperti pada fitur 6. Ketika size yang diatur menjadi nol, objek akan otomatis dihapus dan kanvas di-render ulang.
6. Clear canvas
- Fitur ini bekerja dengan melakukan reload atau refresh terhadap halaman web, sehingga mengosongkan kanvas apabila sebelumnya sudah terdapat model atau objek didalamnya.
C. How to save and load model
1. Save Model
- Untuk melakukan penyimpanan file dapat dengan melakukan klik tombol ”Save Data” pada kiri bawah halaman.
2. Load Model
- Untuk melakukan load, dapat diklik tombol “Load File” pada kiri bawah halaman, di samping tombol “Save Data”.