Automatic layout of telecommunication network topology diagram

In the network topology diagram, it is often necessary to use the automatic layout of the function, in the hierarchical relationship of big data, by hand a place is not too realistic, the workload is quite large, then there is the concept of automatic layout, to liberate the layout of the hands, so that the network topology map can lay out a beautiful pattern, Of course, in some complex layout, the light has automatic layout or not, or the need to do some manual adjustment, in order to make the interface pattern more perfect. Today we're going to talk about the telecommunications network topology map the relevant content of the HT for Web above the automatic layout.

There are two layout schemes available in the HT for Web , one is AutoLayout and the other is forcelayout. AutoLayout provides several sets of fixed layout algorithms, allowing users to choose different layout algorithms according to different requirements, the more commonly used are circular (circular layout) and symmetic (symmetrical layout) two layout methods.

Is the effect of the circular circular layout, you can see in the more complex layout, can be combined with the wiring to render a beautiful layout results.

Is the result of symmetric symmetrical layout, you can find that the layout based on the center point of a relatively symmetrical layout, this layout scheme in space will look more compact, more space-saving.

Other layout types are not explained here, specifically, you can view our AutoLayout manual:http://www.hightopo.com/guide/guide/plugin/autolayout/ Ht-autolayout-guide.html

Forcelayout (elastic layout) and AutoLayout difference is relatively large, it is based on the existence of mutual exclusion between the nodes, the linkage between the existence of gravity, to the dynamic layout of the node, it needs to run for a period of time, the overall topology will gradually achieve convergence and stable equilibrium state, This is the real layout results, not like AutoLayout, immediately set up can immediately see the effect, but in the process of forcelayout layout, its effect is quite joyful.

This is the effect of our elastic layout combined with the Heat force diagram, if you see the effect of its layout is actually better.

On the 3D, it is also a piece of the day, can still be very elegant.  

About forcelayout the relevant content in this side also does not explain, the specific can view our official website manual:http://www.hightopo.com/guide/guide/plugin/forcelayout/ Ht-forcelayout-guide.html

Now the problem, the above two layout methods actually can not fully meet the needs of users, many users also have a specific shape to the layout of nodes, for example, how many nodes around a node to do an oval-shaped uniform distribution, how many elements along a curve to do a uniform distribution. How should these problems be solved? And how to achieve it? Let's talk about how to implement such a specific layout, we call this specific layout called Shapelayout bar.

Http://www.hightopo.com/demo/EdgeType/ShapeLayout-Oval.html This is the effect of our shapelayout, the node is based on the shape of an ellipse layout, how is this implemented? I first of all think, it is not difficult, we know that the ellipse and the circle can be converted to trigonometric functions to represent, then you can calculate the corresponding angle of each node, into the trigonometric expression, you can get the curve above the point coordinates, the node directly assigned to this position can be.

In the example above, you can see that the connection between nodes is near the center of the ellipse, not at the center of the ellipse, and how does this work? This side is related to an expansion of the node type, this side will be named Busedgetype, just like bus route, change more paragraphs, wiring to adapt to a variety of different lines of change, when the drag node, the two ends of the line dynamic changes, always looking for the best connection path.

We'll focus on the implementation and application of Shapelayout and Busedgetype in the following chapters, and we'll talk about it here today.

Automatic layout of telecommunication network topology diagram