Dataformat

Diagram-widgets

Alle diagrammer deler de samme felter; hvilke af x, y, d og r der bruges, og hvilken kolonnetype hver accepterer, afhænger af diagramtypen - hver af de understøttede diagramtyper gennemgås i sit eget underafsnit nedenfor, med et levende eksempel gengivet fra ét lille, fælles eksempeldatasæt.

• datasetId - det datasæt, diagrammet læser fra - skal matche navnet på et datasæt.
• chartType - area, bar, cell, dot, hexbin or line.
• title - en valgfri diagramtitel.
• dataFunction - den aggregering, der anvendes på d: count (default), sum, average, min, max, median or stddev. Undlad at angive d, når count anvendes.
• x - kolonnen for X-dimensionen (påkrævet for alle diagramtyper).
• y - kolonnen for Y-dimensionen (kun cell, dot og hexbin - og påkrævet for alle tre).
• d - kolonnen, der aggregeres til diagrammets værdi-/farvedimension.
• r - kolonnen for radiusdimensionen (kun dot, og påkrævet).
• seasonX / seasonY - grupperer en tidskolonne i en tilbagevendende periode: year, quarter, month, week, dayofyear, day, dayofweek, hour, minute or second.

Dimensionskolonner klassificeres som kategoriske, tidsmæssige eller kontinuerlige baseret på deres angivne type - se afsnittet om datasæt-JSON nedenfor. Når dataFunction er count, er d-dimensionen ikke angivet - en optælling har ikke brug for en værdikolonne. Enhver anden aggregering (sum, average, min, max, median or stddev) kræver den.

De dimensioner, en diagramtype kræver, skal udfyldes: cell, dot og hexbin kan ikke tegnes uden y, og dot kan ikke tegnes uden r. En forespørgsel, der udelader en af dem, bliver afvist, så hvis datasættet ikke har en egnet kolonne, skal du vælge en diagramtype, der ikke kræver den - area, bar og line har kun brug for x, og hexbin viser to dimensioner uden en radiuskolonne.

Søjle

Linje

Areal

Celle

Punkt

Hexbin

Andre widgets

Tabel (dash_table)

Tekst (dash_text)

Billede (dash_image)

Mellemrum (dash_spacer)

Stakke (dash_stacker_hor, dash_stacker_ver)

Datasæt-JSON

Et datasæt er ét samlet JSON-objekt med et navn, typede kolonner og rækker:

{
  "name": "Orders",
  "headers": ["region", "category", "amount", "quantity"],
  "types": ["VARCHAR", "VARCHAR", "FLOAT", "INTEGER"],
  "entries": [
    ["North", "Electronics", 120.50, 2],
    ["South", "Clothing",     89.95, 1],
    ["North", "Furniture",   432.00, 5],
    ["South", "Electronics",  74.50, 1]
  ]
}

• name - datasættets navn; diagrammer og tabeller refererer til det via deres datasetId-felt.
• headers - kolonnenavnene, i samme rækkefølge som hver række i entries.
• types - én kolonnetype pr. header - se kategorierne nedenfor.
• entries - rækkerne, hver et array af værdier i header-rækkefølge.

Valgfrit kan row_start, row_end, col_start og col_end vælge et nul-indekseret, inklusivt underinterval af entries, der skal importeres - nyttigt når kun nye rækker fra en større tabel skal tilføjes. Alle fire har som standard hele intervallet:

{
  "name": "Orders",
  "headers": ["region", "amount"],
  "types": ["VARCHAR", "FLOAT"],
  "entries": [ ["North", 120.50], ["South", 89.95], ["North", 432.00], ["South", 74.50] ],
  "row_start": 0,
  "row_end": 1,
  "col_start": 0,
  "col_end": 1
}

Hver kolonnetype klassificeres som kategorisk, tidsmæssig eller kontinuerlig, hvilket afgør, hvilke diagramdimensioner den kan bruges til - se afsnittene om diagram-widgets ovenfor:

• Kategorisk - BIT, BITSTRING, BOOLEAN, BOOL, LOGICAL, BLOB, BYTEA, BINARY, VARBINARY, UUID, VARCHAR, CHAR, BPCHAR, TEXT, STRING
• Tid - DATE, TIME, TIMESTAMP, DATETIME, TIMESTAMP WITH TIME ZONE, TIMESTAMPTZ
• Kontinuerlig - alle andre typer, for eksempel INTEGER, FLOAT, DOUBLE, BIGINT, DECIMAL

Kolonnereferencer i et diagram (x, y, d, r) skal matche et header-navn præcist, med forskel på store og små bogstaver.

Styling og temaoverstyringer

Farver på dashboard-niveau angives ét sted i config.style.widget og gælder for alle widgets, der ikke tilsidesætter dem:

• color - standardtekstfarven.
• backgroundColor - standardbaggrunden for dashboardet.
• primaryColor - forgrunds-/aktiv-seriefarven, der bruges til overskrifter og den krydsfiltrerede serie.
• primaryColorSubtle - den lave ende af den farvegradient, der bruges af cell-, dot- og hexbin-diagrammer.
• secondaryColor - baggrunds-/ufiltreret-seriefarven.

Enhver widget kan tilsidesætte sin egen præsentation direkte på sin JSON-node - backgroundColor, color, padding, borderRadius, borderWidth, borderColor og shadow. Eksemplet nedenfor tilsidesætter ét diagrams egne farver og hjørner, mens resten af dashboardet beholder det fælles tema:

{
  "type": "dash_chart",
  "datasetId": "Orders",
  "chartType": "hexbin",
  "x": "amount",
  "y": "quantity",
  "backgroundColor": "#F5F0FF",
  "borderRadius": "12px",
  "borderWidth": "1px",
  "borderColor": "#6E2BDC",
  "shadow": true
}

Komplet eksempel

Et lille dashboard, der kombinerer en overskrift, to diagrammer side om side og en tabel, alle med data fra ét datasæt:

{
  "config": {
    "type": "dashboard",
    "style": {
      "widget": {
        "color": "#000000",
        "backgroundColor": "#FFFFFF",
        "primaryColor": "#6E2BDC",
        "primaryColorSubtle": "#E2D5F8",
        "secondaryColor": "#CCCCCC"
      }
    }
  },
  "data": {
    "type": "dash",
    "children": [
      { "type": "dash_text", "text": "Orders Overview", "fontSize": "2vw", "justifyContent": "0" },
      {
        "type": "dash_stacker_hor",
        "children": [
          { "type": "dash_chart", "datasetId": "Orders", "chartType": "bar",  "x": "region", "dataFunction": "count" },
          { "type": "dash_chart", "datasetId": "Orders", "chartType": "cell", "x": "region", "y": "category", "dataFunction": "count" }
        ]
      },
      { "type": "dash_table", "datasetId": "Orders" }
    ]
  }
}