Opis programu. Obiekt canvas w HTML szerokość i wysokość 600 pikseli. Wygląd dolnej części sterownia armaty grawitacyjnej

Podobne dokumenty
LIVE Gra w życie. LIVE w JavaScript krok po kroku. ANIMACJA Rozpoczynamy od podstawowego schematu stosowanego w animacji

Jak zrobić grawitację?

Lekcja 11 Gra komputerowa LASER

Dokąd on zmierza? Przemieszczenie i prędkość jako wektory

Aplikacje WWW - laboratorium

Aplikacje WWW - laboratorium

Animacje z zastosowaniem suwaka i przycisku

Wyszukiwanie największej spośród czterech liczb. Przykładowe rozwiązanie

Funkcje i instrukcje języka JavaScript

Ilość cyfr liczby naturalnej

Wykład 03 JavaScript. Michał Drabik

JAVAScript w dokumentach HTML (1) JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania.

Podstawy JavaScript ćwiczenia

Zajęcia 4 - Wprowadzenie do Javascript

Rodzaje zadań w nauczaniu fizyki

Palindromy. Przykładowe rozwiązanie

Skrypt 26. Stereometria: Opracowanie Jerzy Mil

JAVAScript w dokumentach HTML (2)

Format HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty

Defilada - przykład wykorzystujący animowane modele Copperlicht. Andrzej P.Urbański Politechnika Poznańska

Aplikacja kret dla App Inventor 2

Formularze HTML. dr Radosław Matusik. radmat

Dokumentacja Skryptu Mapy ver.1.1

Multimedia i interfejsy. Ćwiczenie 5 HTML5

Zdarzenia Zdarzenia onload i onunload

Zajęcia nr 15 JavaScript wprowadzenie do JavaScript

Widżety KIWIPortal. tworzenie umieszczanie na stronach internetowych opcje zaawansowane. Autor: Damian Rebuś Data: Wersja: 1.

Zasady dynamiki Newtona. Ilość ruchu, stan ruchu danego ciała opisuje pęd

Misja#3. Robimy film animowany.

FORMULARZE Formularz ma formę ankiety, którą można wypełnić na stronie. Taki formularz może być np. przesłany pocztą elektroniczną .

W efekcie złożenia tych dwóch ruchów ciało porusza się ruchem złożonym po torze, który w tym przypadku jest łukiem paraboli.

2.8. Algorytmy, schematy, programy

Celem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania na nich skryptów w języku JavaScript.

Grafika Komputerowa Materiały Laboratoryjne

Czytanie wykresów to ważna umiejętność, jeden wykres zawiera więcej informacji, niż strona tekstu. Dlatego musisz umieć to robić.

WASM AppInventor Lab 3. Rysowanie i animacja po kanwie PODSTAWY PRACY Z KANWAMI

Badanie zależności położenia cząstki od czasu w ruchu wzdłuż osi Ox

Modelowanie matematyczne a eksperyment

GIMP. Ćwiczenie nr 6 efekty i filtry. Instrukcja. dla Gimnazjum 36 - Ryszard Rogacz Strona 18

Zasady dynamiki Newtona

JAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA materiały dydaktyczne dla słuchaczy opracowanie: by Arkadiusz Gawełek, Łódź

Przygotuj za pomocą tabulatorów element formularza. Utwórz pole tekstowe i sformatuj tak, aby dół napisu w polu był dokładnie nad kropkami.

BAZY DANYCH Panel sterujący

FINCH PONG. Realizator: Partner: Patronat:

Emapi.pl. Wyznaczanie trasy

4. Funkcje. Przykłady

A B. Modelowanie reakcji chemicznych: numeryczne rozwiązywanie równań na szybkość reakcji chemicznych B: 1. da dt. A v. v t

JavaScript - wykład 4. Zdarzenia i formularze. Obsługa zdarzeń. Zdarzenia. Mysz. Logiczne. Klawiatura. Beata Pańczyk

Michał Bielecki, KNI 'BIOS'

FORMULARZE. G. Przęczek

Rysowanie precyzyjne. Polecenie:

