CabriJava — dynamická geometrie na WWW Miroslav Lávi ka, KMA FAV Z U v Plzni
Co je CabriJava? CabriJava je software, který umož uje publikovat na internetu dynamické geometrické obrázky vytvo ené v programu Cabri II. P edpokladem pro uživatelský p ístup k vystaveným obrázk m CabriJavy je znalost práce s internetovým prohlíže em, výhodou je samoz ejm zkušenost s geometrickým programem Cabri. Uživatel pot ebuje pouze prohlíže , který podporuje Javu. Chceme-li se sami stát tv rci WWW stránek s dynamickými Cabri obrázky, potom je znalost práce s vlastním Cabri nutností, dále bychom m li n co v d t i o tzv. HTML jazyku a samoz ejm ovládat CabriJavu (sta í jen velmi skromné základy). Podobn jako v jiných oborech otevírá CabriJava cestu k tvorb u ebních text z geometrie pro r zné formy distan ního studia prost ednictvím internetu.
Jak rozhýbat web pomocí dynamické geometrie? Je n kolik ešení, jak využívat a sdílet dynamické Cabri obrázky pomocí internetu. Nejobvyklejší formou je pou ný hypertext vystavený na WWW stránce, který odkazuje na Cabri obrázky. Jako uživatelé si obrázky stáhneme z webovského serveru ve form soubor typu .fig, otev eme je v Cabri lokáln instalovaném na svém po íta i a manipulujeme s nimi podle návodu. Klasická webovská animace není pro naše ú ely nejvhodn jší: její tvorba je pom rn náro ná, p edevším však dává minimální možnosti pro interaktivitu. P ístupem, který nejvíce sleduje vlastní práci s Cabri (dynami nost, interaktivita), je pojetí uplat ované v CabriJav . S vystavenými objekty m že uživatel pohybovat a dynamicky tím m nit situaci na nákresn , aniž by m l instalován program Cabri. Jsme-li navíc tv rci webovských stránek, pak oceníme p edevším úsporu asu. Jakmile máme jednou obrázek vytvo ený v Cabri, je otázkou jen n kolika málo minut umístit jej na web. CabriJava, jak název napovídá, byla vytvo ena pomocí populární Javy, což je na platform nezávislý, objektov orientovaný programovací jazyk vyvinutý spole ností Sun Microsystems. Do webovské stránky se vkládají tzv. aplety, což jsou programy napsané ve zmi ovaném jazyce Java, které se spoušt jí prost ednictvím prohlíže e WWW stránek. Uživatelé, kte í nebudou WWW stránky sami vytvá et, nemusejí v d t o Jav v bec nic. Pro ty, kte í si budou chtít vyzkoušet, jak vytvo it vlastní WWW stránku s dynamickou geometrií, uvedeme jen nezbytné, ale posta ující základy v záv re ném rychlokursu tvorby webovských stránek s CabriJava aplety.
Historie CabriJavy Po átek spadá do roku 1996, kdy Gilles Kuntz zahájil na p d Univerzity Josepha Fouriera v Grenoble, kde již p edtím vznikly pod vedením Jean-Marie Laborda všechny verze programu Cabri, práce na jeho internetové nadstavb . Pracovní verze programu jsou pr b žn
k dispozici na internetu. V prvních verzích CabriJavy chyb la podpora n kterých objekt (nap . kuželose ky, množiny objekt ) a n kterých dalších funkcí Cabri. Na internetu tak nemohly být vystaveny všechny obrázky, které bylo možné vytvo it v Cabri. To je však již dávno minulostí a aktuální verze (v dob vzniku lánku stále ješt ne definitivní) nás již p i tvorb dynamických obrázk tém neomezuje.
Jak uživatelsky pracovat s WWW stránkou, na níž jsou CabriJava aplety? Hned na za átku je nutné upozornit na základní rozdíl mezi Cabri a CabriJavou — pomocí Cabri vytvá íme na nákresn (obrazovce) geometrické objekty (jako nap . body, p ímky, úse ky, kružnice, kuželose ky apod.). CabriJava oproti tomu „jen“ pomáhá zobrazit výsledný obrázek na webu se zachováním dynamických prvk Cabri. Uživatel, který si prohlíží vystavený obrázek, již nemá p ístupné nabídky s nástroji Cabri. M že jen p etahovat objekty po nákresn , tím m nit jejich polohu, pop . tvar, velikost a tak modifikovat i objekty od nich odvozené, nem že však již žádný další objekt p idat. K dispozici jsou jen nástroje CabriJavy umíst né na lišt v dolní ásti okna apletu. Natahování WWW stránky s javovským apletem trvá obecn o n co déle než je tomu u standardní stránky obsahující pouze text. D vodem prodlevy je náro n jší komunikace mezi naším po íta em a vzdáleným webovským serverem, na kterém jsou aplet a samotný Cabri obrázek uloženy. Postupn se nám na stránce vymezí okno apletu — p eddefinovaný prostor, ve kterém se bude odehrávat interaktivní geometrická situace, a do n j se nahraje obrázek. Nástrojová lišta (pokud nebylo její zobrazení naprogramováno, poklepeme v okn apletu) nám dává k dispozici n kolik funkcí (viz obr. 1) — krokování konstrukce vp ed a vzad (obdoba historie v Cabri), možnost posouvat obrázek v okn apletu, aktivaci stopy zvoleného objektu, anima ní pružinu a možnost stáhnout si originální Cabri obrázek. P iblížíme-li se kurzorem do blízkosti objektu, zobrazí se stejn jako v Cabri jeho identifikace — Tento bod, Tato p ímka, Tento trojúhelník, Tato kuželose ka apod.
Obr 1. Nástrojová lišta a její funkce
P íklad 1. P esv d te se, že výšky v libovolném trojúhelníku procházejí spole ným bodem. Podívejme se nyní na konkrétní p íklad stránky s CabriJava apletem, která je v nována u ivu 6. ro níku základní školy (m že se nap . jednat o stránku z internetové u ebnice, kterou dáme žák m k prostudování formou vlastního experimentování). Po nahrání WWW stránky máme k dispozici výkladový text a okno apletu, ve kterém je znázorn n trojúhelník ABC s výškami (viz obr. 2). Všechny t i procházejí jedním bodem a tato situace se nezm ní, budou-li uživatelé tahat za jednotlivé vrcholy a trojúhelník tak deformovat. P itom mohou pozorovat, kam padne ortocentrum v závislosti na typu trojúhelníka. Je vid t, že CabriJava s sebou p ináší ješt jeden užite ný efekt: na stránce není nutní vystavovat t i samostatné (ale hlavn statické) obrázky — jeden s ostroúhlým, druhý s pravoúhlým a t etí s tupoúhlým trojúhelníkem. Každou situaci je možné pohodln vymodelovat v okn apletu.
Obr 2. Okno prohlíže e po na tení stránky obsahující nau ný text a aplet CabriJavy.
P íklad 2. Sestrojte kružnici opsanou trojúhelníku ABC. I další možnosti CabriJavy si ukážeme na jednoduchém p íkladu z u iva 6. ro níku ZŠ. Tentokrát už použijeme nástrojovou lištu — konkrétn funkce Krok vp ed a Animace krok za krokem. Na obrázku je nejprve vykreslen trojúhelník ABC. Stiskneme tla ítko Krok vp ed na nástrojové lišt , ímž se objeví osa strany. Dalším stiskem téhož tla ítka sestrojíme další osu a takto postupujeme až k finálnímu kroku konstrukce kružnice opsané trojúhelníku ABC (viz obr. 3). Samoz ejm je možné se vrátit i o krok zp t a ur itou fázi konstrukce si projít ješt
jednou. Obrázek lze p itom dynamicky m nit taháním za vrcholy a m žeme tak pozorovat, kam padne st ed kružnice opsané pro r zné typy trojúhelník — op t v jediném obrázku na WWW stránce. Tento p íklad názorn ukazuje jiný typ využití CabriJavy v internetových u ebnicích p i výkladu látky. Je lépe, je-li žák sv dkem pr b hu konstrukce krok za krokem, než aby musel dešifrovat v hotovém obrázku, co bylo sestrojeno nejd íve, co poté a co nakonec. Pro „ušet ení práce“ jsme tu rovn ž mohli využít jinou funkci nástrojové lišty, Animaci krok za krokem. Jedná se prakticky o totéž s tím rozdílem, že se jednotlivé konstruk ní kroky provád jí automaticky a ne eká se na stisk tla ítka.
Obr 3. Okno apletu postupn zachycující vybrané konstruk ní kroky
P íklad 3. Jsou dány body A, B a kružnice k. Ur ete množinu t žiš trojúhelník ABC, kde vrchol C leží na kružnici k. Na tomto míst p edstavíme nástroj lišty Stopa objektu, který umož uje vykreslit stopu pohybujícího se objektu. Na nástrojové lišt aktivujme funkci zanechávání stopy (Stopa ano/ne), klepneme na t žišt T, ímž jej ozna íme pro zanechání stopy, a op tovným klepnutím na tla ítko Stopa ano/ne p epneme kursor zp t do p vodního stavu. Táhneme bod C po kružnici k a sou asn dochází k „razítkování“ nákresny bodem T (viz obr. 4a). Pohyb bodu C po kružnici je možné realizovat i pomocí tzv. anima ní pružiny. Bod T necháme
ozna ený tak, aby zanechával stopu, navíc k bodu C p iložíme nataženou pružinu (na nástrojové lišt aktivujeme Natáhnout pružinu). Pohyb se pak uskute ní i bez našeho ru ního p i in ní (viz obr. 4b).
Obr. 4a Vytvá ení stopy t žišt taháním bodu bodu C po kružnici ru n
Obr. 4b Anima ní pružina nasazená na bod C.
Zastavme se ješt krátce u p edcházejícího p íkladu. Výše uvedená ukázka zachycující práci se stopou názorn demonstrovala genezi hledané množiny t žiš . K prezentaci závislosti výsledné kružnice na daných prvcích je však stopa — stejn jako v Cabri — nepoužitelná, nebo nesdílí dynamiku konstrukce. K tomuto ú elu by se spíše uplatnila množina objekt , která je známa z Cabri. Zm nou tvaru trojúhelníka nebo jeho polohy v i dané kružnici se pak aktuáln p ekresluje i množina t žiš (viz obr. 5). Ovšem vzhledem k nemožnosti p idávat do apletu nové objekty je nutné, aby tato množina byla vykreslena již ve zdrojovém Cabri obrázku p ed jeho vystavením na web pomocí CabriJavy.
Obr 5. Zm na výchozí situace p ináší aktuální p ekreslení množiny bod .
Poznamenejme ješt , že originální Cabri obrázek, který je uložen na webovském serveru, k n muž jsme se p ipojili, je nám rovn ž k dispozici. M žeme si jej stáhnout — sta í jen využít funkci Stažení obrázku Cabri, která je také umíst na na nástrojové lišt . S obrázkem pak m žeme dále pracovat s využitím všech nástroj Cabri — máme-li je ovšem na svém po íta i instalováno. P íklady, na nichž jsme CabriJavu popisovali v tomto lánku, byly zám rn z geometrického hlediska velmi jednoduché. P ínos popisované metody pochopiteln roste s náro ností prezentované látky.
Tvorba vlastních WWW stránek s CabriJava aplety. Jak na to? Tento rychlokurs je v nován t m, kdo cht jí aktivn vytvá et webovské stránky ilustrované dynamickými geometrickými obrázky. Jakmile prohlíže natáhne WWW stránku, objeví se vymezený prostor, ve kterém se bude odehrávat dynamická geometrie. Do tohoto „okna“ pak sm uje výstup apletu. Jeho základem je obrázek uložený v souboru s p íponou .fig, který jsme p ed tím vytvo ili programem Cabri. Program Cabri a jeho zvládnutí je proto nezbytnou podmínkou pro tvorbu obrázk . Zbývá už jen integrovat obrázek do WWW stránky ve form CabriJava apletu. K tomu sta í provést následující posloupnost krok : 1. Vytvo te obrázek pomocí Cabri II — m žete použít verze pod Windows, DOS nebo MacOS. 2. Vytvo te WWW stránku s doprovodným textem. 3. Abyste si mohli práci vyzkoušet na svém po íta i, stáhn te si poslední verzi souboru CabriJava.jar (http://www-cabri.imag.fr/cabrijava/CabriJava.jar) a umíst te jej do toho adresá e, v n mž máte uloženy i Cabri obrázky. Archív CabriJava.jar obsahuje všechny soubory CabriJavy v komprimované podob . 4. Do zdrojového kódu WWW stránky p idejte následující ádky (pouze tu né ádky jsou povinné!): <APPLET CODE="CabriJava.class" archive="CabriJava.jar" WIDTH=600 HEIGHT=400>
Jakmile prohlíže najde ve zdrojovém kódu párový p íznak <APPLET>, nahraje zadaný aplet z webovského serveru a spustí jej. Zmín ný p íznak umož uje p edávat informace o apletu (název, velikost vyhrazeného prostoru, umíst ní vzhledem k ostatnímu textu apod.). Programáto i píší zdrojový kód apletu v jazyce Java (soubory s p íponou .java), vytvo ené soubory zkompilují p eklada em Javy a obdrží binární soubory s p íponou .class (tzv. t ídy Javy), na které se pak odkazuje ve zdrojovém kódu webovské stránky. My se však o tvorbu t íd nemusíme starat, pro naše speciální geometrické ú ely nám totiž vše p ipravili již profesionálové v Grenoblu, odkud jsme si pot ebné t ídy stáhli (soubor CabriJava.jar).
Záv rem se seznámíme s n kterými parametry Javy obecn vysv tlíme si jejich význam. •
a CabriJavy speciáln
a
povinné parametry Javy: CODE: indikuje název t ídy Javy (zde CabriJava.class), která se má vykonat. V názvu je nutné p esn dodržet velká a malá písmena!
o
WIDTH a HEIGHT: vymezují velikost oblasti, do níž má aplet výstup (v pixelech) o
•
nepovinné parametry Javy: CODEBASE: ur uje cestu do adresá e obsahujícího soubory t íd Javy (m že být umíst n i na jiném serveru, lze tedy místo stahování odkázat na soubor uložený na serveru UJF v Grenoble — viz 3. bod návodu)
o
ARCHIVE: indikuje, že t ídy jsou obsaženy v komprimovaném souboru (formát nazývaný v Jav jar — jako java archiv) — v p ípad CabriJavy používáme vždy a zadáváme CabriJava.jar o
o ALIGN neboli pozice: umís uje aplet Javy vzhledem k okolí (top, bottom, middle, left, right,…) — obdobné jako p i umís ování jiných obrázk na WWW stránku •
povinné parametry CabriJavy parametrem lang zadáváme jazyk komunikace ('cs' – eština, 'de', 'en', 'es', 'fr', ' it', 'nl', 'pt') o
parametrem file odkazujeme na jméno a uložení zobrazovaného Cabri obrázku (souboru s p íponou .fig) nepovinné parametry CabriJavy: o
•
o background neboli pozadí: cesta k obrázku ve formátu GIF nebo JPEG, který se použije pro podklad apletu
bgcolor neboli barva pozadí: udává barvu pozadí pomocí šestnáctkového kódu RGB — p ednastavena bílá
o
border neboli ohrani ení: íslo udávající ší ku orámování — p ednastaveno 1 o
bordercolor neboli barva ohrani ení: udává barvu orámování pomocí šestnáctkového kódu RGB — p ednastavena erná o
Pro zadávání charakteristik apletu m žete použít i moderní HTML editory (nap . voln ši itelný FrontPage Express), pomocí nichž lze aplet specifikovat velice snadno a rychle. Podívejme se na další nepovinné, ale velice užite né rozši ující parametry CabriJavy, které souvisejí s funkcemi již zmín né nástrojové lišty: •
autocontrol: ovládací lišta se automaticky zobrazí na za átku p i spušt ní apletu (obecn je p ednastaveno "false"; je-li sou asn použit i parametr step, pak je p ednastaveno "true")
•
trace: definice objekt , které mají zanechávat stopu v p ípad pohybu — nap . "point 10" *). Stopa se pak vytvo í, i když uživatel žádný objekt neozna í; mohlo být využito nap . v p íkladu .3
•
spring: definice anima ní pružiny zp sobí automatickou animaci hned po nahrání apletu) — nap . "segment 15 pos 82,92 size 7,19" nebo "point 6 size 38,-12" *)
•
step: definice posledního objektu, který se ješt zobrazí po nahrání apletu (ostatní objekty zobrazuje až uživatel stiskem tla ítka krok vp ed na nástrojové lišt ) — nap . "triangle 10" *).
Tímto parametrem ur ujeme zobrazené stádium rozpracovanosti konstrukce. Setkali jsme se s tím t eba u p íkladu . 2, kde prvním zobrazeným objektem byl trojúhelník, a koliv ve zdrojovém Cabri obrázku byly provedeny i následující kroky konstrukce kružnice opsané).
•
loop: konstrukce se automaticky a samovoln provádí krok za krokem (p ednastaveno "false"; jiná možná hodnota "true")
*) tyto interní identifikátory objekt se zobrazují p i stisku ALT, je-li zobrazena nástrojová lišta a ukážeme-li sou asn kurzorem na objekt nebo pružinu
Reference [1] Kuntz, G.: Dynamic Geometry and the World Wide Web: http://www.cabri.net/~kuntz/INET98/ [2] Oficiálná stránka CabriJavy: http://www.cabri.net/cabrijava/ [3] Poslední verze souboru CabriJava.jar: http://www-cabri.imag.fr/cabrijava/CabriJava.jar [4] Vrba, A.: Oživlá geometrie, MFI ro . 10 (2000), . 2 a 3 [5] Javovská nadstavba Sketchpadu: http://forum.swarthmore.edu/dynamic/java_gsp/ [6] Javovská nadstavba Sketchpadu: http://www.keypress.com/sketchpad/java_gsp/index.html [7] Oficiální stránka Javy spole nosti Sun: http://java.sun.com/ [8] Grand, M.: Java 1.1 Referen ní p íru ka jazyka, 2. vydání. Computer Press, 1998.