Search

CN-122027483-A - Method, system, equipment and medium for generating dynamic interactable topological graph for displaying bidirectional link flow and load in real time

CN122027483ACN 122027483 ACN122027483 ACN 122027483ACN-122027483-A

Abstract

The invention discloses a method, a system, equipment and a medium for generating a dynamic interactable topological graph for displaying bidirectional link flow and load in real time, belonging to the technical field of network topology visualization, and aiming at overcoming the defects that the traditional static topological graph cannot reflect the load transition state of a bidirectional link or ports at two ends of the link in real time and lacks interaction capability, improving the network operation and maintenance efficiency and the accuracy of fault positioning; the method comprises the steps of receiving or acquiring network topology data through WIDGETDATA attributes or APIs, receiving and responding to user interaction operation through binding an event monitor for a G6 graph instance in a CREATEGRAPHEVENTS method, wherein the interaction operation comprises clicking node or link view details, aggregating or expanding nodes and links according to policies and switching layout.

Inventors

  • ZHAO CAN

Assignees

  • 浪潮通信信息系统有限公司

Dates

Publication Date
20260512
Application Date
20260115

Claims (10)

  1. 1. A dynamic interactive topological graph generation method for displaying bidirectional link traffic and load in real time is characterized in that the method maps real-time data of a link into corresponding visual attributes through a data binding and visual coding technology, intuitively reflects network operation states, and comprises the following steps: Receiving or acquiring network topology data through WIDGETDATA attributes or APIs, wherein the network topology data comprises a node list and a link list, and the fields of the node list comprise a number, a name, an IP (Internet protocol), a type, uplink data, downlink data and alarm data; drawing an initial network topology diagram by using a graphic rendering engine according to the network topology data; For each bidirectional link in the network topological graph, dynamically calculating and rendering visual attributes according to the current incoming flow value and the outgoing flow value of each bidirectional link, wherein the visual attributes comprise a link total width used for representing the total flow and a link partition width used for representing the incoming flow and the outgoing flow respectively; In the CREATEGRAPHEVENTS method, the interaction operation of receiving and responding to the user is realized by binding the event listener for the G6 graph instance, wherein the interaction operation comprises clicking on the node or the link to view details, aggregating or expanding the node and the link according to a policy and switching the layout.
  2. 2. The method for generating a dynamic interactive topological graph for displaying bidirectional link traffic and load in real time according to claim 1, wherein the drawing of the initial network topological graph by using a graphic rendering engine according to the network topological data is specifically as follows: Cluster processing, namely calling getMixedNodeChartData and getMixedLinkChartData functions according to options.cluster configuration, folding nodes belonging to the same cluster into a combination, and correspondingly converting links connected with the outside or the inside of the cluster; traversing the processed node list, calling a createNode function in common.js for each node, determining an icon according to the equipment model code of the node, determining the color of the node and whether to enable alarm animation according to the alarm grade, and finally generating a G6 standard node model; The method comprises the steps of establishing links, namely, parallel link processing, namely, detecting a plurality of links connected with the same pair of nodes, marking the corresponding links as links to be aggregated, storing the links in an array of the links to be aggregated, subsequently merging the links into an aggregate link display with one band number, establishing an edge model, namely, determining to establish common edges or Split-Edges according to the options, split-enable configuration, carrying out layout adjustment, calling G6.Util.process Parallels (edges, 15, 'Split-edge') to carry out curvature processing on the parallel edges, wherein the common edges are established, namely, calling common.createNormalides to generate simple straight lines or curves, and establishing Split-Edges, namely, calling common.createSplitedge functions, comparing the common upstream bandwidth utilization and the downstream bandwidth utilization of the links with a preset threshold array, determining colors and threshold levels corresponding to the input and output flows, calculating final colors representing the overall load states, and using the self-defined color data of the final load states, and using the color data to render the model.
  3. 3. The method for generating the dynamic interactable topological graph for displaying the bidirectional link traffic and the load in real time according to claim 1, wherein the rendering of the network topological graph is specifically as follows: In DRAWCHART method, calling graph read (data) method, loading processed node and link data into G6 graphic engine, triggering first rendering of graph; Dynamic rendering, specifically as follows: Data driving, namely acquiring new flow data periodically or in real time through a timer or a WebSocket technology; And updating the strategy, namely after new data are acquired, finding out a corresponding node or link through graph.changedata (newData) or traversing graph.findById (), and calling a item.update (model) method to only update the corresponding node or link style or label attribute.
  4. 4. The method for generating a dynamic interactive topological graph for displaying traffic and load of a bidirectional link in real time according to claim 1, wherein the dynamic calculation and rendering of the visual attribute is specifically that the total width of the link is mapped to the sum of an incoming traffic value and an outgoing traffic value, the link is visually divided into two sections, the width of the first section is proportional to the incoming traffic value, the width of the second section is proportional to the outgoing traffic value, and the first section and the second section are respectively positioned at two sides or upper and lower parts by taking the central line of the link as a boundary.
  5. 5. The method of claim 1, wherein the color mapping rule is a color gradient table that matches a predefined color gradient table according to bandwidth utilization values, the color gradient table comprising a color gradient sequence corresponding from low load to high load.
  6. 6. The method for generating the dynamic interactive topological graph for displaying the traffic and the load of the bidirectional link in real time according to claim 1, wherein the click node or the link checking detail is realized through an integrated graphic tool-tip component, when a user hovers or clicks the node or the link, an information panel is dynamically generated and displayed, and information in the information panel comprises detailed performance data of the corresponding node or the link, wherein the hovering refers to the dynamic generation of HTML content according to the type of hovering elements in a getContent method through a tool-tip plug-in of a G6 graphic engine, and the detailed attribute of the corresponding element type is displayed; The method comprises the steps of detecting a plurality of links connected between the same pair of nodes, combining the links connected between the same pair of nodes to be displayed as an aggregated link, marking the number of the included actual links on the aggregated link, and simultaneously responding to the unfolding operation of a user on the aggregated link to decompose the aggregated link into a plurality of independent links for displaying; Switching the layout dynamically changes the layout configuration and re-layout of the graph by the topo. Changelayout (layoutType) method, supporting switching between force-guided, grid, ring, radial, concentric circular, and random layouts.
  7. 7. The method of generating a dynamic interactable topology map that demonstrates bi-directional link traffic and loading in real time according to any of claims 1 to 6, wherein the interoperation further comprises view scaling and translation, legend screening, and link focus display by legend; Wherein, scaling and translation are realized by a zoom-canvas mode and a dragcanvas mode which are built in the G6 graphic engine; When the legend screening refers to clicking the network topological graph, traversing all edges, setting the link state as high light or overlook, and changing the link style and the color by a graph.setItemState and item.update method to realize the function of high brightness screening according to the load level; The link focus display by the legend is specifically to highlight all links at a particular load level in the legend and place non-associated nodes and links in a dark state in response to a user selection of that load level.
  8. 8. A system for generating a dynamic interactive topological graph for displaying bidirectional link traffic and load in real time, which is characterized in that the system is used for realizing the method for generating the dynamic interactive topological graph for displaying bidirectional link traffic and load in real time according to any one of claims 1 to 7, is constructed based on a Web front end frame and a graphic rendering engine, and comprises the following steps: The system comprises a data interface module, a data processing module and a data processing module, wherein the data interface module is used for acquiring and processing original topology data through a back-end API (application program interface), the original topology data comprises a node list and a link list, wherein the node list information comprises an equipment ID (identity), a name, an IP (Internet protocol) address, a type, a manufacturer, a CPU (central processing unit) utilization rate, a memory utilization rate and an alarm state; the data processing and converting module is used for converting the original topology data into a data format which can be identified by the G6 graphic engine, namely, the original topology data is aggregated, tidied and formatted, node aggregation and expansion according to domains are supported, and merging and expansion display of parallel links are processed; the visual rendering module is used for drawing and dynamically rendering a network topological graph based on the G6 graphic engine, and specifically comprises the following steps: The system comprises an interaction processing module, a topology operation module and a control module, wherein the interaction processing module is used for monitoring and processing user interaction events, updating link flow and load data through a timing request or pushing mechanism and dynamically refreshing views, the interaction events comprise view control, equipment monitoring, link details, topology operation and alarm focusing, the view control supports zooming, translation, resetting and picture export, the equipment monitoring refers to checking equipment details and performance indexes through clicking nodes, the link details refer to displaying a flow detail panel through a mouse hovering or clicking a link, and displaying a bidirectional flow value and a utilization rate; and the auxiliary function module is used for supporting integrated multi-language and providing user interface elements of tool prompts, legends and tool bars.
  9. 9. An electronic device comprising a memory and at least one processor; Wherein the memory has a computer program stored thereon; The at least one processor executing the computer program stored by the memory, causes the at least one processor to perform the method of generating a dynamic interactable topology exhibiting bi-directional link traffic and load in real time as claimed in any one of claims 1 to 7.
  10. 10. A computer readable storage medium having stored therein a computer program executable by a processor to implement the method of dynamically interactable topology generation of a real-time presentation of bi-directional link traffic and load as claimed in any one of claims 1 to 7.

