Verschillen
Dit geeft de verschillen weer tussen de geselecteerde revisie en de huidige revisie van de pagina.
| Beide kanten vorige revisie Vorige revisie Volgende revisie | Vorige revisie | ||
| openwave:1.32:applicatiebeheer:instellen_inrichten:grafieken [2025/07/17 16:25] – Spaces needed Kars Gottschal | openwave:1.32:applicatiebeheer:instellen_inrichten:grafieken [2025/12/18 11:46] (huidige) – Kars Gottschal | ||
|---|---|---|---|
| Regel 5: | Regel 5: | ||
| OpenWave heeft de open source library charts.js geïmporteerd, | OpenWave heeft de open source library charts.js geïmporteerd, | ||
| - | Dit kan vooralsnog alleen op een tegel. | + | Dit kan vooralsnog alleen op een tegel. |
| In plaats van een tegel live te vullen met tekst op basis van een query (zie getTileContent op [[openwave: | In plaats van een tegel live te vullen met tekst op basis van een query (zie getTileContent op [[openwave: | ||
| Regel 15: | Regel 15: | ||
| {{openwave: | {{openwave: | ||
| - | Bovenstaande tegel toont de aantallen zaken van de afgelopen 4 jaar in een staafdiagram.\\ | + | Bovenstaande tegel toont de aantallen zaken van de afgelopen 4 jaar in een staafdiagram. |
| Daartoe moet: | Daartoe moet: | ||
| * de tegelcontent verwijzen naar getflexChart() met een querynaam als parameter | * de tegelcontent verwijzen naar getflexChart() met een querynaam als parameter | ||
| * en moet een passende query gedefinieerd worden onder deze querynaam. | * en moet een passende query gedefinieerd worden onder deze querynaam. | ||
| - | **getFlexChart()**\\ | + | ### getFlexChart() |
| - | Op het detailscherm van de tegeldefinitie (beheerportaal: | + | |
| + | Op het detailscherm van de tegeldefinitie (beheerportaal: | ||
| De functie getFlexChart evalueert de query en geeft het resultaat met het gewenste diagramtype door aan de chart.js, die de informatie rendert naar een diagram.\\ | De functie getFlexChart evalueert de query en geeft het resultaat met het gewenste diagramtype door aan de chart.js, die de informatie rendert naar een diagram.\\ | ||
| - | De diagramsoort kan zijn: pie, bar, of line. In bovenstaand voorbeeld is dat bar.\\ | + | De diagramsoort kan zijn: pie, bar, of line. In bovenstaand voorbeeld is dat bar. |
| Dus de waarde van de kolom dvgettilecontent in de tegeldefinitie van bovenstaand voorbeeld is // | Dus de waarde van de kolom dvgettilecontent in de tegeldefinitie van bovenstaand voorbeeld is // | ||
| - | **query**\\ | + | ### query ### |
| De char.js library verwacht een JSON-string met daarin metadata (zoals labels en kleuren) en data (aantallen). Bij een bar (staafdiagram) ziet zo'n JSON-string er (naar bovenstaand voorbeeld) zo uit: | De char.js library verwacht een JSON-string met daarin metadata (zoals labels en kleuren) en data (aantallen). Bij een bar (staafdiagram) ziet zo'n JSON-string er (naar bovenstaand voorbeeld) zo uit: | ||
| <code sql> | <code sql> | ||
| Regel 70: | Regel 72: | ||
| {{openwave: | {{openwave: | ||
| - | Bovenstaande tegel toont de de verdeling van de openstaande omgevingzaken per soort (dvsoortproc van tbsoortomgzaak).\\ | + | Bovenstaande tegel toont de de verdeling van de openstaande omgevingzaken per soort (dvsoortproc van tbsoortomgzaak). |
| Daartoe moet: | Daartoe moet: | ||
| * de tegelcontent verwijzen naar getflexChart() | * de tegelcontent verwijzen naar getflexChart() | ||
| * en moet een passende query gedefinieerd worden. | * en moet een passende query gedefinieerd worden. | ||
| - | **getFlexChart()**\\ | + | ### getFlexChart() |
| De waarde van de kolom dvgettilecontent in bovenstaand voorbeeld is // | De waarde van de kolom dvgettilecontent in bovenstaand voorbeeld is // | ||
| - | **query**\\ | + | ### query ### |
| - | De char.js library verwacht een JSON-string met daarin metadata (zoals labels en kleuren) en data (aantallen). Bij een pie (taart-diagram) ziet zo'n JSON-string er (naar bovenstaand voorbeeld) zo uit (lijkt eigenlijk erg veel op staafdiagram, | + | |
| + | De char.js library verwacht een JSON-string met daarin metadata (zoals labels en kleuren) en data (aantallen). Bij een pie (taart-diagram) ziet zo'n JSON-string er (naar bovenstaand voorbeeld) zo uit (lijkt eigenlijk erg veel op staafdiagram, | ||
| Vanwege de beperking in de breedte van de tegel zijn in bovenstaand voorbeeld de labelnamen afgekort. \\ | Vanwege de beperking in de breedte van de tegel zijn in bovenstaand voorbeeld de labelnamen afgekort. \\ | ||
| <code sql> | <code sql> | ||
| Regel 126: | Regel 130: | ||
| {{openwave: | {{openwave: | ||
| - | **getFlexChart()**\\ | + | ### getFlexChart() |
| De waarde van de kolom dvgettilecontent is // | De waarde van de kolom dvgettilecontent is // | ||
| - | **query**\\ | + | ### query ### |
| De query levert een JSON-string met de aantallen openstaande adviezen (Ad), Openstaande processtappen (Pr), Openstaande collegiale toetsen (CT) en uitgaande maar nog niet verstuurde brieven (TV). | De query levert een JSON-string met de aantallen openstaande adviezen (Ad), Openstaande processtappen (Pr), Openstaande collegiale toetsen (CT) en uitgaande maar nog niet verstuurde brieven (TV). | ||