Flash diagramok

Sziasztok! Gyors bemutatkozás. Szakszon Péternek hívnak, én lennék a másik cikkíró Polonkai Gábor mellett. Ahogy az időm engedi, úgy fogok írni, de mindenképp megpróbálok hetente legalább egy cikket összehozni. Ennyit rólam. Lássuk mivel is fogunk foglalkozni most.

Néhány népszerűbb Flash alapú diagramot fogunk összehasonlítani és a cikk végén egy kis sebességtesztre is sort kerítünk. Biztos felmerül bennetek a kérdés, hogy a Flash-nek mi köze a PHP-hoz. A válasz az, hogy semmi. A diagramok dinamikus adatgenerálásához már annál inkább van köze. A terítékre kerülő megoldások közül egyesek szorosabban, míg mások kevésbé szorosabban kapcsolódnak a PHP-hoz. Illetve sok PHP programozó nem csak szerver, hanem kliens oldalon is dolgozik és a flash alapú diagramokkal igényes és szép weboldalakat tudunk létrehozni. Egy szó, mint száz, nem hátrány, ha megismerünk néhányat közülük.

A következő Flash alapú diagramok kerülnek terítékre

• AmCharts
• PHP/SWF Charts
• FusionCharts (Free v2)
• Open Flash Charts

Összehasonlító táblázat

Diagramtípusok

Az egyes diagramok honlapján a galériában online meg is tekinthetjük mindet.

Nyílt forráskód vs. Zárt forráskód

Az Open Flash Chart-ot, mivel nyílt projekt, letöltve megkapjuk az egész forráskódját, ellentétben a többi diagrammal. Az Amcharts-ot és a PHP/SWF-ot kétféle liszensszel is meg lehet vásárolni, egy olcsóbbal vagy egy drágábbal, de egyik esetben sem mellékelik a Flash diagram forráskódját. Amcharts diagramokon a linktől már 85 euro fejéban szabadulhatunk meg, a PHP/SWF korlátozásaitól pedig már 45 dollár ellenében. A FusionCharts pedig 5 féle liszensszel kapható és csak a legdrágább (1999 dollár) liszensz tartalmazza a teljes forráskódot.

Az Open Flash Chartot kivéve mindegyik rendelkezik valamilyen limitációval a megvásárolható verzióhoz képest. A legkevesebb korlázotás az Amcharts diagramjain van. Minden diagram bal felső sarkában megjelenik a honlapjukra mutató link. Ettől 85 euro fejében már megszabadulhatunk. Némileg több limitációja van a PHP/SWF-nek, melynél ha a diagramra kattintunk, akkor a PHP/SWF honlapjára jutunk, nincs technikai támogatás sem és a diagramot nem tudjuk beilleszteni másik flash videóba. Ezen limitációknak már 45 dollár kifizetésével búcsút mondhatunk. A legtöbb korlátozással a FusionCharts Free v2 rendelkezik a 3-as verzióhoz képest. A lista eléggé hosszú, éppen ezért nem írom le őket, viszont itt mindenki megtekintheti melyek ezek. A FusionCharts liszenszeinek részletes leírás itt található.

Flash Player verzió

Az Amcharts és az Open Flash Chart esetében a 8 vagy nagyobb veziójú, míg a PHP/SWF és a FusionCharts esetében 6 vagy nagyobb verziójú Flash player követelmény a futtatáshoz.

Konfigurálás + adatfájl formátuma + dinamikus generálás

Mindegyikre igaz, hogy adatfájlnak url-t megadva, képesek dinamikusan adatokat megjeleníteni, ugyanakkor manuálisan előállított fájlokat is átadhatunk nekik különböző formátumokban.

Az Amcharts esetén külön van választva a diagram általános beállítási a megjelenítendő adatoktól. Az általános beállításokat (például, hogy milyen formátumú az adatfájl, képként kiexportáló szkript url címe, stb) egy XML alapú konfigurációs fájl segítségével végezhetjük el. Adatfájlokból CSV illetve XML formátumú fájlokat képes megjeleníteni. További lehetőség, hogy konfigurációs opciókat illetve adatokat direktben is adhatunk át a Flash objektumnak a HTML kódban.

A többi diagram esetében nincs külön konfigurációs fájl. Az olyan opciók mint például a diagram címe, háttérszín, stb, az adatfájlba vannak belekódolva. A PHP/SWF csak XML formátumú adatfájlokat képes megjeleníteni és az Amcharts-tal ellentétben nincs lehetőség az adatok direkt átadására sem. Az adatfájl a mellékelt php szkript segítségével generálható, melyhez legalább PHP 4-et vagy újabbat ajánlanak a fejlesztők, de valószínűleg a korábbi PHP verziókkal is működne az adatfájlgenerálás.

