It is one of the special kinds of widgets that unlike the others, you won’t find the traditional variable selector. Initially there’s only two fields to fill: the number of rows and columns. After selecting these two values, you’ll have a scheme of how the table is going to look like with all your rows and cells.

To finish, you just need to fill your cells either with text or with the value of a variable. To do that, click on a cell, select the type and fill the value (a text or a variable).

Cells with variables will always display the last value of the variable and it will be updated in real time as soon as a new value arrives.

https://cdn.elev.io/file/uploads/PEfBOej3wR4slKcXFF0VfOndFuEYx_C9vFdA35csXyc/XOjhsa4iTaiWOYtJJ2y-EwgJwxfJeGWYeDILZPPwsso/widget_table--dU.png


Links

If the variable contains a URL, an icon will be shown, and if the user clicks in the icon, or the URL, this link will be opened in a new tab.

https://cdn.elev.io/file/uploads/PEfBOej3wR4slKcXFF0VfOndFuEYx_C9vFdA35csXyc/lr4S372jFE3-bIPqxj3vPh8VOoD2RoPvdKwqMEYjIrw/Screen Shot 2018-04-17 at 17.13.17-vDE.png


Metadata for Color and Link Options

You are able to define colors for the cell where a variable is displayed. By default, the background is transparent (white). If you use metadata when posting a variable, you are able to define the background color of that specific cell. For example, by adding metadata to this POST in JSON below, the cell that shows the variable ‘temperature’ will change its color to ‘green’.

{
    "variable" : "temperature",
    "value": 71,
    "unit"  :"F",
    "metadata": {"color":"yellow"}
}

As the color should be associated with the data of a variable, it is not possible to color cells that are selected as type ‘Text’ (option available in each cell input used during the configuration). Use the metadata color options from your Analysis to help your users to detect issues or alerts on a table more easily.

https://cdn.elev.io/file/uploads/PEfBOej3wR4slKcXFF0VfOndFuEYx_C9vFdA35csXyc/FPM2Nu-fV9IFg2mW_JBRvWJz2fscb8aBLX8BAR3gDNo/widget_table_color-VTs.png

You can also use the metadata parameter to create a link to another dashboard or external Url. Let's take a look in another example:

{
    "variable" : "address",
    "value": "Raleigh, N.C",
    "serie"  :"12444",
    "metadata": {"url":"https://admin.tago.io/dashboards/info/5b16b4c86ba351000105badc"}
}

If the user click in the text Raleigh, N.C, he will be redirected to another dashboard. You can use that to improve the user navigation or redirect them to more informations in another application/site.

This is the final result:

https://cdn.elev.io/file/uploads/PEfBOej3wR4slKcXFF0VfOndFuEYx_C9vFdA35csXyc/UIwGODh75C00-U43LucSt8tZjNxzurjhN8ypDCWOI7A/Screen Shot 2018-07-24 at 16.00.02--IE.png