Baltie 3. Podręcznik do nauki programowania dla klas I III gimnazjum. Tadeusz Sołtys, Bohumír Soukup

Sieciowe Technologie Mobilne. Laboratorium 2

JAVAScript w dokumentach HTML (1)

Zaawansowane aplikacje internetowe

JAVAScript w dokumentach HTML - przypomnienie

Tekst na mapach. Teksty na mapie. Ustawienia mapy. W tej instrukcji zostanie opisany sposób w jaki można na mapach wyświetlać teksty

Zadanie. Oczywiście masa sklejonych ciał jest sumą poszczególnych mas. Zasada zachowania pędu: pozwala obliczyć prędkość po zderzeniu

Cw.12 JAVAScript w dokumentach HTML

Podstawy Procesów i Konstrukcji Inżynierskich. Praca, moc, energia INZYNIERIAMATERIALOWAPL. Kierunek Wyróżniony przez PKA

Aplikacje WWW - laboratorium

Graficzne rejestratory VM7000A Dużo funkcji przy zachowaniu łatwości obsługi!

Badanie ruchu złożenia

KGGiBM GRAFIKA INŻYNIERSKA Rok III, sem. VI, sem IV SN WILiŚ Rok akademicki 2011/2012

Wybrane działy Informatyki Stosowanej

Wykład FIZYKA I. 5. Energia, praca, moc. Dr hab. inż. Władysław Artur Woźniak


Przetwarzanie dokumentów XML i zaawansowane techniki WWW Zdarzenia w JavaScript (Zajęcia r.)

Pascal - grafika. Uruchomienie trybu graficznego. Moduł graph. Domyślny tryb graficzny

Fizyka 1 Wróbel Wojciech. w poprzednim odcinku

1. Umieść kursor w miejscu, w którym ma być wprowadzony ozdobny napis. 2. Na karcie Wstawianie w grupie Tekst kliknij przycisk WordArt.

14P POWTÓRKA FIKCYJNY EGZAMIN MATURALNY Z FIZYKI I ASTRONOMII. POZIOM PODSTAWOWY (od początku do grawitacji)

Przygotuj za pomocą tabulatorów element formularza. Utwórz pole tekstowe i sformatuj tak, aby dół napisu w polu był dokładnie nad kropkami.

JAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window

Przykład integracji kalkulatora mbank RATY na platformie IAI

Arkusz kalkulacyjny EXCEL

Edytor tekstu MS Word 2010 PL: grafika. Edytor tekstu MS Word umożliwia wstawianie do dokumentów grafiki.

Praca. Siły zachowawcze i niezachowawcze. Pole Grawitacyjne.

Aplikacje internetowe - laboratorium

Skrypt 20. Planimetria: Opracowanie L6

4. Jeżeli obiekt waży 1 kg i porusza się z prędkością 1 m/s, to jaka jest jego energia kinetyczna? A. ½ B. 1 C. 2 D. 2

Tworzenie Stron Internetowych. odcinek 9

3. Program do tworzenia prezentacji Impress

Projekt Innowacyjny program nauczania matematyki dla liceów ogólnokształcących

Konsorcjum FEN Sp. z o.o. ul. Dąbrowskiego 273A, Poznań Mateusz Zapotoczny support [at] fen.pl

Wizualizacja płomienia

KONKURS PRZEDMIOTOWY Z FIZYKI dla uczniów gimnazjów. Schemat punktowania zadań

Formularze w PHP dla początkujących

KATEDRA AUTOMATYKI, BIOMECHANIKI I MECHATRONIKI. Laboratorium Mechaniki technicznej

Aby dokonać korekty wprowadzanych danych bądź zwiększyć opór. Aby dokonać korekty wprowadzanych danych bądź zmniejszyć opór.

KONKURS PRZEDMIOTOWY Z FIZYKI dla uczniów gimnazjów. Schemat punktowania zadań

LABORATORIUM GRAWITACYJNE

Unity. Platforma do tworzenia gier dla różnych systemów docelowych, m.in.: Windows, macos, ios, Android, Powstała w 2005 r., obecnie wersja 5.3.

