Radar graph not scaling to space correctly

[zackr]

I am creating a dashboard to display some data I have collected and while using the Radar graph it seems the chart will not change size like the other graphs I have used. Another issue with the radar graphs is they keep the fill of the previously displayed graph, bar graphs will show a completely opaque radar but if a line graph was last the radar will display correctly. I have worked around this by double sending some messages but if there is a better solution to this advice would be appreciated.

Here is a sample of the flow I am using to test this functionality.

[{"id":"6c4b43fa0ea0d26c","type":"ui_chart","z":"1886d6493bde1b09","name":"Trend","group":"7f3e99ce0121daec","order":1,"width":24,"height":8,"label":"","chartType":"pie","legend":"true","xformat":" ","interpolate":"linear","nodata":"Select data first","dot":false,"ymin":"","ymax":"","removeOlder":"1","removeOlderPoints":"","removeOlderUnit":"1","cutout":"","useOneColor":true,"colors":["#ffff00","#aec7e8","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"useOldStyle":true,"outputs":1,"x":1020,"y":160,"wires":[[]]},{"id":"3248f91d1e22c89b","type":"ui_button","z":"1886d6493bde1b09","name":"Bar H","group":"7f3e99ce0121daec","order":2,"width":6,"height":1,"passthru":true,"label":"Bar Hor.","tooltip":"","color":"","bgcolor":"","icon":"fa-align-left fa-lg","payload":"2","payloadType":"num","topic":"","x":530,"y":140,"wires":[["49561bacdb55377d"]]},{"id":"27202292cd989861","type":"ui_button","z":"1886d6493bde1b09","name":"Bar V","group":"7f3e99ce0121daec","order":3,"width":6,"height":1,"passthru":true,"label":"Bar Vert.","tooltip":"","color":"","bgcolor":"","icon":"fa-bar-chart fa-lg","payload":"1","payloadType":"str","topic":"","x":530,"y":100,"wires":[["0b4156ae8d15455c"]]},{"id":"b3c55f61e4f85ac3","type":"ui_button","z":"1886d6493bde1b09","name":"Line","group":"7f3e99ce0121daec","order":4,"width":6,"height":1,"passthru":true,"label":"Line","tooltip":"","color":"","bgcolor":"","icon":"fa-line-chart fa-lg","payload":"3","payloadType":"num","topic":"","x":530,"y":180,"wires":[["6b1acc40a1999452"]]},{"id":"25e9584c7196bfdb","type":"ui_button","z":"1886d6493bde1b09","name":"Radar","group":"7f3e99ce0121daec","order":5,"width":6,"height":1,"passthru":true,"label":"Radar","tooltip":"","color":"","bgcolor":"","icon":"track_changes","payload":"4","payloadType":"num","topic":"","x":530,"y":220,"wires":[["2fa8d080778e73d4"]]},{"id":"0b4156ae8d15455c","type":"function","z":"1886d6493bde1b09","name":"Show Bar V","func":"msg.info = 'BarGraph';\nmsg.ui_control = ({look: 'bar'});\nnode.send(msg);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":670,"y":100,"wires":[["34f727fb7c6c11f5"]]},{"id":"49561bacdb55377d","type":"function","z":"1886d6493bde1b09","name":"Show Bar H","func":"msg.info = 'HorbarGraph';\nmsg.ui_control = ({look: 'horizontalBar'});\nnode.send(msg);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":670,"y":140,"wires":[["34f727fb7c6c11f5"]]},{"id":"6b1acc40a1999452","type":"function","z":"1886d6493bde1b09","name":"Show Line","func":"msg.info = 'LineGraph';\nmsg.ui_control = ({look: 'line'});\nnode.send(msg);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":670,"y":180,"wires":[["34f727fb7c6c11f5"]]},{"id":"2fa8d080778e73d4","type":"function","z":"1886d6493bde1b09","name":"Show Radar","func":"msg.info = 'LineGraph';\nmsg.ui_control = ({ look: 'line' });\nnode.send(msg);\nmsg.info = 'RadarGraph';\nmsg.ui_control = ({look: 'radar'});\nnode.send(msg);\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":670,"y":220,"wires":[["34f727fb7c6c11f5"]]},{"id":"34f727fb7c6c11f5","type":"function","z":"1886d6493bde1b09","name":"function 1","func":"msg.payload =  [{ \"series\": [\"Test_Data\"], \"data\": [[\"39.05\", \"41.84\", \"40.89\", \"41.27\", \"41.03\", \"40.37\", \"39.97\", \"39.10\", \"41.10\", \"40.95\", \"43.52\", \"44.61\", \"43.61\", \"43.88\"]], \"labels\": [\"06/12\", \"07/12\", \"08/12\", \"09/12\", \"10/12\", \"11/12\", \"12/12\", \"13/12\", \"14/12\", \"15/12\", \"16/12\", \"17/12\", \"18/12\", \"19/12\"] }];\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":870,"y":160,"wires":[["6c4b43fa0ea0d26c"]]},{"id":"7f3e99ce0121daec","type":"ui_group","name":"Default","tab":"1002426497aa8a72","disp":true,"width":24,"collapse":false},{"id":"1002426497aa8a72","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}]

[post edited by moderator to make flow importable]

[zenofmud]

Why are you both sending msg and returning msg in your functions?

and why is the radar function sending the line graph then the RadaeGraph?

msg.info = 'LineGraph';
msg.ui_control = ({ look: 'line' });
node.send(msg);
msg.info = 'RadarGraph';
msg.ui_control = ({look: 'radar'});
node.send(msg);
return msg;

=================
In order to make code readable and usable it is necessary to surround your code with three backticks (also known as a left quote or backquote ```)

``` 
   code goes here 
```

You can edit and correct your post by clicking the pencil icon.

See this post for more details - How to share code or flow json

[zackr]

Thank you for your response and for the help with the code readability.
To answer your question, I am sending and returning msg in the line and radar graph because when I try to change the graph type it does not display the data, only the second message changes it from displaying nothing to showing the data correctly.

I am also sending the line graph before the radar graph due to a bug that causes the radar graph to be displayed incorrectly if swapping directly from the bar graphs as shown below (The code snippet in my post does not do this unless the line graph send is removed from the "Show Radar" function. Sending the line graph seems to fix this issue but I am unsure if there is a more elegant way to do the same thing.

[zenofmud]

I spent some more time playing with this but I have no answer for you. There seems to be a bug but I don't know where it might be. Sorry.