V tomto článku ukážu jaké se dají v APEXu tvořit grafy. A na konci nějaké přidám na dashboard v aplikaci Zaměstnanci.
V každém workspace na apex.oracle.com jde nainstalovat takzvané “Packaged applications”. Jde o aplikace vytvořené Oraclem, které ukazují možnosti APEX prostředí a všechny jeho prvky. Dnes proto sáhnu do těchto aplikací a ukážu co všechno obsahuje ta s názvem Sample charts.
Nejdříve si tuto aplikaci nainstaluji. Najdu ji v záložce Packaged apps. Kde si vyberu danou aplikaci a projdu procesem instalace.
Nyní ukážu co všechno se v aplikaci nachází. Najdu ji mezi svými aplikacemi v app builderu.
Nyní ukážu konkrétní příklad, bude to klasický barchart (sloupcový) a poté dashboard. Všechno co se nachází v této aplikaci, je možné použít. Stačí otevřít stranu v editoru a mám přístup ke kódu a nastavení grafu.
Ke každému grafu dopsali vývojáři i různá nastavení a k některým dokonce i zdrojový kód daného regionu. Je proto velmi jednoduché, některý z grafů použít.
Aplikace obsahuje i ukázkový dashboard a to jak tenhle kombinovaný tak s použitím pie charts (kruhové grafy).
Nyní si vyberu jeden graf a ten použiji v aplikaci zaměstnanci. Protože jediné data, která se tam nyní nachází, jsou jména zaměstnanců. Dále jejich věk a plat. Já použiji některý z grafů zobrazující kombinaci. Například plochu a linku.
Po tom co si vyberu graf, jednoduše se přepnu do editačního módu a podívám se jakými daty je graf naplněn. Popřípadě jaké má další nastavení. Pro přechod do editačního módu můžu kliknout edit page, nebo si vybrat rovnou komponentu, kterou chci editovat.
Nyní se podívám jakého je graf typu, jak je nastavený a čím se plní. Jde o kombinaci dvou grafů.
Nyní už nezbývá nic jiného, než takový graf vytvořit z dat, které mám k dispozici v tabulce zaměstnanců. Vytvořím ho na straně dashboardu. Prvně vytvořím samotný graf a přidám do něj obě části. Pro jistotu jsem si opsal SQL querry z obou grafů v kombinaci, abych věděl jak formulovat svou querry.
Nyní naplním jednotlivé série sql kódem. Použiji name a salary jednotlivých zaměstnanců. Pro linii poté průměr.
Tak první část bych měl, nyní nastavím linii s průměrem.
Kód pro linku jsem zkopíroval a upravil aby seděl pro mou tabulku. U všech grafů se dá nastavit i barva, styl a další věci. Nastavení je opravdu detailní. Nesmím zapomenout nastavit graf na horizontální zobrazení v jeho atributách. Ještě jsem přejmenoval názvy sérií area a line na Salary a Average salary.
A takhle vypadá výsledek.
V dalším gifu ukážu jak nastavit některé vychytávky. Jako animace, chování kurzoru a například legendu.
A tohle je finální graf.
Je to velmi jednoduché. Podobně jako tenhle, je možné použít všechny ostatní grafy. Kdykoliv si nevím rady s nastavením, mohu se podívat do Sample charts jak se to dělá.
V dalším článku se podívám, jak se dá v apexu připravit strana uzpůsobená k tisku, a jak se dá exportovat jednotlivé reporty do excelu.
Zde je odkaz do aplikace, ve které jsem vytvářel graf.