Tworzenie szablonów użytkownika

Informatyka II. Laboratorium Aplikacja okienkowa

Unity 3D - podpowiedzi w grze. System cząstek

Raytracer. Seminaria. Hotline. początkujący zaawansowani na miejscu

Zasoby. Musimy zaimportować zasoby dla gry z Asset Store

Dokładny opis instalacji programów RFD można znaleźć w pliku PDF udostępnionym na stronie w zakładce Downland > AutoCAD > Instalacja

Transkrypt:

Jak zasymulować grawitację przy użyciu komputera? Niedawno używaliśmy arkusza kalkulacyjnego, a tym razem animowane kulki pojawią się na stronie internetowej. Na czym polega grawitacja w przypadku Ziemi? Wszystkie ziemskie obiekty są przez nią przyciągane i poruszają się z przyspieszeniem, w kierunku jej środka. Równania, które opisują ten ruch można wyprowadzić z najprostszych fizycznych zależności na prędkość i przyspieszenie i opisane zostały w artykule Jak zrobić grawitację?, a podstawy w artykule JavaScript 07 Grawitacja. Nieco poszerzona wersja jest uboga w graficzne detale i animowane wodotryski program ma być prosty i zrozumiały dla chętnych do zabawy w programowanie i przyjazny dla chcących przeprowadzić eksperyment fizyczny. Opis programu Obiekt canvas w HTML szerokość i wysokość 600 pikseli <canvas id="c1" width="600" height="600"></canvas> Wygląd dolnej części sterownia armaty grawitacyjnej

Przyciski, pola i suwaki w HTML oraz przypisane do nich funkcje <table border=0> <td> <input id="odnowa" type="button" value=" START " onclick=odnowa()> </td> <td align=right> <input id="startstop" type="button" value="pauza" onclick=startstop()> </td> <td align=right>czyść ekran</td> <td> <input id="rys0" type="checkbox"> <input id="czyscekran" type="button" value="czyść" onclick=czyscekran()> <input id="kol0" type=color value="#ff0000" onchange=zmianakoloru()> </td> <td> <input id="r0" type="number" width=100 min=1 max=100 onchange=polasuwaki()> </td> <td align=right>r</td> <td>(1..100)</td> <td> <input type="range" id="rr0" min=1 max=100 onchange=suwakipola()> </td> <td> <input id="x0" type="number" min=0 max=600 onchange=polasuwaki()> </td> <td align=right>x</td> <td>(0..600)</td> <td> <input type="range" id="rx0" min=0 max=600 onchange=suwakipola()> </td> <td> <input id="y0" type="number" min=0 max=600 onchange=polasuwaki()> </td> <td align=right>y</td> <td>(1..600)</td> <td> <input type="range" id="ry0" min=0 max=600 onchange=suwakipola()> </td> <td><input id="vx0" type="number" min=-500 max=500 onchange=polasuwaki()></td> <td align=right>vx</td> <td> (-500..500)</td> <td><input type="range" id="rvx0" min=-500 max=500 onchange=suwakipola()></td> <td><input id="vy0" type="number" min=-500 max=500 onchange=polasuwaki()></td> <td align=right>vy</td> <td>(-500..500)</td> <td><input type="range" id="rvy0" min=-500 max=500 onchange=suwakipola()> </td> <td><input id="fw0" type="number" min=0 max=500 onchange=polasila()></td> <td align=right>siła</td> <td>(0..500)</td> <td><input type="range" id="rfw0" min=0 max=500 onchange=silapola()> </td> <td><input id="fk0" type="number" min=-90 max=90 onchange=polasila()></td> <td align=right>kąt</td> <td>(-90..90)</td> <td><input type="range" id="rfk0" min=-90 max=90 onchange=silapola()> </td> <td><input id="op0" type="text" size=6 onchange=polasuwaki()></td> <td align=right>opór</td> <td> (0,900..1,0)</td> <td><input type="range" id="rop0" min=900 max=1000 onchange=suwakipola()></td> <td><input id="sp0" type="text" size=6 onchange=polasuwaki()></td> <td align=right>sprężystość</td> <td>(0,0..1,0)</td> <td><input type="range" id="rsp0" min=0 max=1000 onchange=suwakipola()> </td> </table>> Cała reszta programu to skrypt w JS

