2012-01-30

Panoraamat ilmaiseksi nettiin, osa 2: tee-se-itse -ratkaisut

Kuten aikaisemmin raapustelin niin Internetissä on useampiakin mahdollisuuksia hostata panoraamakuvansa ilmaiseksi. Jos haluaa nähdä vähän vaivaa hostaamisen eteen niin DIY-mahdollisuuksiakin on muutamia, ilmaisiakin. Käyn alla läpi muutamia vaihtoehtoja: OpenZoom, Saladoplayer ja pan0.

Käytännössä OpenZoom ja Saladoplayer toimivat niin että ne yhden ison kuvan sijasta lataavat läjän pieniä kuvia - aina sen verran mitä kulloisenkin näytettävän ruudun näyttämiseen tarvitaan joten ne latautuvat nopeasti ja toimivat silkkisenpehmeästi. Näitä pikkukuvia kutsutaan Deep Zoom -laatoiksi (tai mikä liekään suomenkielinen termi sanalle tile tässä yhteydessä). Pikkukuvat ovat siis omissa hakemistoissaan zoomaustason mukaan järjestettynä, hakemiston juuressa on XML-tiedosto josta ilmenee valmiin kuvan resoluutio ja muita tarvittavia seikkoja kuvien renderöintiin. Esimerkiksi gigapikselipanoraaman XML-tiedosto näyttää seuraavanlaiselta:

<IMAGE_PROPERTIES WIDTH="71600" HEIGHT="14500" NUMTILES="21451" NUMIMAGES="1" VERSION="1.8" TILESIZE="256" />

Saladoplayer tarvitsee yhden litteän kuvapyramidin sijasta kuution sivujen kaikki kuusi kuvapyramidia (nk. cube mapping) joten XML-tiedostokin näyttää vähän erilaiselta, alla Alias Studioiden pallopanoraaman XML-tiedosto:

<?xml version="1.0" encoding="utf-8"?>
<Image TileSize="512" Overlap="1" Format="jpg" ServerFormat="Default" xmnls="http://schemas.microsoft.com/deepzoom/2009">
<Size Width="2560" Height="2560" />
</Image>

Näistä XML-tiedostoista nyt ei tarvitse sen ihmeemmin huolehtia, SaladoConverter ja Zoomify Converter luovat nuo automaattisesti kuvapyramidien luonnin yhteydessä. Koska tuloksena on hakemistollinen pikkuisia tiedostoja on niiden hostaaminen helpointa esim. palveluntarjoajan FTP-palvelimella tai vaikka Dropboxissa joka tarjoaa ilmaistilille kaksi gigatavua tallennustilaa. Kahteen gigaan mahtuu useampi sata panoraamaa - helpostikin.

OpenZoom

OpenZoom on pieni, nettisivuille upotettava Flash-objekti, kokonaan avointa lähdekoodia. Käytin itse alunperin Zoomifyn ilmaista Express-versiota, mutta kyseisessä versiossa ei ole täyden ruudun tilaa niin vaihdoin sitten OpenZoomiin. Zoomifyn mukana tulee kuitenkin Zoomifyer Droplet jolla voi kuvapyramidin tehdä, pudottaa vain haluamansa kuvatiedoston Zoomifyer Dropletin ikkunaan (kuvassa oikealla) ja odottaa hetkisen. Tuloksena on hakemistollinen kuvia ja edellämainitun kaltainen XML-tiedosto.

Jotta kuvansa saisi vielä suuren yleisön ulottuville, tarvitaan OpenZoom Nanon Flash-tiedosto, sen voi käydä lataamassa suoraan täältä, klikkaa hiiren oikealla napilla ja tallenna tiedosto kiintolevylle. Sen jälkeen ladataan kuvahakemisto XML-tiedostoineen palvelimelle ja upotetaan OpenZoomViewer.swf sivulle seuraavalla koodinpätkällä:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1024" height="400" />
<param name="movie" value="OpenZoomViewer.swf" />
<param name="scale" value="noscale" />
<param name="bgcolor" value="#FFFFFF" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="flashvars" value="source=/Panoraama/ImageProperties.xml" />
</object>

Flashvarsin source -kentän tulis osoittaa Zoomifyerin luomaan XML-tiedostoon, muuten upotusparametrit ovatkin itsestäänselvät. Esimerkkejä OpenZoomin käytöstä löytyy tästäkin blogista muutamia kappaleita tagin OpenZoom alta.

Saladoplayer

SaladoPlayer on myöskin avoimen lähdekoodin Flash-panoraamapyöritin. OpenZoomiin verrattuna se on vähän monimutkaisempi, muttei kuitenkaan kovin vaikea saada toimimaan jahka on tutustunut ohjeisiin. Upotusprosessi on kaikessa yksinkertaisuudessaan seuraava: 360x180 astetta kattava pallopanoraamatiedosto muutetaan SaladoConverterilla kuution tahkoiksi l. sivuiksi ja siitä edelleen Deep Zoom -kuvapyramideiksi, tehdään yksinkertainen XML-tiedosto joka ohjaa SaladoPlayerin toimintaa ja upotetaan itse SaladoPlayerin flash-tiedosto sivuille. Oikealla on esimerkki panoraamasta joka on muutettu kuution sivuiksi webbikatselua varten.

