Canvas - Wolfenstein jako netradiční fotogalerie

27. 8. 2008 19:53 (aktualizováno) | Martin Hassman

Dnes si ukážeme některé netradiční fotogalerie, knihovnu pro panoramatické zobrazování a malou ukázku izometrického zobrazení. Jak již název napovídá, vše se týká nové HTML značky canvas.

Wolfenstein jako fotogalerie

Jacob Seidelin upravil svojí implementaci Wolfensteina pomocí JavaScriptu a canvasu a vyrobil z ní fotogalerii. Po nahrání levelu zadejte dole klíčové slovo (např. dog) a počkejte, až se natáhne a zpracuje několik fotografií s Flickeru (chvíli to trvá). Pak se můžete rozeběhnout po patře a na stěnách najdete jednotlivé fotky.

Fotogalerie uvnitř 3D prostředí hry Wolfenstein

Rozmisťujeme fotografie

I další příklad se týká fotografií. Jedná se o jednoduchý nástroj, jak z několika fotografií vytvořit jednoduchou koláž. S fotografiemi můžete pohybovat po obrazovce, zvětšovat je a otáčet jimi (při zkoumání zdrojového kódu si všimněte, že se jedná o kombinaci několika nezávislých JavaScriptových knihoven). Kromě základního dema je k dispozici i integrace s Flickerem (zadejte klíčové slovo, např. firefox a můžete třídit nalezené fotografie). Existuje i nezávislá integrace s Picasa. (Zdroj: Ajaxian)

[youtube zkuM9BptihI]

Rollmantic – rolujeme, otáčíme

Rollmantic je JavaScriptová knihovna pro tvorbu widgetů s panoramatickými fotkami. Nemá cenu, abych příklad detailně popisoval, vyzkoušejte sami. (Zdroj: Ajaxian)

Mám pocit, že práce s fotografiemi se za chvíli stane typickým use case canvasu a budeme se divit, jaktože ještě nedávno bylo v nativním prohlížeči něco takového nemožné. Nechme ale již fotografie fotografiemi.

Izometrické zobrazení

Řada her je postavena na izometrickém zobrazení. Philip Taylor vytvořil ukázku, že s takovým zobrazení možné pracovat i v canvasu. Už se těším, až se dočkáme implementace některých izometrických her.

Ukázka izometrického zobrazení v canvasu

Fraktál na dvaceti řádkách

Henri Mathieu (p01) v rámci ukázku se Sierpinského kobercem (pro ty, co jako já neznají, tak je to zase jeden fraktál). Ve zdrojovém kódu si můžete ověřit, je to skutečně 20 znaků na výšku. Ostatně na Henriho stránkách najdete podobných krátkých příkladů v JavaScriptu víc (Henri navíc nedávno nastoupil do Opera Software).

Sierpinskeho koberec

A to je pro dnešek všechno, pokračování příště.

  • 18. 8. 2008 21:15

    Numismatik (neregistrovaný)

    U toho Rollmantic se nejedna o nic extra. Vypada to, ze misto skutecneho panoramatickeho pohledu se spravnou projekci (navozujici prostorovy dojem) dela jen obycejny panning ploche fotky, jedno jestli panoramaticke nebo ne, bez transformace respektujici smer pohledu. Jak by to melo vypadat opravdu (verneji skutecnosti) maji treba na http://3dtour.cz . I kdyz tam za tim asi stoji neco vic, nez obycejny javascript.
    Ta uzkazka s 3D modelem je naopak docela pekna.

Přidávat nové názory je zakázáno.

120na80.cz: Tipy pro odvodnění organismu

Tipy pro odvodnění organismu

Měšec.cz: Se stavebkem k soudu už (většinou) nemusíte

Se stavebkem k soudu už (většinou) nemusíte

Lupa.cz: eIDAS: Nepřehnali jsme to s výjimkami?

eIDAS: Nepřehnali jsme to s výjimkami?

Měšec.cz: Co s reklamací, když e-shop krachuje?

Co s reklamací, když e-shop krachuje?

Lupa.cz: Kde v ČR není rychlý internet? Tady je mapa

Kde v ČR není rychlý internet? Tady je mapa

Podnikatel.cz: Nereaguje na výzvu ČOIky, zaplatí milion

Nereaguje na výzvu ČOIky, zaplatí milion

Podnikatel.cz: Fotogalerie: Jesenka už má skoro 50 let

Fotogalerie: Jesenka už má skoro 50 let

DigiZone.cz: Markíza HD a Dajto? U Digi TV asi minulost

Markíza HD a Dajto? U Digi TV asi minulost

Měšec.cz: Investice do drahých kovů - znáte základní chyby?

Investice do drahých kovů - znáte základní chyby?

Podnikatel.cz: Místa, kde hází podnikání klacky pod nohy

Místa, kde hází podnikání klacky pod nohy

Lupa.cz: IT scéna po brexitu: přijde exodus vývojářů?

IT scéna po brexitu: přijde exodus vývojářů?

Podnikatel.cz: Daň z nemovitosti? Změny budou v říjnu

Daň z nemovitosti? Změny budou v říjnu

Vitalia.cz: Bio vejce nepoznají ani veterináři

Bio vejce nepoznají ani veterináři

Měšec.cz: Dodavatele energií porovnáte snáz

Dodavatele energií porovnáte snáz

Měšec.cz: Kurzy platebních karet: vyplatí se platit? (TEST)

Kurzy platebních karet: vyplatí se platit? (TEST)

DigiZone.cz: Kauza technik: oficiální vyjádření Novy

Kauza technik: oficiální vyjádření Novy

DigiZone.cz: Sat novinky: pátý kanál maďarské televize

Sat novinky: pátý kanál maďarské televize

Podnikatel.cz: Eshop z ČR v Rumunsku? Žádná legrace

Eshop z ČR v Rumunsku? Žádná legrace

Vitalia.cz: Za zánět močových cest mohou plavky

Za zánět močových cest mohou plavky

DigiZone.cz: Hra o trůny: natáčení 7. řady posunuto

Hra o trůny: natáčení 7. řady posunuto