ThingsBoard vidoe tutorials: Examples of configuration of Hierarchy widget

Hierarchy_widget_configuration

//Configuration code for HTML widget//

<div class='card'>
    <div class='content'>
        <div class='column'>
            <h1>Current entity</h1>
            <div class='value'>
                ${entityName}
            </div>    
        </div>
    </div>
</div>

//To make your nodes in hierarchy coloured (red)// 

var entity = nodeCtx.entity;
var text = entity.name;
var data = nodeCtx.data;
if (data.hasOwnProperty('hasAlarm') && data['hasAlarm'] !== null && data['hasAlarm'] === 'true') {
    text =  "<font color=\"red\">" + text + "</font>";
} 

//To add some text (exclamations for example) to nodes appearance// 

var entity = nodeCtx.entity;
var text = entity.name;
var data = nodeCtx.data;
if (data.hasOwnProperty('hasAlarm') && data['hasAlarm'] !== null && data['hasAlarm'] === 'true') {
    text =  "<b> !!!</b>";
} 

//To change icon of particular node. You may choose any pic from MaterialIcons set or input URL to image file//

var data = nodeCtx.data;
if (data.hasOwnProperty('hasAlarm') && data['hasAlarm'] !== null && data['hasAlarm'] === 'true  ') {
    return {materialIcon: 'settings_remote'};
} else {
    return 'default';
}

//Disabling makes your node inactive in hierarchy//

var data = nodeCtx.data;
if (data.hasOwnProperty('nodeDisabled') && data['nodeDisabled'] !== null) {
    return data['nodeDisabled'] === 'true';
} else {
    return false;
}