Hallo All,
I've create an dynagraph chart. But sometimes when I need to reset the chart, it's not working. Maybe someone can give me advises for this problem.
Another question is, how to adjust the chart in to maximum value of X.
Here is my code:
[
{
"id": "79e3f109.0eb59",
"type": "tab",
"label": "Flow 1",
"disabled": false,
"info": ""
},
{
"id": "e70a8a42.1241b8",
"type": "function",
"z": "79e3f109.0eb59",
"name": "chart HPU",
"func": "context.data = context.data || {};\nvar chartdata = context.get(\"chartdata\") || [];\nif(msg.topic === \"reset\"){\n startmoment = undefined;\n context.set(\"startmoment\",startmoment);\n context.set(\"chartdata\",[]);\n msg.payload = [];\n return msg;\n}\nswitch (msg.topic) {\n case \"stroke\":\n context.data.stroke = msg.payload;\n break;\n case \"load\":\n context.data.load = msg.payload;\n break;\n}\n\nvar xnew = context.data.stroke;\n//node.warn(xnew);\nvar ynew = context.data.load;\n\nvar ob = {x:xnew, y:ynew};\n// collect datapoints\nchartdata.push(ob);\n\n// limit data collection length\n\n//store data set\ncontext.set(\"chartdata\",chartdata);\n\n//////////////////////////////////////////////////////////////////////////////////\n// reset button has topic 'reset'. clear all data\n\nmsg.payload = [{\n\"series\": [\"A\"],\n\"xAxisID\": 'custom-x-axis',\n\"yAxisID\": 'custom-y-axis',\n\"data\": [chartdata],\n\"labels\": [],\n\"align\": 'center'\n}];\n\nmsg.ui_control = {\n options: {\n elements: {\n line: {\n borderWidth: 3,\n fill:false,\n //lineTension:5,\n spanGaps:true,\n // default = 3\n },\n point:{\n radius:1,\n pointStyle:'circle' \n }\n },\n legend: {\n display: false\n },\n scales: {\n \n xAxes: [{\n gridLines: {\n display:true},\n type: 'linear',\n id: 'custom-x-axis',\n position:'bottom',\n ticks: {display : true,\n // fontColor:\"#ccc\",\n max: 120,\n min :0,\n // autoSkip: true,\n \n // min: -5,\n // stepSize: 20\n }\n }],\n yAxes: [{\n gridLines: {\n display:true},\n id: 'custom-y-axis',\n ticks: {display : true,\n max: 10000,\n min: 0,\n // fontColor:\"#ccc\",\n \n }\n }]\n }\n }\n};\n\nreturn msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"x": 760,
"y": 240,
"wires": [
[
"4ac7af2.2b94cd"
]
]
},
{
"id": "a2dac6ae.0939a8",
"type": "function",
"z": "79e3f109.0eb59",
"name": "stroke length & SPM",
"func": "var max = 120;//STROKE LENGTH\nvar min = 0;\nvar x = 2;\nvar step = 1;\n\nsetInterval(function() {\n if(flow.get(\"run\") === false) {\n return null;\n }\n\nnode.send(msg);\nmsg.payload = x;\n x += step;\n \n if (x ===max || x===min ) {\n step=-step;\n }\n}, 120);\n\n",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"x": 370,
"y": 472,
"wires": [
[
"ad8faed3.cb763",
"f88480ea.a457e"
]
]
},
{
"id": "df040012.96e478",
"type": "inject",
"z": "79e3f109.0eb59",
"name": "",
"props": [
{
"p": "payload",
"v": "true",
"vt": "bool"
},
{
"p": "topic",
"v": "",
"vt": "string"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "true",
"payloadType": "bool",
"x": 130,
"y": 300,
"wires": [
[
"df4a523.b651bb"
]
]
},
{
"id": "f3584599.1f0c38",
"type": "inject",
"z": "79e3f109.0eb59",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "",
"payload": "false",
"payloadType": "bool",
"x": 130,
"y": 360,
"wires": [
[
"df4a523.b651bb"
]
]
},
{
"id": "df4a523.b651bb",
"type": "change",
"z": "79e3f109.0eb59",
"name": "",
"rules": [
{
"t": "set",
"p": "run",
"pt": "flow",
"to": "payload",
"tot": "msg"
}
],
"action": "",
"property": "",
"from": "",
"to": "",
"reg": false,
"x": 310,
"y": 320,
"wires": [
[
"a2dac6ae.0939a8"
]
]
},
{
"id": "2bc169c5.dcaac6",
"type": "function",
"z": "79e3f109.0eb59",
"name": "",
"func": "rnd = Math.round (Math.random()*10000)\nmsg.payload = rnd;\nreturn msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"x": 430,
"y": 180,
"wires": [
[
"3e58701d.a6d868"
]
]
},
{
"id": "4ac7af2.2b94cd",
"type": "ui_chart",
"z": "79e3f109.0eb59",
"name": "",
"group": "7f2e699e.5a9b58",
"order": 5,
"width": 0,
"height": 0,
"label": "Dynagraph",
"chartType": "line",
"legend": "false",
"xformat": "mm",
"interpolate": "linear",
"nodata": "",
"dot": true,
"ymin": "0",
"ymax": "10000",
"removeOlder": 1,
"removeOlderPoints": "",
"removeOlderUnit": "3600",
"cutout": 0,
"useOneColor": false,
"colors": [
"#1f77b4",
"#aec7e8",
"#ff7f0e",
"#2ca02c",
"#98df8a",
"#d62728",
"#ff9896",
"#9467bd",
"#c5b0d5"
],
"useOldStyle": false,
"outputs": 1,
"x": 1050,
"y": 240,
"wires": [
[
"dbddc489.a6c54"
]
]
},
{
"id": "dbddc489.a6c54",
"type": "debug",
"z": "79e3f109.0eb59",
"name": "",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "false",
"x": 1210,
"y": 240,
"wires": []
},
{
"id": "5dbc08f8.10222",
"type": "debug",
"z": "79e3f109.0eb59",
"name": "",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"x": 950,
"y": 340,
"wires": []
},
{
"id": "3e58701d.a6d868",
"type": "change",
"z": "79e3f109.0eb59",
"name": "",
"rules": [
{
"t": "set",
"p": "topic",
"pt": "msg",
"to": "load",
"tot": "str"
}
],
"action": "",
"property": "",
"from": "",
"to": "",
"reg": false,
"x": 590,
"y": 200,
"wires": [
[
"e70a8a42.1241b8",
"e1da766f.60fcb"
]
]
},
{
"id": "e1da766f.60fcb",
"type": "debug",
"z": "79e3f109.0eb59",
"name": "",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "false",
"x": 770,
"y": 180,
"wires": []
},
{
"id": "ad8faed3.cb763",
"type": "change",
"z": "79e3f109.0eb59",
"name": "",
"rules": [
{
"t": "set",
"p": "topic",
"pt": "msg",
"to": "stroke",
"tot": "str"
}
],
"action": "",
"property": "",
"from": "",
"to": "",
"reg": false,
"x": 630,
"y": 320,
"wires": [
[
"e70a8a42.1241b8",
"5dbc08f8.10222"
]
]
},
{
"id": "f88480ea.a457e",
"type": "switch",
"z": "79e3f109.0eb59",
"name": "",
"property": "payload",
"propertyType": "msg",
"rules": [
{
"t": "eq",
"v": "1",
"vt": "str"
}
],
"checkall": "true",
"repair": false,
"outputs": 1,
"x": 607,
"y": 486,
"wires": [
[
"b395fa1f.7919d"
]
]
},
{
"id": "b395fa1f.7919d",
"type": "change",
"z": "79e3f109.0eb59",
"name": "",
"rules": [
{
"t": "set",
"p": "payload",
"pt": "msg",
"to": "[ ]",
"tot": "json"
},
{
"t": "set",
"p": "topic",
"pt": "msg",
"to": "reset",
"tot": "str"
}
],
"action": "",
"property": "",
"from": "",
"to": "",
"reg": false,
"x": 791,
"y": 489,
"wires": [
[
"e70a8a42.1241b8"
]
]
},
{
"id": "46c6dbd0.aae864",
"type": "inject",
"z": "79e3f109.0eb59",
"name": "",
"props": [
{
"p": "payload"
},
{
"p": "topic",
"vt": "str"
}
],
"repeat": "",
"crontab": "",
"once": false,
"onceDelay": 0.1,
"topic": "reset",
"payload": "[]",
"payloadType": "json",
"x": 610,
"y": 80,
"wires": [
[
"e70a8a42.1241b8"
]
]
},
{
"id": "5f3f01c8.b2f86",
"type": "ui_slider",
"z": "79e3f109.0eb59",
"name": "",
"label": "Simulation Weight",
"tooltip": "",
"group": "7f2e699e.5a9b58",
"order": 6,
"width": "6",
"height": "1",
"passthru": true,
"outs": "all",
"topic": "",
"min": 0,
"max": "10000",
"step": 1,
"x": 235.5,
"y": 153,
"wires": [
[
"3e58701d.a6d868",
"953b6eeb.1bf61"
]
]
},
{
"id": "65f18478.74811c",
"type": "ui_button",
"z": "79e3f109.0eb59",
"name": "",
"group": "7f2e699e.5a9b58",
"order": 1,
"width": "4",
"height": "1",
"passthru": false,
"label": "SCAN",
"tooltip": "",
"color": "",
"bgcolor": "",
"icon": "",
"payload": "true",
"payloadType": "bool",
"topic": "",
"x": 111.5,
"y": 210,
"wires": [
[
"df4a523.b651bb"
]
]
},
{
"id": "ed33b58a.3d786",
"type": "ui_button",
"z": "79e3f109.0eb59",
"name": "",
"group": "7f2e699e.5a9b58",
"order": 3,
"width": "4",
"height": "1",
"passthru": false,
"label": "Reset",
"tooltip": "",
"color": "",
"bgcolor": "",
"icon": "",
"payload": "[]",
"payloadType": "json",
"topic": "",
"x": 443.5,
"y": 120,
"wires": [
[
"e70a8a42.1241b8"
]
]
},
{
"id": "d555fcd6.eb7ef",
"type": "ui_button",
"z": "79e3f109.0eb59",
"name": "",
"group": "7f2e699e.5a9b58",
"order": 2,
"width": "4",
"height": "1",
"passthru": false,
"label": "STOP",
"tooltip": "",
"color": "",
"bgcolor": "",
"icon": "",
"payload": "false",
"payloadType": "bool",
"topic": "",
"x": 139,
"y": 439,
"wires": [
[
"df4a523.b651bb"
]
]
},
{
"id": "953b6eeb.1bf61",
"type": "ui_text",
"z": "79e3f109.0eb59",
"group": "7f2e699e.5a9b58",
"order": 4,
"width": "4",
"height": "1",
"name": "",
"label": "Weight",
"format": "{{msg.payload}} Kg",
"layout": "row-spread",
"x": 347.5,
"y": 254,
"wires": []
},
{
"id": "7f2e699e.5a9b58",
"type": "ui_group",
"z": "",
"name": "TEST GRAPH",
"tab": "82374659.722fc8",
"order": 1,
"disp": true,
"width": "20",
"collapse": false
},
{
"id": "82374659.722fc8",
"type": "ui_tab",
"z": "",
"name": "TEST DYNAGRAPH",
"icon": "dashboard",
"disabled": false,
"hidden": false
}
]
This is example a dynagraph from pictures:
Thank you for any advices
