How to present tons of custom nodes and links? It’s a mission possible!

How to present tons of custom nodes and links? It’s a mission possible!

Synergy Codes

5 min
How to present tons of custom nodes and links? It’s a mission possible!

It’s a hard nut to crack to present a huge amount of complex data in 2D canvas. The most critical issue is obtaining a readable system of relationships between nodes with data, with a minimum number of edge crossings. We’d add fast data rendering as well. If you deal with the challenge of ‘stuffing’ your data into a diagram, but at the same time, you want it to be readable to allow a quick work, read on.

What method is behind it?

First of all, the overriding issue is the appropriate use of algorithms and libraries, enabling the diagram’s presentation in 2D space. Experts with knowledge and skills in using the above elements can work out a useful method to obtain diagram flow for millions of objects.

Working with a huge amount of data surely can lead you to notice the slow performance of the diagram. Yet, there’s a way out! The Layered Digraph algorithm enables minimizing the number of edge intersections. This way you get the most readable form of your data. In a word – the fewer intersections, the faster the reading of the diagram and the clearer data.

Additionally, by using the Dagre.js library, getting a simple GoJS integration is extremely simple. Its implementation has great computational complexity, which, in turn, affects faster diagram operation and smooth transitions to the data that interests you. In this case, various visualization techniques are used. They rely on rendering on the canvas only those objects that are visible at the moment.

The combination of both methods allows obtaining a full diagram flow even for tens of thousands of nodes.

GoJS ebook

What solutions may be useful to you?

Synergy Codes specialists, who develop diagramming apps, adapt such solutions and functionalities to make working with nodes easy, fast, and pleasant.

For this reason, we use, among others, grouping relationships. They make it possible to customize the view by opening and closing individual data. With the use of virtualization maps, reading data is much simpler.

Another solution that can be just as useful is the use of pin-points that help to connect elements and branch the lines to deliver neat diagram’s view. Along with the appropriate combination of information from databases, you can gain full customization of nodes. Thanks to this, it is possible to assign and modify dependencies supporting the making of complex decisions.

To simplify the view of nodes, we choose simple linking. Another way is grouping the lines. Grouped lines allow you to notice high-level data relationships within the diagrams. On the other hand, ungrouping focuses you on the dependencies details. It enables a neat and visible space with your data.

The technologies and methods mentioned above related to the placement of custom nodes allow for convenient data reading. With the implementation of suitable solutions,  you obtain a game-changing diagram’s readability achieved by a minimum number of edge crossings, grouping, and connecting the elements. Reasonable choice of libraries and algorithms supports fast data rendering, especially in terms of working with tons of data. They’re useful mainly for managers, but also for the users. In fact, everything can be customized to your requirements: the nodes, the links, the palettes, the animations, the algorithms, and the adornments. That’s why custom solutions for the diagrams are highly recommended to those, who search for uncommon data solutions.