A FusionCharts is csak XML formátumú adatfájlt képes megjeleníteni és itt sincs lehetőség az adatok direkt átadására HTML kódban.

Az Open Flash Chart pedig szöveges adafájlokat képes ábrázolni, melyeket a különböző nyelven (PHP, ASP.NET, Ruby, Python, stb) mellékelt könyvtárak segítségével dinamikusan generálhatunk.

Diagramok kiexportálása képként

Ezen ingyenes diagramok közül kizárólag az Amcharts esetén van lehetőség képként elmenteni a diagramot. Ez a funkció csak webszerveren működik. PHP illetve ASP nyelven megírt kiexportáló szkripteket a diagramokkal együtt tölthetjük le. JSP nyelvű szkriptet nem mellékeltek, viszont a PHP vagy ASP szkriptetket áttanulmányozva nagyon könnyen megírható JSP-re is ez a funkció. Viszont a fejlesztők figyelmeztetnek minket, hogy ez a művelet lassú és eléggé CPU igényes a kliensre éppúgy, mint a szerverre, mivel a Flash diagram sok adatot küld a kiexportáló szkriptnek. A diagram méretének növelése csak csak tovább ront a helyzeten. Nálam a kiexportálás hatásásra a Firefox 70%-os CPU használatot produkált10 másodpercen keresztül a letöltött Ampie (kör és fánk) diagram példakódjával. Megnövelve a példadiagram méretét 520×400-ról 1024×768-ra a kiexportáláskor a Firefox már 80% CPU-t használt 25 másodpercen keresztül. A képet előállító példa PHP szkript szinte azonnal visszaadta a képet letöltésre, viszont egy publikus oldalon sok kérés esetén nagyon leterheli a szervert. PHP esetén a GD függvénykönyvtárat használja a kép előállítására. Mindezek után nagyon megfontolandó, hogy ezt a funkciót egy nyilvános oldalon bekapcsoljuk-e vagy sem a szerver terhelése miatt.

A maradék 3 diagram közül, legalább is az ingyenes verziók közül, egyiksem támogatja a képként való kiexportálást. Viszont a FusionCharts 3-as verziójában (ami fizetős) van lehetőség rá.

Vezérlés Javascript-tel

Minden diagram esetén van néhány műveletet melyet, Javascript segítségével is el tudunk végezni a diagram betöltődése után. Kinél több kinél kevesebb. Az OFC esetén csak a diagram frissítését hívhatjuk meg Javascript-tal. Az Amcharts és a PHP/SWF diagramok esetén direktben adhatunk meg adatokat, illetve a adat ulr-t is kicserélhetjük ha szükséges. A FusionCharts esetén az ingyenes verzióban csak az adatok direkt megadására van lehetőség, az adat url-t csak a 3-as fizetős verzióban tudjuk kicserélni Javascript-tal. Viszont nem is szükséges a adat url kicserélése, hiszen AJAX -szal onnan kérünk le adatokat ahonnan csak akarunk és azokat direktben beállítjuk. Persze ez kicsit több kódolást igényel.

Testreszabhatóság

Mindegyikről elmondható, hogy a diagramjaik teljesen testre szabhatóak, bőséges beállítási lehetőségek vannak.

Dokumentáltság

Az Open Flash Chart kivételével az egyes diagramok honlapjain nagyon részletes, példakkal illusztrált referencia dokumentáció van. Az Open Flash Chart honlapján viszont tutorial jellegű oldalakon keresztül ismerhetjük meg a képességeket.

Sebességteszt

Végeztem némi sebességtesztet is, 10, 100, 1000 és 10000 adatot jelenítettem meg oszlopdiagramokban. A tesztkörnyezet a következő volt:

• Asus notebook
• Intel Core Solo T1350 CPU
• 2GB RAM
• Firefox 2.0.0.13
• Adobe Flash Player 9
• Gentoo Linux op. rendszer

Az időeredmények a következőképpen alakultak:

10000 darab adatnál a CPU 100%-on dolgozott és a Flash Player kb fél percenként feldobott egy ablakot, melyben figyelmeztet, hogy egy szkript a Flash lejátszó lassú müködését eredményezi és meg kívánom-e szakítani a szkript futását. Persze kitartóan nyomogattam a Nem gombra.