Javascript - Cirkeln på parameterform

Från Wikiskola
Version från den 18 november 2012 kl. 15.53 av Hakan (diskussion | bidrag) (Skapade sidan med '== Javascript - Cirkeln på parameterform == Det här är en digitalövning där vi ska titta på hur man ritar cirkeln på parameterform och hur det görs i '''javascript'''...')
(skillnad) ← Äldre version | Nuvarande version (skillnad) | Nyare version → (skillnad)
Hoppa till navigering Hoppa till sök

Javascript - Cirkeln på parameterform

Det här är en digitalövning där vi ska titta på hur man ritar cirkeln på parameterform och hur det görs i javascript.

Det vi sett tidigare med cirkelns ekvation kallas att använda kartesiska koordinater. Problemet är att man inte kan lösa ut y som en funktion av x utan att ta roten ur. Roten ur ger ju som bekant två rötter, en positiv och en negativ. Det ställer till problem genom att en funktion bara ska ha ett y-värde per x-värde.

Man kan i och för sig tänka sig att rita de båda värdena samtidigt men det finns ett bättre sätt - polära koordinater

Parametrisering

Tänk på den rätvinkliga triangeln med hypotenusan r. Då kan man utgå från cirkelns mittpunkt i origo och beskriva x med cosinus och y med sinus som vi gjort tidigare. X- och y-koordnaterna uttrycks med hjälp av radien r och vinkeln t. Det kallas för parametrisering. r är parametern och t är en ny variabel, vinkeln. En parameter kan ändras från cirkel till cirkel vilket ger ändrad storlek (radie) men den ändras inte medans man ritar cirkeln. Gör man det får man helt andra former och det finns faktiskt exempel på det med på spelprogrammering.nu men det får du kolla på själv senare.

[math]\displaystyle{ x = r \cdot \cos t\, }[/math]
[math]\displaystyle{ y = r \cdot \sin t\, }[/math]

För r = 1 erhålls enhetscirkeln, det vill säga cirkeln med radie 1 och med mittpunkt i origo. t är i detta fall en vinkel som ökar från 0-360o.

Javascript

Javascript och spel Kod: CC By SA spelprogrammering.nu

titta först på funktionen cirkel. Sid 5 i boken spelprogramering.nu.

Sedan finns en del exempel hämtade från kapitel 8.


Idag ska vi äntligen jobba med Javascript!

Kartesiska koordinater

Uppgift
Prova att använda cirkelns ekvation och rita en cirkel.

Tips: du måste lösa ut y. (exemepelvis ur y2 + x2 = 400)

Ladda ner följande filer i en mapp och pröva själv genom att ändra i koden:


Polära koordinater

Titta på de här exemplen om hur enkelt man ritar cirklar med polära koordinater:

Mer: Testa funktionen att rita med polära koordinater i GGB.