Hello, I am currently having trouble passing variables from NodeRed to the uibuilder. I tried but could not succeed, looking forward to the help from everyone
[{"id":"dc0d2300.808ca","type":"uibuilder","z":"45e6321b.f6d65c","name":"","topic":"","url":"uibuilder11","fwdInMessages":false,"allowScripts":false,"allowStyles":false,"copyIndex":true,"showfolder":false,"x":930,"y":380,"wires":[[],[]]},{"id":"adcc5abd.6a5b18","type":"comment","z":"45e6321b.f6d65c","name":"html","info":"<script src=\"https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js\"></script>\n<script src=\"https://cdn.jsdelivr.net/npm/highcharts@6/highcharts.js\"></script>\n<!-- vue-highcharts should be load after Highcharts -->\n<script src=\"https://cdn.jsdelivr.net/npm/vue-highcharts/dist/vue-highcharts.min.js\"></script>\n\n<div id=\"app-chart\">\n <highcharts :options=\"options\" ref=\"highcharts\"></highcharts>\n <button @click=\"updateCredits\">update credits</button>\n</div>\n<script type=\"text/javascript\" src=\"chart.js\"></script>","x":810,"y":420,"wires":[]},{"id":"e152c0fc.de134","type":"function","z":"45e6321b.f6d65c","name":"","func":"msg.payload = [-0.9, 0.6, 3.5, 8.4, 13.5, 20.0, 15.6, 17.9, 90.3, 9.0, 3.9, 1.0]\nreturn msg;","outputs":1,"noerr":0,"x":730,"y":380,"wires":[["dc0d2300.808ca"]]},{"id":"43cafedc.b8678","type":"inject","z":"45e6321b.f6d65c","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":580,"y":380,"wires":[["e152c0fc.de134"]]},{"id":"7969ea24.ce5ba4","type":"comment","z":"45e6321b.f6d65c","name":"js","info":"var options = {\n title: {\n text: 'Monthly Average Temperature',\n x: -20 //center\n },\n subtitle: {\n text: 'Source: WorldClimate.com',\n x: -20\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',\n 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'\n ]\n },\n yAxis: {\n title: {\n text: 'Temperature (°C)'\n },\n plotLines: [{\n value: 0,\n width: 1,\n color: '#808080'\n }]\n },\n tooltip: {\n valueSuffix: '°C'\n },\n legend: {\n layout: 'vertical',\n align: 'right',\n verticalAlign: 'middle',\n borderWidth: 0\n },\n \n series: [\n\n {\n name: 'New York',\n data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]\n }, {\n name: 'Berlin',\n data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]\n }, {\n name: 'London',\n data: msgRecvd\n }]\n};\n\nvar vm = new Vue({\n el: '#app-chart',\n data: {\n options: options\n },\n methods: {\n \tupdateCredits: function() {\n \tvar chart = this.$refs.highcharts.chart;\n chart.credits.update({\n style: {\n color: '#' + (Math.random() * 0xffffff | 0).toString(16)\n }\n });\n }\n },\n mounted: function(){\n uibuilder.start()\n var vueApp = this\n uibuilder.onChange('msg', function(newVal){\n\n vueApp.msgRecvd = newVal.payload\n\n })\n }\n});\n","x":810,"y":460,"wires":[]}]
