4

I have a ThingsBoard table widget displaying Node Status as 0 or 1. Where 0 = OK, 1 = ALARM.

I have already created nodeStatus to return strings of 0 = OK, 1 = ALARM.


Sensor A Status


The following is my current code in the 'Advanced Data Key Tab - Use cell content function':

var nodeStatus = entity['sensor.a'];

if (nodeStatus == '0')
{
    return "OK";
} else {
    return "ALARM";
}

I want to change the Returned String colour to the following:

OK = Green font

ALARM = Red font

How do I do this?



UPDATE: I have added extra code to the Cell Style function: f(value) as suggested by @lupz below.

Data key configuration



This is now making the entire column change to Red:

Sensor A Status



I have also tried enabling "Use data post-processing function" in the "Settings" Tab, with no change:

enter image description here

UPDATE:

I have removed the nodeStatus function from the "Cell Content Function" as per below comments:

enter image description here

After removal of the single quotes around the '0' next to if(value === 0), I have the same issue as above (the whole column is red).

enter image description here

lupz
  • 3,620
  • 2
  • 27
  • 43
Dennis Murphy
  • 43
  • 1
  • 7
  • Any news on this one? Please add the console output of this cell style function: `console.log(value, typeof (value)); return {};` Please add the console output of this cell content function: `console.log(value, typeof (value)); console.log(entity['sensor.a'], typeof (entity['sensor.a'])); return entity['sensor.a'];` – lupz Apr 02 '19 at 08:26
  • I am guessing you want me to do something with the Chrome Inspect tool (while selecting the Table)? I have tried adding both the above statements but get errors in the syntax of those statements: "Uncaught SyntaxError: Illegal return statement" on both. – Dennis Murphy Apr 04 '19 at 05:01
  • I'd like to get insights on the sensor data. The scripts will generate output that you can see in the log-console of your browsers development tools. Please paste "console.log('style value', value, typeof (value)); return {};" (without the double quotes) into the cell style function field. Please paste "console.log('content value', value, typeof (value)); console.log('content entity', entity['sensor.a'], typeof (entity['sensor.a'])); return entity['sensor.a'];" (without the double quotes) into the cell content function field. Please add the console output to you question. – lupz Apr 05 '19 at 11:35
  • Hi @lupz, i'd really like to answer you however I have been trying to get the Console output to work but I keep getting "Uncaught SyntaxError: Illegal return statement" I am using the latest Chrome, right clicking the Sensor.A "ALARM" element in the Widget, and pasting the above into the Console area and hitting Enter. I am unsure where the Console area is in Chrome that will allow me to specifically select the "Cell Style Function" or the "Cell Content Function" Fields. – Dennis Murphy May 13 '19 at 12:50
  • I guess we are not talking about the same things here. _In Thingsboard_ you can create dashboards with widgets. You can setup datasources for each widget by configuring data keys. In the advanced settings of each data key you can define a `cell style` and a `cell content` function. You can even see the textareas for those functions in your screenshots :) Please copy and paste the code from my previous comment into those textareas. The [console of your browser](https://developers.google.com/web/tools/chrome-devtools/console) will show the output of the scripts when you access the dashboard. – lupz May 14 '19 at 07:03

2 Answers2

1

There should be another script-input called Cell style function: f(value) right there in the advanced data key settings of the table widget. It can be used to set the CSS-styles for a cell based on its value:

/* Assuming value is your nodeStatus */

if (value === '0') {
    return {
        color: 'green'
    };
} else {
    return {
        color: 'red'
    };
}
lupz
  • 3,620
  • 2
  • 27
  • 43
  • Thanks for the feedback. I have added this code to the Advanced tab in the "Cell style function: f(value)" section, however now I see all items in the column turn red. I am now able to add screenshots, so see my edited post above for extra clarification. – Dennis Murphy Mar 26 '19 at 07:01
  • It is beacause the value is never `=== '0'`. hm... you use the `entity['sensor.a']` to get the nodeStatus and ignore the datakey value. What is the datakey? Can you add a datakey to access the `sensor.a` values directly? – lupz Mar 26 '19 at 10:38
  • In your screens I saw that it already is `sensor.a` datakey. You should be able to use the `value`-parameter of the cell content function directly (no need for `entity['sensor.a']`). The reason for this not working in the cell style function seems to be that your value is not a string but a number. You compare the sensor value to the string `'0'` and in Javascript `0 == '0'` is true due to automatic type conversions, whereas `0 === '0'` is false. You should be able to get it working by removing the single quotes `if (value === 0) { ... }`. Let me know if its working and I'll update the answer. – lupz Mar 26 '19 at 12:20
  • I have used entity['sensor.a'] instead of sensor.a directly as the datakey as it does not work properly with decimal places in the string name for a datakey. I have removed the nodeStatus function to avoid confusion and added a screenshot above. I have also tried removing the commas around the 0 next to value in the "Cell Style Function" and this did not work. – Dennis Murphy Mar 27 '19 at 05:46
  • The problems seem to be that "sensor.a" is not properly recognized. By doing "Console.log(value)" I can see "undefined", whereby doing "Console.log(entity['sensor.a'])" I see the value... this seems to be a Bug on the Entities Table visualisation. Map works fine. To make things worst, the "entity" object is only available at "cell content function" but not at "cell style function". – Talk2 Jul 07 '19 at 07:55
0
if (value == 'false') {
    return{background:'#0394fc'};
}
Dharman
  • 30,962
  • 25
  • 85
  • 135
Lucas Matias Etchezuri
  • 1