ellipse(50, 40, 80, 60);

Yang akan menghasilkan gambar di bawah ini.

ellipse akan mengambil empat argumen, yaitu bilangan-bilangan dalam

tanda kurung itu.

(50, 40, 80, 60) argumen pertama menunjukkan koordinat X di mana

pusat elips akan diletakkan. Dalam contoh ini koordinat X-nya adalah 50.

(50, 40, 80, 60) argumen kedua menunjukkan koordinat Y di mana

pusat elips akan diletakkan. Dalam contoh ini koordinat Y-nya adalah 40.

(50, 40, 80, 60) argumen ketiga menunjukkan lebar elips. Dalam
contoh ini lebarnya adalah 80 piksel.

(50, 40, 80, 60) argumen ketiga menunjukkan tinggi elips. Dalam
contoh ini tingginya adalah 60 piksel.
Berarti, keseluruhan perintah ellipse(50, 40, 80, 60); berarti gambarlah
elips dengan pusat di koordinat (50, 40), selebar 80 piksel, dan setinggi 60
piksel.

Latihan
1.

Buatlah elips dengan pusat (60, 45), dengan lebar 50 piksel dan tinggi
75 piksel.

2.

Apakah artinya ellipse(31, 52, 44, 54)?

Itu elip
Nah, lingkaran bisa dianggap sebagai elips yang tinggi maupun lebarnya
sama. Maka untuk menggambar lingkaran, cukup buat lebar dan tingginya
sama, yang sama dengan diameter lingkarannya. Mudah, bukan?

?
ellipse(50, 40, 60, 60);

Latihan
1.

Buatlah lingkaran dengan pusat (33, 41), dengan diameter 18 piksel.

2.

Apakah artinya ellipse(81, 22, 15, 15)?

Sekarang kita akan coba membuat sebuah gambar lingkaran berwarna.

?
1
2
3
4
5
6

