Set Custom Icon based on Telemetry Key on Thingsboard

I have send the proper telemetry to my devices, that represents animals, as follows:

enter image description here

When it comes to represent each animal in a Route Map, my goal is to set a specific image based on the value of 'color' key on the telemetry. This way, if color value is 'green', it will select one icon. If the value is 'orange', a second one.

Beacuse I'm new with Thingsboard, I'm not really sure how to achieve this. This is the example that Thingsboard gives:

var type = data['Type'];
if (type == 'thermometer') {
  var res = {
    url: images[0],
    size: 40
  }
  var temperature = data['temperature'];
  if (typeof temperature !== undefined) {
    var percent = (temperature + 60)/120;
    var index = Math.min(3, Math.floor(4 * percent));
    res.url = images[index];
  }
  return res;
}

This example calculates the image url depending on temperature telemetry value for thermometer device type, having 4 different images.

My current approach is the following:

var entityType = dsData[dsIndex]['entityType'];
var entityName = dsData[dsIndex]['name'] || dsData[dsIndex][
    'entityName'
] || "Desconocido"; 

var res = {
    url: images[9], // Imagen predeterminada
    size: 55
};

if (entityType === 'DEVICE') {
    if (entityName.startsWith("Elefant")){
        res.url = images[7];
    }
    else if (entityName.startsWith("Lion")){
        res.url = images[5];
    }
        else if (entityName.startsWith("Rino")){
        res.url = images[2];
    }
}
return res;

In this case, it will set an icon based on the name, which works. However, when I try to do this:

var color = dsData[dsIndex]['color'];

if (color === 'green'){

}

The variable is initialized, but the 'if' condition is not met. I have try with 'green', "green" and even just green, but nothing works.

Updated:

As it can be seen, the log for the first animal is the following:

[Log] dsData[dsIndex]:
"{
  \"entityName\": \"Lion\",
  \"deviceName\": \"Lion\",
  \"entityId\": \"f734bf80-cda2-11ef-8e00-e370a74757c3\",
  \"entityType\": \"DEVICE\",
  \"entityLabel\": \"Lion\",
  \"entityDescription\": \"\",
  \"aliasName\": \"animals\",
  \"$datasource\": {
    \"type\": \"entity\",
    \"name\": \"Lion\",
    \"entityAliasId\": \"6bd3c7e3-660b-090f-14e5-ad1b275d4d70\",
    \"dataKeys\": [
      {
        \"name\": \"latitude\",
        \"type\": \"timeseries\",
        \"label\": \"latitude\",
        \"color\": \"#2196f3\",
        \"settings\": {},
        \"_hash\": 0.781950330011425,
        \"hidden\": false,
        \"inLegend\": true,
        \"pattern\": \"latitude\"
      },
      {
        \"name\": \"longitude\",
        \"type\": \"timeseries\",
        \"label\": \"longitude\",
        \"color\": \"#4caf50\",
        \"settings\": {},
        \"_hash\": 0.6366948870050573,
        \"hidden\": false,
        \"inLegend\": true,
        \"pattern\": \"longitude\"
      }
    ],
    \"alarmFilterConfig\": {
      \"statusList\": [
        \"ACTIVE\"
      ]
    },
    \"aliasName\": \"animals\",
    \"entityFilter\": {
      \"type\": \"deviceType\",
      \"resolveMultiple\": true,
      \"deviceTypes\": [
        \"Animal\"
      ],
      \"deviceNameFilter\": \"\"
    },
    \"pageLink\": {
      \"pageSize\": 1024,
      \"page\": 0,
      \"sortOrder\": {
        \"key\": {
          \"type\": \"ENTITY_FIELD\",
          \"key\": \"createdTime\"
        },
        \"direction\": \"DESC\"
      }
    },
    \"dataReceived\": true,
    \"entity\": {
      \"id\": {
        \"entityType\": \"DEVICE\",
        \"id\": \"f734bf80-cda2-11ef-8e00-e370a74757c3\"
      },
      \"label\": \"\",
      \"name\": \"Lion\"
    },
    \"entityId\": \"f734bf80-cda2-11ef-8e00-e370a74757c3\",
    \"entityType\": \"DEVICE\",
    \"entityName\": \"Lion\",
    \"entityLabel\": \"\",
    \"entityDescription\": \"\",
    \"generated\": false
  },
  \"dsIndex\": 0,
  \"dsName\": \"Lion\",
  \"deviceType\": null,
  \"latitude\": 41.66652,
  \"latitude|ts\": 1737980346364,
  \"longitude\": -0.87504,
  \"longitude|ts\": 1737980346364
}"

I don´t know why except from latitude and longitude, the rest of the keys are not shown. Any ideas?

Upvotes: 0

Views: 40

Answers (0)

Related Questions