Change Color Card-Header on Map

How to change the card-header color on the map page?

Dear,

Change this as per requirement and save it “docker\openremote\deployment\manager\app\manager_config.json”

{
“realms”: {
“default”: {
“appTitle”: “Conscient Initiatives”,
“headers”: [
“map”,
“attributeName”,
“assets”,
“rules”,
“insights”,
“language”,
“users”,
“roles”,
“account”,
“logs”,
“logout”,
“export”,
“appearance”,
“realms”,
“gateway”
],
“styles”: “:host > * {–or-app-color1:#FFFFFF;–or-app-color2:#F9F9F9;–or-app-color3:#1a2456;–or-app-color4:#138caa;–or-app-color5:#CCCCCC;–or-app-color6:#be0000;–or-app-color8:#FFFFFF;”,
“logo”: “/images/logo.png”,
“logoMobile”: “/images/logo-mobile.png”,
“favicon”: “/images/default/favicon.png”,
“language”: “en”
}
},
“pages”: {
“map”: {
“markers”: {
“ThingAsset”: {
“attributeName”: “03_TEMPERATURE”,
“showLabel”: true,
“showUnits”: true,
“colours”: {
“type”: “range”,
“ranges”: [
{
“min”: 20,
“colour”: “C1272D”
},
{
“min”: 30,
“colour”: “F7931E”
},
{
“min”: 40,
“colour”: “39B54A”
}
]
}
}
}
}
}
}

Hi!

I’d like to add some context to this. :wink:

You can customize the look of the Manager UI using the Appearance page.
By clicking the JSON button on the top right, you can edit the manager_config.json file.

.
From there, edit the asset types and what color they display.
More context on the JSON specification can be found on the documentation site;

1 Like

Hi all,

The card header is based on the colour set for the clicked asset type.
It does not change based on the colour set when using the map marker colour ranges in the manager config json directly or using the appearance page.
It would be nice to have the header respond to the colour ranges set, so that the header would be the same colour as the marker that you clicked.

So @Delfin24 I see two options:

  1. Change the colour set in the asset type in your instance.
  2. Adjust the code so that the header responds to the set manager config and open a PR :slight_smile:

Kind regards,

Don

1 Like

Hello @Don thank you for commenting, I have changed and set the color of the header card but it still has no effect and changes the color of the header card on the map page. Can you provide a code example to change the color of the card header on the map page correctly?



As @Don described, it will not work like that.

The color the card header behaves differently, so editing the JSON file will not solve this.
You’ll need to create a custom asset type (with a custom color),
or fork the repository and purpose a fix for this issue.

See his comment.

hi,
try
login with another user and set value greater than 30 or equal 30
Check the colour of asset change or not in map.

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.