Need to help edit funtion UI Template send payload to gauge

Dashboard
1

[
{
"id": "4e028e5a.e8527",
"type": "ui_template",
"z": "fb8fbe0d.771ea",
"group": "48190cbf.587d84",
"name": "",
"order": 4,
"width": 0,
"height": 0,
"format": "\n<html xmlns="http://www.w3.org/1999/xhtml">\n<head runat="server">\n<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>\nMedidor Temperatura, Humedad\n<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js">\n\n\n<script type="text/javascript"\nsrc="https://www.gstatic.com/charts/loader.js">\n\n<script type="text/javascript">\n google.charts.load('current', {\n packages: ['gauge']\n}).then(function () {\n var dataHumid = google.visualization.arrayToDataTable([\n ['Label', 'Value'],\n ['Humid', 0]\n ]);\n\n var dataTemp = google.visualization.arrayToDataTable([\n ['Label', 'Value'],\n ['Temp', 0]\n ]);\n\n var optionsHumid = {\n width: 170, height: 170,\n redFrom: 0, redTo: 33,\n yellowFrom: 33, yellowTo: 66,\n greenFrom: 66, greenTo: 100,\n majorTicks: ['0','10','20','30','40','50','60','70','80','90', '100'],\n minorTicks: 10\n };\n\n var formatHumid = new google.visualization.NumberFormat({\n suffix: '%',\n fractionDigits: 1\n });\n formatHumid.format(dataHumid, 1);\n\n var optionsTemp = {\n width: 170, height: 170,\n redFrom: 30, redTo: 45,\n yellowFrom: 24, yellowTo: 30,\n greenFrom: 12, greenTo: 24,\n majorTicks: ['0','10','20','30','40','50','60','70','80','90', '100'],\n minorTicks: 10\n };\n\n var formatTemp = new google.visualization.NumberFormat({\n suffix: 'h',\n fractionDigits: 1\n });\n formatTemp.format(dataTemp, 1);\n\n var chartHumid = new google.visualization.Gauge(document.getElementById("chart_Humid"));\n var chartTemp = new google.visualization.Gauge(document.getElementById("chart_Temp"));\n\n chartHumid.draw(dataHumid, optionsHumid);\n chartTemp.draw(dataTemp, optionsTemp);\n\n setInterval(function() {\n /*\n var JSON=.ajax({\n url:\"sensores.php\",\n dataType: 'json',\n async: false}).responseText;\n var Respuesta=jQuery.parseJSON(JSON);\n dataHumid.setValue(0, 1, Respuesta[0].humidity);\n */\n dataHumid.setValue(0, 1, 74.9);\n formatHumid.format(dataHumid, 1);\n chartHumid.draw(dataHumid, optionsHumid);\n }, 1300);\n\n setInterval(function() {\n /*\n var JSON=.ajax({\n url:"sensores.php",\n dataType: 'json',\n async: false}).responseText;\n var Respuesta=jQuery.parseJSON(JSON);\n dataTemp.setValue(0, 1, Respuesta[0].temperature);\n */\n dataTemp.setValue(0, 1, 27.5);\n formatTemp.format(dataTemp, 1);\n chartTemp.draw(dataTemp, optionsTemp);\n }, 1300);\n});",
"storeOutMessages": true,
"fwdInMessages": true,
"resendOnRefresh": true,
"templateScope": "local",
"x": 490,
"y": 220,
"wires": [

]
},
{
"id": "48190cbf.587d84",
"type": "ui_group",
"z": "",
"name": "Default",
"tab": "711389cf.7d4e18",
"order": 1,
"disp": true,
"width": "25",
"collapse": false
},
{
"id": "711389cf.7d4e18",
"type": "ui_tab",
"z": "",
"name": "Home1",
"icon": "dashboard",
"disabled": false,
"hidden": false
}
]

2

i'am brginer for use NR, please help me for modify node tempate whene sending data showing in gauge Thanks....

3

Hi,

Nobody can load your flow.
Can you please place the code between " ``` "?

image

Thx.

