Dataformat

Diagramwidgetar

Alla diagram delar samma fält; vilka av x, y, d och r som används, och vilken typ av kolumn respektive fält accepterar, beror på diagramtypen - varje diagramtyp som stöds beskrivs i ett eget underavsnitt nedan, med ett levande exempel som renderas från ett litet delat exempeldataset.

• datasetId - det dataset diagrammet läser från - måste matcha ett datasets namn.
• chartType - area, bar, cell, dot, hexbin or line.
• title - en valfri diagramtitel.
• dataFunction - aggregatet som tillämpas på d: count (default), sum, average, min, max, median or stddev. Lämna d ospecificerad vid användning av count.
• x - kolumnen för X-dimensionen (obligatorisk för alla diagramtyper).
• y - kolumnen för Y-dimensionen (endast cell, dot och hexbin - och obligatorisk för dessa tre).
• d - kolumnen som aggregeras till diagrammets värde-/färgdimension.
• r - kolumnen för radiedimensionen (endast dot, och obligatorisk).
• seasonX / seasonY - grupperar en tidskolumn i en återkommande period: year, quarter, month, week, dayofyear, day, dayofweek, hour, minute or second.

Dimensionskolumner klassificeras som kategoriska, tids- eller kontinuerliga baserat på sin deklarerade typ - se avsnittet om Dataset-JSON nedan. När dataFunction är count lämnas d-dimensionen ospecificerad - en count behöver ingen värdekolumn. Alla andra aggregat (sum, average, min, max, median or stddev) kräver den.

De dimensioner som en diagramtyp kräver måste fyllas i: cell, dot och hexbin kan inte ritas utan y, och dot kan inte ritas utan r. En begäran som utelämnar någon av dem avvisas, så om datasetet saknar en lämplig kolumn väljer du en diagramtyp som inte behöver den - area, bar och line klarar sig med enbart x, och hexbin visar två dimensioner utan radiekolumn.

Stapel

Linje

Yta

Cell

Punkt

Hexbin

Övriga widgetar

Tabell (dash_table)

Text (dash_text)

Bild (dash_image)

Mellanrum (dash_spacer)

Staplare (dash_stacker_hor, dash_stacker_ver)

Dataset-JSON

Ett dataset är ett enda JSON-objekt med ett namn, typade kolumner och rader:

{
  "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 - datasetets namn; diagram och tabeller refererar till det via sitt datasetId-fält.
• headers - kolumnnamnen, i samma ordning som varje rad i entries.
• types - en kolumntyp per header - se kategorierna nedan.
• entries - raderna, där varje rad är en array av värden i header-ordning.

Valfritt låter row_start, row_end, col_start och col_end dig välja ett noll-indexerat, inkluderande delintervall av entries att importera - användbart när endast nya rader från en större tabell ska läggas till. Alla fyra har hela intervallet som standardvärde:

{
  "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
}

Varje kolumntyp klassificeras som kategorisk, tid eller kontinuerlig, vilket avgör vilka diagramdimensioner den kan användas för - se avsnitten om diagramwidgetar ovan:

• 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 - alla andra typer, till exempel INTEGER, FLOAT, DOUBLE, BIGINT, DECIMAL

Kolumnreferenser i ett diagram (x, y, d, r) måste matcha ett header-namn exakt, skiftlägeskänsligt.

Styling och temaöverstyrningar

Färger på dashboardnivå ställs in en gång i config.style.widget och gäller för varje widget som inte skriver över dem:

• color - standardfärgen för text.
• backgroundColor - dashboardens standardbakgrund.
• primaryColor - förgrunds-/aktiv seriefärg, används för rubriker och det korsfiltrerade spåret.
• primaryColorSubtle - den ljusa änden av den färggradient som används av cell-, dot- och hexbin-diagram.
• secondaryColor - bakgrunds-/ofiltrerad seriefärg.

Vilken widget som helst kan skriva över sin egen presentation direkt på sin JSON-nod - backgroundColor, color, padding, borderRadius, borderWidth, borderColor och shadow. Exemplet nedan skriver över ett diagrams egna färger och hörn, medan resten av dashboarden behåller det delade temat:

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

Komplett exempel

En liten dashboard som kombinerar en rubrik, två diagram sida vid sida och en tabell, som alla läser från ett dataset:

{
  "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" }
    ]
  }
}