Chart help with data series and colours


I thought I had it worked out the other day when I posted a question or solution on how to set the colour on a graph if you have multiple data series going to the chart.

The first series gets the first colour, the second series gets the second colour and so on.
The colour being the 9 listed in the lower part of the edit screen of the chart.
Starting top left, going right along that row, like reading a page.

Alas there was a hic-up with my flow and when the data started coming back in the two series of data swapped who was which colour.

Not the end of the game, but a bit annoying.

How can I get it that it there is a reboot/total disruption to data received, that when it restarts, series 1 gets its foot in the door before series 2 so they get the preferred colours?

This is an EXAMPLE of the flow structure:
I didn't include the chart node only to negate the hassle of a dashboard item being "born" for no real reason.

[{"id":"123a0e1d.2b2592","type":"inject","z":"baf80d2f.6bd538","name":"Stream 1","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":240,"y":4490,"wires":[["b549cf5e.c485f"]]},{"id":"2d21d936.26809e","type":"inject","z":"baf80d2f.6bd538","name":"Stream 2","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":240,"y":4570,"wires":[["b549cf5e.c485f"]]},{"id":"b549cf5e.c485f","type":"debug","z":"baf80d2f.6bd538","name":"Chart node","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","x":470,"y":4530,"wires":[]}]

I want stream 1 to get the first colour and stream 2 to get the second.



There isn't any nice solution but some dirty tricks can be done.

[{"id":"9448cee9.ffa72","type":"inject","z":"3c409e2.49e6162","name":"","topic":"","payload":"","payloadType":"date","repeat":"1","crontab":"","once":false,"onceDelay":0.1,"x":170,"y":280,"wires":[["93a365c9.c9fca8"]]},{"id":"93a365c9.c9fca8","type":"function","z":"3c409e2.49e6162","name":"generate data","func":"var t = Math.floor(Math.random()*2)+1 === 1 ? \"first\" : \"second\"\nmsg.topic = t\nmsg.payload = Math.floor(Math.random()*6)\nreturn msg;","outputs":1,"noerr":0,"x":350,"y":280,"wires":[["d1e96723.c0ebd8"]]},{"id":"e4105fc8.13de","type":"ui_chart","z":"3c409e2.49e6162","name":"","group":"a62a0f79.cccc6","order":2,"width":0,"height":0,"label":"chart","chartType":"line","legend":"false","xformat":"HH:mm:ss","interpolate":"bezier","nodata":"","dot":false,"ymin":"","ymax":"","removeOlder":1,"removeOlderPoints":"","removeOlderUnit":"3600","cutout":0,"useOneColor":false,"colors":["#1f77b4","#ff0000","#ff7f0e","#2ca02c","#98df8a","#d62728","#ff9896","#9467bd","#c5b0d5"],"useOldStyle":false,"x":700,"y":280,"wires":[[],[]]},{"id":"d1e96723.c0ebd8","type":"function","z":"3c409e2.49e6162","name":"ensure the first","func":"// if you are using presistable context storage only\n// then you should probably activate memory option too\n// and store this firstTopic in memory only.\n// otherwise after reload/restart the  \n// value of firstTopic will be filled from previous sessiom\n// and this function does nothing  \nvar firstTopic = context.get(\"firstTopic\")\n\n//you'll need to know the name of topic youll need as the first one\nif(msg.topic === \"first\" && msg.topic !== firstTopic){\n    firstTopic = msg.topic;\n    context.set(\"firstTopic\",firstTopic);\n    return msg\n}\nif(msg.topic !== \"first\" && firstTopic !== \"first\"){\n   // any other topic filtered out if first  topic is not seen yet\n   return\n}\nreturn msg;","outputs":1,"noerr":0,"x":540,"y":280,"wires":[["e4105fc8.13de"]]},{"id":"a62a0f79.cccc6","type":"ui_group","z":"","name":"ILM","tab":"c557d8de.586c48","order":2,"disp":false,"width":"20","collapse":false},{"id":"c557d8de.586c48","type":"ui_tab","z":"","name":"MAIN","icon":"dashboard","order":1}]
1 Like

Chart Series Get Reversed


I was suspicious something like that would need to be done.

I just got up and am quickly looking before I have to get on with today's jobs.

This will take a while for me to get, because (no offence) my parsing isn't too good reading the code.

When I do context.get() and context.set() I use ' around the names because I thought that was the way.

I see you use " instead.

Not a big deal, but as I have just got up and trying to read it, I am getting errors in the My_brain() reading it.

I'll look at it this afternoon/evening when today is done.

Much appreciated.