Trying to understand ui-gauge-classic with jason array but unable to show any output at all. Debug node show the correct json array but no display.
[
{
"id": "228643314eac7447",
"type": "ui-gauge-classic",
"z": "8f66b7d5ab320467",
"name": "Guage Classic 1",
"group": "203375226bde3b7b",
"order": 2,
"width": 0,
"height": 0,
"min": 0,
"max": "100",
"sectors": [],
"major_division": 1,
"minor_division": 0.2,
"value_decimal_places": 1,
"scale_decimal_places": 0,
"label": "temp-test",
"measurement": "temperature",
"units": "°F",
"needles": [
{
"topic": "green",
"color": "green",
"lengthPercent": "100"
}
],
"sweep_angle": 250,
"myclass": "",
"x": 800,
"y": 160,
"wires": []
},
{
"id": "bd3e8463d7be4887",
"type": "debug",
"z": "8f66b7d5ab320467",
"name": "ramdom1-100",
"active": true,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 820,
"y": 200,
"wires": []
},
{
"id": "b70fad5570f26b1a",
"type": "function",
"z": "8f66b7d5ab320467",
"name": "Random1-100-green",
"func": "//msg.payload=Math.random()*100;\n//msg.payload=msg.payload.toFixed(2);\n//return msg;\n\nmsg.payload=Math.random()*100;\nmsg.payload=msg.payload.toFixed(2);\n\nmsg.topic=\"green\";\n\nreturn msg;\n",
"outputs": 1,
"timeout": 0,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 300,
"y": 140,
"wires": [
[
"4038e4a8b4734c8f",
"62a39808d2ed9912",
"228643314eac7447"
]
]
},
{
"id": "6f31585fc2853676",
"type": "ui-gauge",
"z": "8f66b7d5ab320467",
"name": "",
"group": "c4074b104a5595b8",
"order": 3,
"width": 3,
"height": 3,
"gtype": "gauge-half",
"gstyle": "needle",
"title": "old gauge",
"units": "units",
"icon": "",
"prefix": "",
"suffix": "",
"segments": [
{
"from": "0",
"color": "#5cd65c"
},
{
"from": "40",
"color": "#ffc800"
},
{
"from": "80",
"color": "#ea5353"
}
],
"min": 0,
"max": "100",
"sizeThickness": 16,
"sizeGap": 4,
"sizeKeyThickness": 8,
"styleRounded": true,
"styleGlow": false,
"className": "",
"x": 800,
"y": 120,
"wires": []
},
{
"id": "e836ff97aeec35f2",
"type": "function",
"z": "8f66b7d5ab320467",
"name": "Random1-100-red",
"func": "//msg.payload=Math.random()*100;\n//msg.payload=msg.payload.toFixed(2);\n//return msg;\n\nmsg.payload=Math.random()*100;\nmsg.payload=msg.payload.toFixed(2);\n\nmsg.topic=\"red\";\n\nreturn msg;\n",
"outputs": 1,
"timeout": 0,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 290,
"y": 180,
"wires": [
[
"4038e4a8b4734c8f",
"6f31585fc2853676",
"228643314eac7447"
]
]
},
{
"id": "4038e4a8b4734c8f",
"type": "join",
"z": "8f66b7d5ab320467",
"name": "",
"mode": "custom",
"build": "object",
"property": "payload",
"propertyType": "msg",
"key": "topic",
"joiner": "\\n",
"joinerType": "str",
"useparts": false,
"accumulate": true,
"timeout": "",
"count": "2",
"reduceRight": false,
"reduceExp": "",
"reduceInit": "",
"reduceInitType": "",
"reduceFixup": "",
"x": 570,
"y": 200,
"wires": [
[
"bd3e8463d7be4887"
]
]
},
{
"id": "62a39808d2ed9912",
"type": "ui-gauge",
"z": "8f66b7d5ab320467",
"name": "",
"group": "c4074b104a5595b8",
"order": 2,
"width": 3,
"height": 3,
"gtype": "gauge-half",
"gstyle": "needle",
"title": "old gauge",
"units": "units",
"icon": "",
"prefix": "",
"suffix": "",
"segments": [
{
"from": "0",
"color": "#5cd65c"
},
{
"from": "40",
"color": "#ffc800"
},
{
"from": "80",
"color": "#ea5353"
}
],
"min": 0,
"max": "100",
"sizeThickness": 16,
"sizeGap": 4,
"sizeKeyThickness": 8,
"styleRounded": true,
"styleGlow": false,
"className": "",
"x": 800,
"y": 80,
"wires": []
},
{
"id": "203375226bde3b7b",
"type": "ui-group",
"name": "ui-guage classic",
"page": "a56426f48846598a",
"width": "6",
"height": "1",
"order": 1,
"showTitle": true,
"className": "",
"visible": "true",
"disabled": "false"
},
{
"id": "c4074b104a5595b8",
"type": "ui-group",
"name": "Gauges",
"page": "a56426f48846598a",
"width": "6",
"height": "1",
"order": 2,
"showTitle": true,
"className": "",
"visible": "true",
"disabled": "false"
},
{
"id": "a56426f48846598a",
"type": "ui-page",
"name": "Gauge Examples",
"ui": "d65ae8163ef966dd",
"path": "/examples",
"icon": "home",
"layout": "grid",
"theme": "b6221fc08b602ea9",
"order": 5,
"className": "",
"visible": "true",
"disabled": "false"
},
{
"id": "d65ae8163ef966dd",
"type": "ui-base",
"name": "Node-red-2",
"path": "/dashboard",
"includeClientData": true,
"acceptsClientConfig": [
"ui-notification",
"ui-control"
],
"showPathInSidebar": true,
"showPageTitle": true,
"navigationStyle": "default",
"titleBarStyle": "default"
},
{
"id": "b6221fc08b602ea9",
"type": "ui-theme",
"name": "Default Theme",
"colors": {
"surface": "#ffffff",
"primary": "#0094ce",
"bgPage": "#eeeeee",
"groupBg": "#ffffff",
"groupOutline": "#cccccc"
},
"sizes": {
"pagePadding": "12px",
"groupGap": "12px",
"groupBorderRadius": "4px",
"widgetGap": "12px"
}
}
]
The payload is: {"green":"30.48","red":"90.34"}
The goal is to use compound graphs for indoor and outdoor temperatures and other combinations. This is a great example of minimizing the real estate used for these graphs.
Great work to everyone.