SaladoConverterin voi käydä lataamassa GitHubista, työkalut ovat Java-pohjaisia joten ne ovat sen suhteen alustariippumattomia. Ainakin Windowsilla jos haluaa satojen megapikseleiden tai jopa gigapikseleiden kokoisia pallopanoraamoja tuolla käsitellä, täytyy Javan olla 64-bittinen. SaladoConverterin voi tällöin ajaa 64-bittisenä kopioimalla SaladoConverterin ohjelmatiedostot Program Files -hakemistoon.

Itse SaladoConverteria käytetään lisäämällä pallopanoraamatiedosto(t) Add-näppylällä, valitsemalla tallennushakemisto Output-napilla ja klikkaamalla Run. Täytyy vain muistaa että alasvetovalikossa on valittu "Equirectangular to Deep Zoom cubic", jotta tiedostot ovat oikeanlaisia. Oikeastaan muita asetuksia joihin käyttäjän tarvitsisi koskea ei ole. Jos ohjelma kaatuu ja valittaa muistin vähäisyyttä niin asetuksista voi käydä varaamassa lisämuistia, kuusi gigatavua on riittänyt ainakin 800 megapikselin pallopanoraamalle ja ovatpa jotkut tuolla kuulema käsitelleet yli gigapikselinkin kokoisia tiedostoja.

Hetken odottelun jälkeen kiintolevyllä on uusi hakemisto, nimeltään dz_ ja alkuperäistiedoston nimi perässään. Hakemiston juuressa on XML-tiedosto, nimetty myöskin alkuperäistiedoston mukaan, esimerkiksi panoraama_f.xml. Myöskin samassa hakemistossa on läjä muita hakemistoja joissa on kuution jokainen sivu kuvapyramideineen. Tuota XML-tiedostoa ei sellaisenaan voi vielä käyttää mihinkään, vaan tarvitaan asetustiedosto sen kaveriksi joka ohjailee SaladoPlayerin toimintaa ja kertoo ohjelmalle mm. näytettävät panoraamat ja paljon muuta. Alla yksinkertainen esimerkkitiedosto, joka näyttää yhden panoraaman ja perustyökalurivin:

<?xml version="1.0" encoding="utf-8" ?>
<!-- Yksinkertainen XML-tiedosto SaladoPlayerille. -->
<SaladoPlayer>
    <global debug="false">
        <panoramas firstPanorama="panoraama_1"/>
    </global>
    <panoramas>
        <panorama id="panoraama_1" path="/panoraama_f.xml"/>
    </panoramas>
    <modules>
        <ButtonBar path="/ButtonBar-1.2.swf">
            <buttons path="/buttons_40x40_black.png">
                <button name="up"/>
                <button name="down"/>
                <button name="left"/>
                <button name="right"/>
                <button name="in"/>
                <button name="out"/>
                <button name="drag"/>
                <button name="hotspots"/>
                <button name="autorotation"/>
                <button name="fullscreen"/>
            </buttons>
        </ButtonBar>
    </modules>
</SaladoPlayer>

Panoramas-tagin sisällä listataan panoraamat jotka halutaan näyttää, tässä tapauksessa niitä on vain yksi: panoraama_f.xml. Modules-tagin sisällä on listattuna SaladoPlayerin lisämoduulit asetuksineen, tässä tapauksessa on ladattu ButtonBar-1.2.swf ja sille nappirivi erillisenä PNG-tiedostona, näiden molempien tiedostojen pitää sitten löytyä palvelimelta. Edellämainitut moduulit ja liuta muitakin tulee SaladoPlayerin mukana, niiden dokumentaatio löytyy SaladoPlayerin wikistä. Lisäksi tarvitaan seuraava HTML:n pätkä sivuille upotusta varten:

<object id="Panoraama" width="1024" height="720" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000">
<param name="FlashVars" value="xml=/panoraama.xml" />
<param name="play" value="true" />
<param name="loop" value="false" />
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="scale" value="showall" />
<param name="wmode" value="window" />
<param name="bgcolor" value="#FFFFFF" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="base" value="." />
<param name="movie" value="/SaladoPlayer-1.2.swf" /></object>

Kannattaa siis muistaa että tuo FlashVarsissa nimetty XML-tiedosto on tuo ylhäältä kopioitu ja tallennettu XML-tiedosto eikä SaladoConverterin luoma XML-tiedosto. Esimerkkejä SaladoPlayeristä löytyy tästäkin blogista tagin SaladoPlayer alta.

pan0

Viimeisenä ja vähäisimpänä vuorossa on pan0 a.k.a. fspp. Sekin on Flash-pohjainen pallopanoraamanpyörittelykikkare, tosin pan0 lataa koko pallopanoraamatiedoston kerralla - etuna se että käyttö on yksinkertaista, mutta toisaalta panoraaman maksimimitta rajoittuu reiluu 8000 pikseliin joka on siis Flashin rajoitus eikä täten kierrettävissä ainakaan triviaalisti.

Esimerkin pan0:n toiminnasta voi käydä vilkaisemalla täältä. Pallopanoraamakuva on muutaman megatavun kokoinen joten sen lataamista saattaa joutua odottelemaan muutaman sekunnin. Kuten näkee niin laatu ei ole kovin kummoista perusasetuksilla. Kuvat voi tietysti hostata missä haluaa kun ei tarvitse latailla hakemistoja tai XML-tiedostoja minnekään.

Related Posts Plugin for WordPress, Blogger...