Vector Graph: Flashový generátor grafů

18.07.08

Tímto oficiálně představuji své další dítko, tentokrát flashový generátor sloupcových grafů — Vector Graph 1.0. Prozatím v jakési rané verzi, ještě toho moc neumí, ale to se časem bude zlepšovat. Už se pracuje na vyšší verzi ;-). Nejprve si prohlédněte, jak to celé vypadá:

Jak to funguje

Stáhnete si flashový swf soubor, kterému pomocí XML souboru předáte data, týkající se grafu, který chcete vykreslit. Flash si stáhne onen XML soubor, naháže ho do automatu a vyhodí vám graf. Co všechno si můžete nastavit? Prozatím toho moc není, ale již ve verzi 1.0 umí Vector Graph:

  • Nastavit až pět nezávislých grafů do jedné obrazovky (ale musí mít stejnou ypsilonovou osu). Mezi jednotlivými grafy je možné se přepínat pomocí záložek umístěným vlevo dole. Vše je doprovázeno jednoduchou animací.
  • Nastavit mezní hodnoty pro ypsilonovou osu (tedy začátek a konec).
  • V jednom grafu může být až sedm různých sloupečků. Pochopitelně s jinými hodnotami a různě pojmenované.
  • Můžete si pojmenovat graf.

Dokumentace

Na XML soubor se odkážete pomocí proměnné zdroj ve chvíli, kdy v HTML vkládáte flashový soubor do stránky. Příklad:

<param name="movie" value="grafy.swf?zdroj=pokus.xml" />

Tento příkaz odkazuje na soubor grafy.swf a předává proměnnou zdroj. Tato proměnná obsahuje název XML souboru, který bude později načten. To je k načítání XML souboru asi všechno, dávejte případně pozor na to, ať máte správně zadanou cestu.

XML soubor musí být uložen v UTF kódování. Struktura XML souboru je následující:

<grafy max="100" min="0" nazev="Podíl prohlížečů">
        <graf nazev="2007">
                <sloupec nazev="Firefox">30</sloupec>
                <sloupec nazev="Opera">10</sloupec>
                <sloupec nazev="MSIE">55</sloupec>
                <sloupec nazev="safari">5</sloupec>
        </graf>

        <graf nazev="2006">
                <sloupec nazev="Firefox">25</sloupec>
                <sloupec nazev="Opera">5</sloupec>
                <sloupec nazev="MSIE">70</sloupec>
        </graf>
</grafy>

Jako první musí být kořenový element grafy, který má tři atributy. První je max, což je maximální hodnota na ypsilonové ose. Atribut min je logicky minimální, spodní hodnota. V atributu nazev se skrývá obecný název celého seskupení grafů. Vevnitř tohoto elementu se pak nachází jednotlivé dílčí grafy, a to v elementu graf. Ten má pouze jeden atribut nazev. Tento atribut se zobrazí dole jako záložka. V tomto elementu se poté nachází samotné sloupečky grafu. V atributu nazev můžete opět specifikovat popis sloupečku a do těla elementu pak patří číselná hodnota položky. Pokud chcete více souběžných grafů, dejte je prostě za sebou, jako obsah elementu grafy. To je asi tak vše.

Co je v plánu

Tohle je samozřejmě příliš skromné, takže do budoucna jsou v plánu tyto věci:

  • Trochu hezčí grafický kabát. Tohle jsem zbastlil sám, podle toho to taky vypadá.
  • Větší možnosti nastavení: například jestli se má číslo ukazující hodnotu sloupečku ukázat až po animaci nebo už před ní, možnost zapnout/vypnout animaci.
  • Každý graf by mohl mít svou vlastní ypsilonovu osu.
  • Více barevných provedení, zelenočervená nemusí ladit ke každému webu.
  • Více typů grafů.

Chcete si to vyzkoušet?

Stačí si stáhnout swf soubor a už můžete pracovat.

Komentáře

  1. Muflo · 19. červenec 2008, 02:43 · #

    Pěkné :). Tak trochu mě to pobízí k opětovnému nahlédnutí flashe a actionscriptu. Nevím co se za posledních pár let všechno změnilo, ale předpokládám, že základ je stejný.

    Jinak jako ideální graf vidím generovaný např. pomocí PHP a cacheovaný. Nikdy si nemůžete být 100% jisti, že uživatel má plugin flash nainstalovaný.

    Nejlepší kombinace je asi zobrazovat graf pomocí flashe a v případě, že uživatel nemá nainstalován flash, zobrazovat graf pomocí obrázku.

  2. tiso · 19. červenec 2008, 22:22 · #

    Pre inšpiráciu:
    http://shemesh.axspace.com/…ataTipItems/

    via http://shemesh.wordpress.com/…he-easy-way/

Pošli komentář

Komentáře jsou moderované. Každý komentář musí před publikováním autor Laboratoře schválit. Komentáře, které jistě nebudou zveřejněny: vulgární, vyvolávající flame, netýkající se tématu, komentáře psané bez diakritiky (háčky, čárky).

Komentáře jsou uzavřeny