4 
[{"id":"4e028e5a.e8527","type":"ui_template","z":"fb8fbe0d.771ea","group":"48190cbf.587d84","name":"","order":4,"width":0,"height":0,"format":"<!DOCTYPE html>\n<html xmlns=\"http://www.w3.org/1999/xhtml\">\n<head runat=\"server\">\n<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\"/>\n<title>Medidor Temperatura, Humedad</title>\n<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js\">\n</script>\n\n<script type=\"text/javascript\"\nsrc=\"https://www.gstatic.com/charts/loader.js\"></script>\n\n<script type=\"text/javascript\">\n google.charts.load('current', {\n  packages: ['gauge']\n}).then(function () {\n  var dataHumid = google.visualization.arrayToDataTable([\n    ['Label', 'Value'],\n    ['Humid', 0]\n  ]);\n\n  var dataTemp = google.visualization.arrayToDataTable([\n    ['Label', 'Value'],\n    ['Temp', 0]\n  ]);\n\n  var optionsHumid = {\n    width: 170, height: 170,\n    redFrom: 0, redTo: 33,\n    yellowFrom: 33, yellowTo: 66,\n    greenFrom: 66, greenTo: 100,\n    majorTicks: ['0','10','20','30','40','50','60','70','80','90', '100'],\n    minorTicks: 10\n  };\n\n  var formatHumid = new google.visualization.NumberFormat({\n    suffix: '%',\n    fractionDigits: 1\n  });\n  formatHumid.format(dataHumid, 1);\n\n  var optionsTemp = {\n    width: 170, height: 170,\n    redFrom: 30, redTo: 45,\n    yellowFrom: 24, yellowTo: 30,\n    greenFrom: 12, greenTo: 24,\n    majorTicks: ['0','10','20','30','40','50','60','70','80','90', '100'],\n    minorTicks: 10\n  };\n\n  var formatTemp = new google.visualization.NumberFormat({\n    suffix: 'h',\n    fractionDigits: 1\n  });\n  formatTemp.format(dataTemp, 1);\n\n  var chartHumid = new google.visualization.Gauge(document.getElementById(\"chart_Humid\"));\n  var chartTemp = new google.visualization.Gauge(document.getElementById(\"chart_Temp\"));\n\n  chartHumid.draw(dataHumid, optionsHumid);\n  chartTemp.draw(dataTemp, optionsTemp);\n\n  setInterval(function() {\n    /*\n    var JSON=$.ajax({\n      url:\"sensores.php\",\n      dataType: 'json',\n      async: false}).responseText;\n    var Respuesta=jQuery.parseJSON(JSON);\n    dataHumid.setValue(0, 1, Respuesta[0].humidity);\n    */\n    dataHumid.setValue(0, 1, 74.9);\n    formatHumid.format(dataHumid, 1);\n    chartHumid.draw(dataHumid, optionsHumid);\n  }, 1300);\n\n  setInterval(function() {\n    /*\n    var JSON=$.ajax({\n      url:\"sensores.php\",\n      dataType: 'json',\n      async: false}).responseText;\n    var Respuesta=jQuery.parseJSON(JSON);\n    dataTemp.setValue(0, 1, Respuesta[0].temperature);\n    */\n    dataTemp.setValue(0, 1, 27.5);\n    formatTemp.format(dataTemp, 1);\n    chartTemp.draw(dataTemp, optionsTemp);\n  }, 1300);\n});\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":490,"y":220,"wires":[[]]},{"id":"48190cbf.587d84","type":"ui_group","z":"","name":"Default","tab":"711389cf.7d4e18","order":1,"disp":true,"width":"25","collapse":false},{"id":"711389cf.7d4e18","type":"ui_tab","z":"","name":"Home1","icon":"dashboard","disabled":false,"hidden":false}]
5

@ArneR So thanks...

6

I suspect this is not your full flow?
Can you share the full flow?

7

flows (3).json (3.1 KB)

8

@ArneR this is as flows(3) is full flow and just send data from msg.payload to guage value

Thanks in avd

9

Someone else will have to help, I'm afraid.

10

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