Description

Method, system, equipment and medium for generating dynamic interactable topological graph for displaying bidirectional link flow and load in real time Technical Field The invention relates to the technical field of network topology visualization, in particular to a method, a system, equipment and a medium for generating a dynamic interactable topology graph for displaying bidirectional link flow and load in real time. Background The network topology visualization is used as a core technology of network management and operation and maintenance, and the connection relation and the operation state between network devices are presented in a graphical mode, so that an intuitive network monitoring means is provided for an administrator. Currently, mainstream network management systems (such as Cisco DNA CENTER, solarWinds Network Topology Mapper, PRTG Network Monitor, etc.) provide basic topology discovery and display functions, and many studies on automatic layout algorithms such as force guidance layout and grid layout are also performed in academia. However, through extensive analysis of the prior art and market, the current solution has the following technical problems to be solved: ① The real-time data expressive force is insufficient, that is, the existing topology visualization scheme mostly adopts a static image or a low-frequency update mechanism (generally, a polling interval of more than 5 minutes), and cannot accurately reflect the instantaneous change of network traffic and load. Particularly, in the scenes of financial transactions, cloud computing, internet of things and the like with extremely high requirements on network instantaneity, the delay may cause that operation and maintenance personnel cannot discover key problems such as network congestion, traffic abnormality and the like in time. ② The multi-dimensional data fusion visualization defect is that the traditional scheme is often limited to single-dimensional visual coding when the link state is represented. Such as using only colors to indicate on-off status (green/red), or using a single width to indicate total flow. This representation does not present simultaneous asymmetric bi-directional traffic (both upload and download) and respective load pressures on one physical link, resulting in information loss and cognitive limitations. The administrator cannot quickly judge which direction of traffic is abnormal, and cannot intuitively sense the actual utilization rate of the link. ③ The interaction function is weak, the analysis capability is limited, and the topology map interaction function provided by most commercial and open source tools stays at the basic zooming, translation and click viewing attribute level and lacks the deep analysis capability. For example, the historical states cannot be retrospectively compared, so that focusing analysis is difficult to be performed on links with specific load levels, and effective aggregation and expansion operations cannot be performed on parallel links. This allows the topology to act more as a "situation placard" than an effective "analysis tool", limiting its application value in complex troubleshooting and performance optimization. ④ The automation and the intelligent degree are low, and the existing scheme mostly only considers the network connection relation when generating the layout, and ignores the dynamic service data such as flow and the like. This results in a topology that is generated that may not be logically optimal in terms of traffic, e.g., nodes for high traffic communications may be far apart in the layout, requiring an administrator to spend a significant amount of time manually adjusting the layout, increasing the operational costs. These limitations make it difficult for the prior art to meet the requirements of modern network environments such as software defined networks, 5G core networks, large data centers, etc. on fine, real-time and intelligent operation and maintenance, and restrict further improvement of network operation efficiency and reliability. Therefore, how to overcome the defect that the traditional static topological graph cannot reflect the load transition state of the bidirectional link or the ports at the two ends of the link in real time and lacks the interactive capability, and to improve the network operation and maintenance efficiency and the accuracy of fault location is a technical problem to be solved in the present. Disclosure of Invention The technical task of the invention is to provide a method, a system, equipment and a medium for generating a dynamic interactable topological graph for displaying the flow and the load of a bidirectional link in real time, so as to solve the problems that the traditional static topological graph cannot reflect the load transition state of the bidirectional link or ports at two ends of the link in real time and lacks interaction capability, and improve the network operation and maintenance efficiency and t