Need to help edit funtion UI Template send payload to gauge

[
{
"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
}
]

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

Hi,

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

image

Thx.

[{"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}]

@ArneR So thanks...

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

flows (3).json (3.1 KB)

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

Thanks in avd

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

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