V3 Design Consideration: Wire "Jumps"

Hi, I'd like to offer a thought for v3 or beyond. One of the things that can be visually confusing in Node-RED complex flows is where wires cross each other.

May diagramming tools use the engineering drawing style "jump" where the wire visually has a small loop as in this example from Microsoft Visio.


The wire with the loop on it is generally the one with the highest Z value.

1 Like

This just made me think of flows in a 3 dimensional space :exploding_head:


Hi @TotallyInformation

The challenge with this idea is the cost of implementation. We would have to calculate the intersection point of every wire whenever anything moved inorder to add this level of detail.

As it stands, we want to reduce the cost of rendering the flows, not increase it :wink:

The wires do have a white border which helps to some degree to show where they overlap. We could certainly explore tweaks to that to make it more apparent.

1 Like

OK, thanks Nick, I can see the issue. Yes, a small tweak to make the crossover a little more visible would probably be as good anyway.

Some time in the last 20 years, while I wasn't looking, the common practice for this seems to have changed. Generally, wires that cross are assumed not to be connected unless there is a small "dot" or "blob" at the intersection. This probably happened, as @knolleary implies, to reduce the burden on circuit drawing and simulation software.

A good way to look at this might be that such crossings are just artifacts of how the editor displays the flow. They do not create any functionality, and so probably should not consume any resources in the editor or runtime. If old-timers like me are bothered by it, we can always re-draw the flow. The "younger generation" probably grew up with the new style and have no trouble.

1 Like

Maybe if the opacity of the border wasn’t quite 100% then they would “dim” as they crossed ? Bit line roads under a bridge on a map

1 Like

This is what the wires look like today where they cross:


The opacity of the border is set to 40%

So rather than reduce the opacity, one option would be to increase it:


Here's a side-by-side comparison:


Just keep in mind these are zoomed in views which over exaggerates the effect.


Nice. Yes. Presume that could be part of the theme so users could tweak anyway ?

1 Like

Ah, well I learned engineering drawing in the 1970's and it was all done by hand :older_man: :grinning:

I definitely think that increasing the opacity would help at cross-overs as long as it doesn't mess up other parts of the flow visual.

This got more of a debate going than I was anticipating :grinning:

It's OK on a white background, but would not look good in a 'group' with a coloured background... unless of course the border was colour keyed to the background.

Same here, but in the '60s for me.

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