Table tile

Columns and rows of values and texts.

In a dashboard file: "type": "table", with the options below. Every tile also has the fields under Every tile.

Example

A tile, as it goes in a screen’s tiles:

{
    "type": "table",
    "label": "Outside today",
    "layout": { "x": 1, "y": 1, "width": 2, "height": 1 },
    "dataSources": {
        "low": {
            "connection": "demo",
            "params": { "device": "weather-station", "value": "lowestToday" }
        },
        "high": {
            "connection": "demo",
            "params": { "device": "weather-station", "value": "highestToday" }
        }
    },
    "options": {
        "columns": [{ "label": "", "width": 2 }, { "label": "°C" }],
        "rows": [
            [
                "Lowest",
                { "source": "low", "numberFormat": "0.0", "color": "#4fb3ff" }
            ],
            [
                "Highest",
                { "source": "high", "numberFormat": "0.0", "color": "#ff8c00" }
            ]
        ]
    }
}

It reads the demo home: in a dashboard with the connection "demo": { "driver": "demo", "config": {} }, it works as it is. To read a device of your own, its data source names one of your connections, with the params of that connection’s driver (Connections and data sources).

Options

Field	Type	Default	What
columns	list	required	Columns.
columns[].label	text	required	Label. At the top of the column.
columns[].width	number, above 0	1	Width. Relative to the other columns.
rows	list of lists	required	Rows. A cell for each column.
rows[]	list		Row. A cell for each column.
rows[][]	text or object		Cell. A text of its own, or a reading.
rows[][].source	data source name	required	Reading: Reading. One of the tile’s data sources, by name, that gives a number.
rows[][].numberFormat	number format	0	Reading: Number format. 0, 0.0, 0.## or #,##0.
rows[][].transform	expression		Reading: Transform. Arithmetic on the value, such as value/1000 or ftoc(value).
rows[][].color	colour		Reading: Colour.
boldFirstRow	true or false	false	Bold first row. The column labels in bold. A look option: a tile style can set it.
rowLines	one of none, first (Below the first row), all (Between all rows)	none	Row lines. Lines between the rows. A look option: a tile style can set it.
columnLines	one of none, first (After the first column), all (Between all columns)	none	Column lines. Lines between the columns. A look option: a tile style can set it.

Built-in styles

The styles the app offers for it, after “The dashboard’s style”. Style files says what they set.

• Centred
• Left aligned
• Compact
• Icon at the left