Esimerkki: Ympyrä matematiikan xy-koordinaatistossa

Tehdään aliohjelma, joka piirtää ympyrän matematiikan xy-koordinaatistoon. Tehdään aliohjelma, siten, että voimme valita ympyrän keskipisteen (x,y), säteen r ja värin. Ohjelma on seuraava.

SANALLINEN ALGORITMI
  1. Aseta ikkunan kooksi 400 px vaakaan ja 400 px pystyyn.
  2. Aseta ikkunan taustaväriksi valkea.
  3. Aseta täyttöväriksi musta.
  4. Siirrä origoa puolet ikkunan leveydestä oikealle ja puolet ikkunan korkeudesta alaspäin eli siirrä origo ikkunan keskelle.
  5. Peilaa y-akseli eli y:n arvot kasvaa nyt ylöspäin.
  6. Piirrä vaakaviiva pisteiden (-width/2,0) ja (width/2,0) välille, missä width on ikkunan leveys (x-akseli).
  7. Piirrä pystyviiva pisteiden (0,height/2) ja (0,-height/2) välille, missä height on ikkunan korkeus (y-akseli).
  8. Kutsu aliohjelmaa: ympyra. Välitä aliohjelmalle ympyrän keskipiste (100,100), säde 50 ja väriarvo: "vihreä".
  9. Kutsu aliohjelmaa: ympyra. Välitä aliohjelmalle ympyrän keskipiste (-50,150), säde 25 ja väriarvo: "punainen".
  10. Kutsu aliohjelmaa: ympyra. Välitä aliohjelmalle ympyrän keskipiste (-50,-110), säde 25 ja väriarvo: "keltainen".
  11. Aloita aliohjelma ympyra (Määrittele kokonaislukumuuttujat x, y, r ja merkkijonomuuttuja vari)
    1. Jos vari-muuttuja on "valkea", niin silloin aseta täyttöväriksi valkea.
    2. Jos vari-muuttuja on "musta", niin silloin aseta täyttöväriksi musta.
    3. Jos vari-muuttuja on "harmaa", niin silloin aseta täyttöväriksi harmaa.
    4. Jos vari-muuttuja on "punainen", niin silloin aseta täyttöväriksi punainen.
    5. Jos vari-muuttuja on "vihreä", niin silloin aseta täyttöväriksi vihreä.
    6. Jos vari-muuttuja on "sininen", niin silloin aseta täyttöväriksi sininen.
    7. Jos vari-muuttuja on "keltainen", niin silloin aseta täyttöväriksi keltainen.
    8. Jos vari-muuttuja on "magneta", niin silloin aseta täyttöväriksi magneta.
    9. Jos vari-muuttuja on "syaani", niin silloin aseta täyttöväriksi syaani.
    10. Piirrä ympyrä komennolla: ellipse(x,y,2*r,2*r), missä ympyrän keskipiste on (x,y) ja ympyrän halkaisja on 2*r.
    11. Nollaa täyttöväri eli asteta täyttöväriksi musta.

// Ohjelman tehnyt e-Oppi Oy
// 30.8.2017
void setup () {
size(400,400); // ikkunan koko
background(255); // taustan väri valkea
fill(0); // Musta täyttöväri
}

void draw () {
translate(width/2,height/2); // Origo ikkunan keskelle
scale(1,-1); // Peilaa y-koordinaatit
line(-width/2,0,width/2,0); // vaaka-akseli
line(0,height/2,0,-height/2); // pystyakseli
ympyra(100,100,50,"vihreä");
ympyra(-50,150,25,"punainen");
ympyra(-70,-110,80,"keltainen");
}

void ympyra(int x,int y,int r, String vari) {
if (vari == "valkea") {
fill(255,255,255);
} else if (vari == "musta") {
fill(0,0,0);
} else if (vari == "harmaa") {
fill(128,128,128);
} else if (vari == "punainen") {
fill(255,0,0);
} else if (vari == "vihreä") {
fill(0,255,0);
} else if (vari == "sininen") {
fill(0,0,255);
} else if (vari == "keltainen") {
fill(255,255,0);
} else if (vari == "syaani") {
fill(0,255,255);
} else if (vari == "magneta") {
fill(255,0,255);
}
ellipse(x,y,2*r,2*r);
fill(0); // Värin nollaus
}


Kuten huomasit, niin aliohjelmaan voidaan myös välittää merkkijono-tyyppistä tietoa. Kun välität merkkijono tyyppistä tietoa, niin laita välitettävä tieto lainausmerkkien (" ") väliin. Ohjelman tulostus on seuraava.




Matematiikan xy-koordinaatisto luodaan komennoilla translate(width/2,height/2) ja scale(1,-1); Komento: translate(width/2,height/2); siirtää origon ikkunan keskelle ja komento: scale(1,-1);peilaa y-koordinaatin arvot eli y kasvaa ylöspäin. x- ja y-akselit on hyvä myös tulostaa. Ne saat tulostettua line()-komennolla, jossa on käytetty komentoja width ja height funktion parametreina. Tämä on järkevää, koska silloin xy- koordinaatisto saadaan aina ikkunan keskelle riippumatta siitä mikä on ikkunan koko.