size(200, 200);
background(#FFC80F);
stroke(#189D2D);
fill(#3FE88C);
ellipse(100, 100, 150, 150);

Cobalah tekan Run, dan kamu akan mendapatkan hasilnya seperti di bawah
ini.
Sebenarnya apa yang dilakukan oleh program tersebut? Baiklah, sekarang
kita akan melihatnya satu per satu.

Pertama, atur ukuran kanvasnya

?
size(200, 200);

Kamu hampir akan selalu memerlukan perintah ini setiap kali membuat
sebuahsketch. Karena perintah ini adalah untuk memberitahu Processing
ukuran kanvas yang kamu inginkan. Dalam hal ini adalah 200200. Jadi
Processing akan menyediakan sebuah kanvas bagimu dengan lebar 200
piksel, dan dengan tinggi 200 piksel.
?
size({lebar}, {tinggi});

Lalu, beri warna background

Perintah background berguna untuk mewarnai seluruh kanvas dengan suatu
warna tertentu.
?
background(#FFC80F);

Sekarang, baru gambar lingkarannya

Untuk

menggambar

lingkaran,

kita

menggunakan ellipse.

Tetapi

sebelumnya, kita menyiapkan warnanya terlebih dahulu.

stroke digunakan untuk memberi warna tepi luar.

?
stroke(#189D2D);

fill digunakan untuk memberi warna dalamnya.

?
fill(#3FE88C);

ellipse digunakan untuk menggambar lingkaran. Dalam hal ini lingkaran

diletakkan di posisi (100, 100), dengan diameter sebesar 150 piksel.

?
ellipse(100, 100, 150, 150);

Latihan
1.

Buatlah lingkaran biru dengan latar belakang hitam, pusatnya di (250,

101), sebesar mungkin tapi masih muat dalam sketch berukuran (300, 300).

2.

Dalam sketch berukuran (640, 480), buat 3 lingkaran yang saling

bersinggungan satu sama lain.

Bentuk-bentuk
primitif
Dengan Processing, kamu bisa membuat bentuk-bentuk sederhana yang
disebut sebagai primitif. Disebut primitif bukan karena tidak memakai baju
dan suka makan orang, tetapi karena bentuk-bentuk ini adalah bentuk yang
sederhana, yang bisa digabungkan untuk membuat bentuk yang lebih
kompleks.
Setiap

bentuk

dan strokeWeight. stroke adalah

dipengaruhi
warna

pada

oleh stroke, fill,

tepian

bentuk.

Pada

awalnya stroke selalu berwarna hitam. Filladalah warna isi, yang awalnya
selalu berwarna putih. strokeWeight adalah tebal garis tepinya.

Sebuah titik bisa digambar dengan point.

point(x, y);
Dengan point kamu bisa membuat titik pada koordinat x, y. Sebagai contoh,
kode di bawah ini akan menghasilkan titik pada koordinat (40, 70).
?
point(40, 70);

Garis lurus dapat dibuat dengan line.

line(xA, yA, xB, yB);
Garis akan dibuat dari titik (xA, yA) menuju ke titik (xB, yB). Kode di bawah ini
akan menghasilkan garis dari koordinat (20, 30) ke (40, 80).
?
line(20, 30, 40, 80);

Segitiga terbentuk dari 3 titik. Maka triangle memerlukan koordinat titik

pertama (xA, yA), kedua (xB, yB), dan ketiga (xC, yC).
triangle(xA, yA, xB, yB, xC, yC);

Sebagai contoh, kode di bawah akan membuat segitiga dengan titik-titik (10,
20), (80, 40), dan (50, 90).
?
triangle(10, 20, 80, 40, 50, 90);

Segi empat dapat dibuat dengan dua macam cara. Pertama, kamu bisa
membuat

segi

empat

sembarang

menggunakan quad.

Penggunaannya

seperti triangle, kamu harus memberikan setiap koordinat titik sudutnya.

quad(xA, yA, xB, yB, xC, yC, xD, yD);
Kode di bawah ini akan menghasilkan segiempat sembarang yang titiktitiknya adalah (10, 20), (80, 30), (90, 90), dan (40, 70).
?
quad(10, 20, 80, 30, 90, 90, 40, 70);

Lalu bagaimana jika kamu ingin membuat persegi panjang yang tegak?
Kamu bisa saja mengatur koordinatnya sedemikian hingga dihasilkan persegi
panjang yang tegak. Tetapi Processing menyediakan cara yang lebih baik,
yaitu rect. Denganrect kamu hanya perlu memberikan koordinat titik paling
kiri atas saja (x, y), dan memberitahu lebar dan tinggi yang diinginkan
(dalam satuan piksel).
rect(x, y, lebar, tinggi);
Kode di bawah akan menghasilkan persegi panjang di posisi (30, 50) dengan
lebar 60 dan tinggi 40.

?
rect(30, 50, 60, 40);

Membuat elips bisa dengan ellipse.

ellipse(x, y, lebar, tinggi);
Kode di bawah ini akan menghasilkan elips pada koordinat (50, 40) dengan
lebar 80 piksel dan tinggi 20 piksel.
?
ellipse(50, 40, 80, 20);

Lingkaran adalah keadaan khusus dari elips, yaitu lebar dan tingginya sama.
Maka

kalau

ingin

membuat

lingkaran,

kamu

tinggal

menset lebar dan tinggi menjadi sama besar. Itu akan menjadi diameter
lingkaran.
?
ellipse(50, 50, 30, 30);

Kalau

kamu

hendak

membuat

busur,

kamu

bisa

gunakan arc.

Sebenarnya arcbukanlah menggambar busur saja, tetapi menggambar

sebuah sektor lingkaran atau elips. Kamu perlu memberitahu Processing
mengenai titik pusatnya (x, y), lebar dan tingginya, kemudian sudut awal
dan sudut akhirnya. Sudut selalu dituliskan dalam radian.
arc(x, y, lebar, tinggi, sudut awal, sudut akhir);

Kode di bawah ini akan menghasilkan sektor elips yang berpusat di (50, 50),
dengan lebar 90 dan tinggi 70, digambar dari sudut awal 0.8 radian (45.8
derajat) hingga sudut akhir 5.1 (292.2 derajat).
?
arc(50, 50, 90, 70, 0.8, 5.1);