Hint for brøk-animasjon

Hint 1
ellipse(x, y, diameter)
eventuelt: ellipse(x, y, bredde høyde)

Hint 2
nofill()
point()

Hint 3
point(x, y)
strokeWeight(antall punkter)
createCanvas(bredde, høyde)

Hint nr 4
x = sentrum + cos(vinkel) * radius 
y = sentrum + sin(vinkel) * radius
Vinkelen må øke for hver runde i draw()
Les mer om bruk av cosinus og sinus her

Hint nr 5 
angleA og angleB
speedA og speedB

Hint nr 6
Egne variabler for punktenes x-og y-koordinater. F. eks.: xA, yA og xB, yB
Vannrett linje:
​Venstre koordinater er de samme som punktet i venstre sirkel.
Høyre y-koordinat er også den samme. Høyre x-koordinat er lik bredden på lerretet
Loddrett linje: Samme prinsipp som over.

Hint 7
Bruk koordinatene til de bevegelige punktene.

Hint 8
Ofte flyttes background() fra draw() og opp i setup() når vi vil lage spor. Det fungerer dårlig her. Prøv!

Lag heller en tabell med posisjonene til pennen.
Erstatt pencil_x og pencil_y med en vektor som lagrer begge verdiene i samme variabel
Legg til ny celle for hver runde i draw
Lag en løkke som tegner et punkt for alle cellene i tabellen
Fjern første celle når tabellen er stor nok til å tegne hele sporet (hvis ikke blir tabellen etterhvert svært lang
track[]
push()
splice()
Video-hint: Daniel Shiffmans p5.js-video nr 9.7 Drawing Object Trails

Hint 9
La den nedre sirkelen (B) ha hastighet lik 1
La den øvre sirkelen (A) ha hastighet lik en brøkverdi
Reduser hastigheten med samme faktor for begge

Hint 10

Tekst:
Skriv disse linjene i draw()

  • stroke(0);
  • strokeWeight(1);
  • text(a, 100, 100); // Skriver innholdet av «a» i posisjonen x = 100, y = 100

Tilfeldige verdier:
Deklarere egne variabler for teller og nevner før setup(). Gi dem en startverdi.
Skriv denne funksjonen nederst i programmet etter siste krøllparentes i draw():

  • function mousePressed() {
    • track = []; // Tømmer alle cellene
    • a = int(random(1, 10)); // Lager tilfeldig heltallsverdi (integer) fra og med 1 til og med 9
    • b = int(random(1, 10));
    • // kopier inn resten av linjene i setup() her. createCanvas(400, 400) og noFill() trenger ikke kopieres
  • }

skolekoding.no
Stein Olav Kivle