Zmienna c symbolizuje canvas i poprzez nią będziemy się odwoływali do wszystkich graficznych elementów Zmienne w i h szerokość i wysokość zdefiniowanego w HTML obszaru rysowania Zmienne skok i TIM są niezbędne podczas animacji <script> var c = c1.getcontext('2d') var w = c.canvas.width; var h = c.canvas.height; var skok = 10; var TIM;> Kulka pocisk armatni którą będziemy animować. Zmienne x i y oznaczają środek kulki, r promień i ostatni parametr to kolor kulki. function pilka(x,y,r,kolor){ c.beginpath(); c.strokestyle=kolor; c.fillstyle=kolor; c.arc(x, y, r,0, Math.PI * 2); c.stroke(); c.fill(); Parametry początkowe pierwszego strzału: x, y, r, k oraz początkowa szybkość: vx i vy. Zmienna dt to przyrost czasu, którym możemy regulować szybkość przemieszczania się kulki. g przyspieszenie ziemskie. opor opór powietrza (1.0 ruch bez oporu). spr Sprężystość odbić (1.0 odbicia sprężyste). animuj ustawione na true (prawda) animacja jest kontynuowana, false (fałsz) - pauza var x=r; var y=h-r; var r=10; var k="red"; var vx=55; var vy=-100; var dt=0.1; var g=9.81; var opor=0.99; var spr=0.9; var animuj=true; Dwie funkcje (i zmienne) pomocnicze, które obliczają długość przeciwprostokątnej i kąt nachylenia przeciwprostokątnej w trójkącie prostokątnym utworzonym przez składowe fx i fy. Z ich pomocą wyliczamy szybkość wystrzeliwania kulki z armaty i kąt pochylenia armaty. function Fsila(fx,fy){ return Math.pow(parseFloat(Math.pow(fx,2)) + parsefloat(math.pow(fy,2)),0.5); var Fw=Fsila(vx,vy); function Fkat(fx,fy){ return (Math.atan(fy/fx)*180)/Math.PI; var Fk=Fkat(vx,vy); Nasza grawitacyjna armata, to dwa kółka i odcinek je łączący. Położenie, długość i kąt nachylenia armaty wyliczany jest na podstawie wartości pobieranych z pól tekstowych x0, y0, vx0, vy0. function RysujArmate(){ var Wx0=parseFloat(x0.value); var Wy0=parseFloat(y0.value); var Wvx0=parseFloat(vx0.value); var Wvy0=parseFloat(vy0.value); var Wx=Wx0+Wvx0; var Wy=Wy0+Wvy0; pilka(wx0,wy0,2,"black"); c.beginpath(); c.moveto(wx0,wy0); c.lineto(wx,wy); c.stroke(); pilka(wx,wy,1,"black");

Obsługa przycisków START, PAUZA i CZYŚĆ function OdNowa(){ animuj=true; PolaZmienne(); czas=settimeout(grawitacja,skok); function StartStop(){ animuj=!animuj; if (animuj) {czas=settimeout(grawitacja,skok) cleartimeout(tim); function CzyscEkran(){ c.clearrect(0, 0, w, h); c.strokerect(0, 0, w, h); RysujWektory(); ; Jeśli zmianie ulegną się podstawowe parametry strzelającej armaty, kulki lub środowiska (r,x,y,vx,vy,opor, spr), to ich wartości wpisujemy do pól tekstowych i jednocześnie ustawiamy suwaki. Po każdej zmianie szybkości wyliczamy na nowo siłę wyrzutu i kąt armaty. Jeśli zmienimy parametry programu wpisując je ręcznie do pól tekstowych, to zmieniamy odpowiadające im zmienne i wyliczamy siłę i kąt armaty. function PolaZmienne(){ r=parsefloat(r0.value); x=parsefloat(x0.value); y=parsefloat(y0.value); vx=parsefloat(vx0.value); vy=parsefloat(vy0.value); Fw=Fsila(vx,vy); Fk=Fkat(vx,vy); Fw0.value=Fw; RFw0.value=Fw; Fk0.value=Fk; RFk0.value=Fk; opor=parsefloat(op0.value); spr=parsefloat(sp0.value); function ZmiennePola(){ r0.value=r; Rr0.value=r; x0.value=x; Rx0.value=x; y0.value=y; Ry0.value=y; R Fw=Fsila(vx,vy); Fk=Fkat(vx,vy); Fw0.value=Fw; RFw0.value=Fw; Fk0.value=Fk; RFk0.value=Fk; op0.value=opor; Rop0.value=opor*1000; sp0.value=spr; Rsp0.value=spr*1000; Korzystamy z suwaków wartości na nich ustawione zapisujemy w polach tekstowych oraz wyliczamy siłę i kąt armaty. Ręczne wpisanie parametrów do pól tekstowych powinno wymusić zmianę ustawień na suwakach. function PolaSuwaki(){ Rr0.value=r0.value; r=r0.value; Rx0.value=x0.value; Ry0.value=y0.value; Rvx0.value=vx0.value; Rvy0.value=vy0.value; Rop0.value=op0.value*1000; Rsp0.value=sp0.value*1000; function SuwakiPola(){ r0.value=rr0.value; r=r0.value; x0.value=rx0.value; y0.value=ry0.value; vx0.value=rvx0.value; vy0.value=rvy0.value; Fw=Fsila(vx0.value,vy0.value); Fk=Fkat(vx0.value,vy0.value); Fw0.value=Fw; Fk0.value=Fk; RFw0.value=Fw0.value; RFk0.value=Fk0.value; op0.value=rop0.value/1000; sp0.value=rsp0.value/1000;

Zmieniając siłę i kąt armaty musimy wyliczyć z funkcji trygonometrycznych składowe szybkości i wstawić je do pół i na suwaki vx i vy. Wpisujemy wartości ręcznie do pól tekstowych siła i kąt koniecznie należy wyliczyć na nowo składowe szybkości. function PolaSila(){ var sila=fw0.value; var kat=fk0.value; RFw0.value=sila; RFk0.value=kat; vx=math.cos(kat*math.pi/180)*sila; vy=math.sin(kat*math.pi/180)*sila; R function SilaPola(){ var sila=rfw0.value; var kat=rfk0.value; Fw0.value=sila; Fk0.value=kat; vx=math.cos(kat*math.pi/180)*sila; vy=math.sin(kat*math.pi/180)*sila; R Funkcja realizująca animację (rekurencyjnie). rys0.checked jeśli zaznaczone pole czyść ekran, to kulka nie jest wymazywana. Poniżej rysowana jest czarna ramka, armata i kulka. x=x+vx*dt; y=y+vy*dt; vy=vy+g*dt; vx=vx*opor; vy=vy*opor; Równania ruchu opisują w kolejności zmianę położenia, zmianę szybkości związaną z grawitacją i zmianę szybkości związaną z oporem powietrza. if (y>h-r-vy*dt){vy=-(vyg*dt)*spr Odbicie od dolnej krawędzi uwzględniamy promień kulki i function grawitacja() { if (rys0.checked) { c.clearrect(0, 0, w, h); c.strokerect(0, 0, w, h); RysujArmate(); pilka(x,y,r,k); x=x+vx*dt; y=y+vy*dt; vy=vy+g*dt; vx=vx*opor; vy=vy*opor; if (y>h-r-vy*dt){vy=-(vy-g*dt)*spr cleartimeout(tim); TIM = settimeout(grawitacja, skok); grawitacja(); </script> szybkość z jaką się zbliża. Po odbiciu kulka zmienia kierunek na przeciwny uwzględniamy sprężystość odbić oraz pomniejszamy o (niepotrzebny) dodatkowy wzrost szybkości. Ostatnia instrukcja programu, to właściwe uruchomienie animacji i zamknięcie skryptu.

Cały program <canvas id="c1" width="600" height="600"></canvas> <table border=0> <td> <input id="odnowa" type="button" value=" START " onclick=odnowa()> </td> <td align=right> <input id="startstop" type="button" value="pauza" onclick=startstop()> </td> <td align=right>czyść ekran</td> <td> <input id="rys0" type="checkbox"> <input id="czyscekran" type="button" value="czyść" onclick=czyscekran()> <input id="kol0" type=color value="#ff0000" onchange=zmianakoloru()> </td> <td><input id="r0" type="number" width=100 min=1 max=100 onchange=polasuwaki()></td> <td align=right>r</td> <td>(1..100)</td> <td> <input type="range" id="rr0" min=1 max=100 onchange=suwakipola()> </td> <td><input id="x0" type="number" min=0 max=600 onchange=polasuwaki()></td> <td align=right>x</td> <td>(0..600)</td> <td><input type="range" id="rx0" min=0 max=600 onchange=suwakipola()> </td> <td><input id="y0" type="number" min=0 max=600 onchange=polasuwaki()></td> <td align=right>y</td> <td>(1..600)</td> <td><input type="range" id="ry0" min=0 max=600 onchange=suwakipola()> </td> <td><input id="vx0" type="number" min=-500 max=500 onchange=polasuwaki()></td> <td align=right>vx</td> <td> (-500..500)</td> <td><input type="range" id="rvx0" min=-500 max=500 onchange=suwakipola()></td> <td><input id="vy0" type="number" min=-500 max=500 onchange=polasuwaki()></td> <td align=right>vy</td> <td>(-500..500)</td> <td><input type="range" id="rvy0" min=-500 max=500 onchange=suwakipola()> </td> <td><input id="fw0" type="number" min=0 max=500 onchange=polasila()></td> <td align=right>siła</td> <td>(0..500)</td> <td><input type="range" id="rfw0" min=0 max=500 onchange=silapola()> </td> <td><input id="fk0" type="number" min=-90 max=90 onchange=polasila()></td> <td align=right>kąt</td> <td>(-90..90)</td> <td><input type="range" id="rfk0" min=-90 max=90 onchange=silapola()> </td> <td><input id="op0" type="text" size=6 onchange=polasuwaki()></td> <td align=right>opór</td> <td> (0,900..1,0)</td> <td><input type="range" id="rop0" min=900 max=1000 onchange=suwakipola()></td> <td><input id="sp0" type="text" size=6 onchange=polasuwaki()></td> <td align=right>sprężystość</td> <td>(0,0..1,0)</td> <td><input type="range" id="rsp0" min=0 max=1000 onchange=suwakipola()> </td> </table> <script> var c = c1.getcontext('2d') var w = c.canvas.width; var h = c.canvas.height; var skok = 10; var TIM; function pilka(x,y,r,kolor){ c.beginpath(); c.strokestyle=kolor;

c.fillstyle=kolor; c.arc(x, y, r,0, Math.PI * 2); c.stroke(); c.fill(); var r=10; var k="red"; var x=r; var y=h-r; var vx=55; var vy=-100; var dt=0.1; //przyrost czasu var g=9.81; var opor=0.99; var spr=0.9; var animuj=true; rys0.checked=true; function Fsila(fx,fy){ return Math.pow(parseFloat(Math.pow(fx,2)) + parsefloat(math.pow(fy,2)),0.5); var Fw=Fsila(vx,vy); function Fkat(fx,fy){ return (Math.atan(fy/fx)*180)/Math.PI; var Fk=Fkat(vx,vy); function ZmianaKoloru(){ k=kol0.value; //położenie początkowe i wektor prędkości function RysujArmate(){ var Wx0=parseFloat(x0.value); var Wy0=parseFloat(y0.value); var Wvx0=parseFloat(vx0.value); var Wvy0=parseFloat(vy0.value); var Wx=Wx0+Wvx0; var Wy=Wy0+Wvy0; pilka(wx0,wy0,2,"black"); c.beginpath(); c.moveto(wx0,wy0); c.lineto(wx,wy); c.stroke(); pilka(wx,wy,1,"black"); function StartStop(){ animuj=!animuj; if (animuj) {czas=settimeout(grawitacja,skok) cleartimeout(tim); function OdNowa(){ animuj=true; PolaZmienne(); czas=settimeout(grawitacja,skok); function CzyscEkran(){ c.clearrect(0, 0, w, h); c.strokerect(0, 0, w, h); RysujWektory(); //zmienne przenosimy do pól tekstowych i na suwaki function ZmiennePola(){ r0.value=r; Rr0.value=r; x0.value=x; Rx0.value=x; y0.value=y; Ry0.value=y; R //zmieniamy suwaki prędkości - zmiana na sile i kącie Fw=Fsila(vx,vy); Fk=Fkat(vx,vy); Fw0.value=Fw; RFw0.value=Fw; Fk0.value=Fk; RFk0.value=Fk; op0.value=opor; Rop0.value=opor*1000;

sp0.value=spr; Rsp0.value=spr*1000; ZmiennePola();//za pierwszym razem //z pól tekstowych na zmienne - zamiana na liczby function PolaZmienne(){ r=parsefloat(r0.value); x=parsefloat(x0.value); y=parsefloat(y0.value); vx=parsefloat(vx0.value); vy=parsefloat(vy0.value); //wpisano w pola to też obliczamy siły od nowa Fw=Fsila(vx,vy); Fk=Fkat(vx,vy); Fw0.value=Fw; RFw0.value=Fw; Fk0.value=Fk; RFk0.value=Fk; opor=parsefloat(op0.value); spr=parsefloat(sp0.value); //z suwaków na pola tekstowe - do zmiennych nie trzeba bo automat w programie function SuwakiPola(){ r0.value=rr0.value; r=r0.value; x0.value=rx0.value; y0.value=ry0.value; vx0.value=rvx0.value; vy0.value=rvy0.value; //zmiana vx lub vy to zmiana siły i kąta Fw=Fsila(vx0.value,vy0.value); Fk=Fkat(vx0.value,vy0.value); Fw0.value=Fw; Fk0.value=Fk; RFw0.value=Fw0.value; RFk0.value=Fk0.value; op0.value=rop0.value/1000; sp0.value=rsp0.value/1000; //zmiana pól powoduje zmianę na suwakach //opór i sprężystość na zwykłych polach tekstowych //bez siły i kąta - osobno function PolaSuwaki(){ Rr0.value=r0.value; r=r0.value; Rx0.value=x0.value; Ry0.value=y0.value; Rvx0.value=vx0.value; Rvy0.value=vy0.value; Rop0.value=op0.value*1000; Rsp0.value=sp0.value*1000; //zmiana siły i kąta na suwakach - obliczyć i wstawić do pól vx i vy function SilaPola(){ var sila=rfw0.value; var kat=rfk0.value; Fw0.value=sila; Fk0.value=kat; //obliczyć vx i vy vx=math.cos(kat*math.pi/180)*sila; vy=math.sin(kat*math.pi/180)*sila; //do pól i na suwaki vx i vy R //zmiana w polach - powoduje zmianę na suwakach vx i vy function PolaSila(){ var sila=fw0.value; var kat=fk0.value; RFw0.value=sila; RFk0.value=kat; vx=math.cos(kat*math.pi/180)*sila; vy=math.sin(kat*math.pi/180)*sila; //do pól i na suwaki vx i vy R //pętla główna function grawitacja() { if (rys0.checked) { c.clearrect(0, 0, w, h);

c.strokerect(0, 0, w, h); RysujArmate(); pilka(x,y,r,k); x=x+vx*dt; y=y+vy*dt; vy=vy+g*dt; vx=vx*opor; vy=vy*opor; //przy odbiciu od ziemi uwzgledniamy //promien kulku i predkosc kulki //gdy sie odbija to nie zwiekszamy predkosci //dlatego jest za kazdym razem ujmowana -g*dt if (y>h-r-vy*dt){vy=-(vy-g*dt)*spr cleartimeout(tim); TIM = settimeout(grawitacja, skok); grawitacja(); </script>