Dashboard builder

Page Settings & Layout: volledige reference

Alle instellingen uit Edit Settings: page identity, grid layout, menu settings, page color rules, page value rules en default chart colors.

1. Basisinstellingen

Dashboard JSON: bekijk of bewerk de volledige configuratie van deze pagina, inclusief widgets, filters, datasources en views. De code-editor volgt het formulier totdat je de JSON bewerkt; daarna heeft de JSON voorrang bij Toepassen. Kies JSON-wijzigingen verwerpen om terug te gaan naar de formulierwaarden. Ongeldige JSON en wijzigingen aan de dashboard-ID worden geblokkeerd. Toepassen wijzigt het concept; sla het dashboard op om te bewaren.

Het leegmaken van de beschrijving onder de filters verwijdert de kaart. Lege rich-textalinea’s en spaties laten geen leeg vak achter; beschrijvingen met afbeeldingen blijven zichtbaar.

Page settings paneel
Gebruik dit paneel voor structuur en paginagedrag; widgetafwijkingen stel je elders in.

Opslaggedrag

  • Dashboard builder-acties staan niet meer in een zwevende editbalk op de pagina. Op desktop verschijnen ze in de topbar links van Dashbot in een inklapbare capsule; op mobiel openen ze vanuit een topbar-popover.
  • layout.columns wordt begrensd op 1 t/m 24.
  • Lege velden (htmlTitle, menuIcon, layout.gap) worden als null/weg gelaten.
  • order wordt als integer opgeslagen.
  • De rechter editorbalk voor page settings, filters, views en widgets is op desktop sleepbaar in breedte; Dashview onthoudt je laatste breedte per gebruiker.
  • hideFilterBar verbergt de zichtbare filterbar/drawer voor deze pagina, maar houdt intern wel een verborgen filterbar-component actief zodat filter-runtime en afhankelijkheden intact blijven.
Instelling Type Default Beschrijving
titlestringleegPaginatitel in menu en header.
htmlTitlestring/nullnullRich title voor page header (menu blijft plain text).
showTitlebooleantrueToon titel boven widgets.
hideFilterBarbooleanfalseVerberg de zichtbare filterbar en mobiele filter-drawer op deze pagina, maar houd de runtime filterbar intern gemount voor compatibiliteit.
hideInMenubooleanfalseVerberg pagina in menu.
menuIconstring/nullnullPrimeIcon class op menu-item.
layout.kindgridgridMomenteel alleen grid-layout.
layout.columnsnumber12Aantal gridkolommen.
layout.gapstringemptyCSS gap, bv 1rem.
ordernumber/nullnullMenuvolgorde (lager = eerder).

2. Page color rules

Page color rules worden door widgets gebruikt zodra ze usePageColorRules ondersteunen.

Rule type Keys Beschrijving
valuevalue, color, caseSensitiveExact value match.
rangemin, max, minInclusive, maxInclusive, scale, colorNumerieke range met absolute of percent schaal.
index-rangeminPercent, maxPercent, minInclusive, maxInclusive, colorIndex/positie-percentielrange voor widgets die op volgorde kleuren.
datemode, anchor, colorDatumvergelijking. mode kan before, beforeOrOn, after of afterOrOn zijn; anchor ondersteunt nu today.
{
  "colorRules": [
    { "kind": "value", "value": "critical", "color": "#dc2626", "caseSensitive": false },
    { "kind": "range", "min": 80, "max": 100, "minInclusive": true, "maxInclusive": true, "scale": "absolute", "color": "#f59e0b" },
    { "kind": "date", "mode": "before", "anchor": "today", "color": "#ef4444" }
  ]
}

Page color rules worden alleen toegepast door widgets of kolommen die dit aanzetten, bijvoorbeeld met usePageColorRules: true. Toegestane waarden voor pageColorSource: label, group, value, y. y is bedoeld voor 3D charts.

3. Page value rules

Key Waarden Beschrijving
valuestringMatch inputwaarde.
replacementstringVervangwaarde.
replacementTypestringToegestane waarden: text, html, svg, icon, png. Rendermodus.
matchModestringToegestane waarden: exact, regex. Exacte match of regex.
caseSensitivebooleanCase-sensitive matching.
maxHeightEmnumberMax hoogte van visuele replacements.
{
  "valueRules": [
    { "value": "critical", "replacement": "Critical", "replacementType": "text", "matchMode": "exact" },
    { "value": "^warn", "replacement": "pi pi-exclamation-triangle", "replacementType": "icon", "matchMode": "regex", "caseSensitive": false }
  ]
}

Page value rules worden hergebruikt door widgets of tabelkolommen met usePageValueRules: true. Widget-level regels blijven nuttig voor lokale overrides.

4. Default chart colors

Array van kleurwaarden die als fallback palette gebruikt wordt wanneer widgets geen value-based kleurregels toepassen.