Network topology display method and device, electronic equipment, medium and program product

Abstract

The invention discloses a network topology display method, a network topology display device, electronic equipment, a non-volatile computer readable storage medium and a computer program product. The display method of the network topology comprises the following steps: determining a virtual view based on the network topology, wherein the virtual view comprises each topology node and a topology line segment corresponding to each topology node; determining a target node and a target topological line segment in the topological nodes and topological line segments of the virtual view, wherein the target node and the target topological line segment are located in the current display area; and rendering the target node and the target topological line segment to display a network topological graph. Thus, only the topological nodes and the topological line segments which can be displayed in the current display area corresponding to the display screen are generated and rendered, a global network topological graph of the current scene does not need to be generated, and the virtual view does not need to be actually generated, so that the memory occupied by the finally generated network topological graph is greatly reduced, memory overflow is avoided, and the user experience is improved. And software operation is not smooth.

Description

Technical Field

[0001] This application relates to the technical field of network topology. More specifically, it relates to a method for displaying a network topology, a device for displaying a network topology, an electronic device, a non-volatile computer-readable storage medium, and a computer program product. Background Art

[0002] A network topology diagram is used to intuitively display the current network hierarchy, making it more convenient for users to manage and view the network. However, in the case where the number of network devices in the current scenario is relatively large, it is easy to cause a large amount of computation when drawing the network topology diagram, and it occupies a large amount of memory, which may easily lead to problems such as APP memory overflow, serious lag, and inability to run smoothly. Summary of the Invention

[0003] Embodiments of this application provide a method for displaying a network topology, a device for displaying a network topology, an electronic device, a non-volatile computer-readable storage medium, and a computer program product.

[0004] The method for displaying a network topology according to the embodiments of this application includes: determining a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node; determining, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area; and rendering the target nodes and target topology line segments to display a network topology diagram.

[0005] The device for displaying a network topology according to the embodiments of this application includes a first determination module, a second determination module, and a rendering module. The first determination module is configured to determine a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node. The second determination module is configured to determine, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area. The rendering module is configured to render the target nodes and target topology line segments to display a network topology diagram.

[0006] The electronic device according to the embodiments of this application includes a processor, a memory, and a computer program. Among them, the computer program is stored in the memory and is executed by the processor. The computer program includes instructions for executing the method for displaying a network topology. The method for displaying a network topology includes determining a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node; determining, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area; and rendering the target nodes and target topology line segments to display a network topology diagram.

[0007] The non - volatile computer - readable storage medium of the embodiment of the present application includes a computer program. When the computer program is executed by a processor, the processor is caused to execute a method for displaying a network topology. The method for displaying the network topology includes: determining a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node; determining, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area; and rendering the target nodes and target topology line segments to display a network topology diagram.

[0008] The computer program product of the embodiment of the present application includes instructions for executing a method for displaying a network topology. The method for displaying the network topology includes: determining a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node; determining, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area; and rendering the target nodes and target topology line segments to display a network topology diagram.

[0009] The method for displaying a network topology, the device for displaying a network topology, the electronic device, the non - volatile computer - readable storage medium, and the computer program product of the embodiment of the present application first determine the topology nodes and the corresponding topology line segments in the virtual view corresponding to each device in the current scenario, where the virtual view is a hypothesized network topology diagram and not a real - rendered image. At the same time, the display area of the display screen is abstracted as the current display area located in the same space as the virtual view. Then, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area are determined. It can be understood that the target nodes and target topology line segments are the nodes and line segments that can be displayed in the virtual view. Then, the target nodes and target topology line segments are rendered to generate and display a network topology diagram. In this way, the present application only generates and renders the topology nodes and topology line segments that can be displayed in the current display area corresponding to the display screen, without generating a global network topology diagram of the current scenario. The virtual view does not need to be actually generated, so as to greatly reduce the memory occupied by the finally generated network topology diagram, thereby avoiding problems such as memory overflow and unsmooth software operation.

[0010] Additional aspects and advantages of the embodiments of the present application will be given in part in the following description, will become apparent in part from the following description, or will be understood through the practice of the embodiments of the present application. Description of the Drawings

[0011] The above - mentioned and / or additional aspects and advantages of the present application will become apparent and be readily understood from the description of the embodiments in conjunction with the following drawings, where:

[0012] Figure 1is a network topology diagram of the prior art;

[0013] Figure 2 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0014] Figure 3 is a schematic diagram of a scenario of a method for displaying a network topology according to some embodiments of the present application;

[0015] Figure 4 is a schematic diagram of a scenario of a method for displaying a network topology according to some embodiments of the present application;

[0016] Figure 5 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0017] Figure 6 is a schematic diagram of a scenario of a method for displaying a network topology according to some embodiments of the present application;

[0018] Figure 7 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0019] Figure 8 is a schematic diagram of a scenario of a method for displaying a network topology according to some embodiments of the present application;

[0020] Figure 9 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0021] Figure 10 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0022] Figure 11 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0023] Figure 12 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0024] Figure 13 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0025] Figure 14 is a partial schematic diagram of a network topology diagram of the prior art;

[0026] Figure 15 is a partial schematic diagram of a network topology diagram of a method for displaying a network topology according to some embodiments of the present application;

[0027] Figure 16 is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0028] Figure 17 It is a schematic flowchart of a method for displaying a network topology according to some embodiments of the present application;

[0029] Figure 18 It is a network topology diagram of a method for displaying a network topology according to some embodiments of the present application;

[0030] Figure 19 It is a schematic diagram of a scenario on an Android system of a method for displaying a network topology according to some embodiments of the present application;

[0031] Figure 20 It is a schematic diagram of a scenario on an iOS system of a method for displaying a network topology according to some embodiments of the present application;

[0032] Figure 21 It is a schematic diagram of modules of a device for displaying a network topology according to some embodiments of the present application;

[0033] Figure 22 It is a schematic structural diagram of an electronic device according to some embodiments of the present application;

[0034] Figure 23 It is a schematic diagram of the connection state of a non - volatile computer - readable storage medium and a processor according to some embodiments of the present application;

[0035] Figure 24 It is a schematic structural diagram of a computer program product according to some embodiments of the present application. Detailed Embodiments

[0036] The following details the embodiments of the present application. The examples of the embodiments are shown in the accompanying drawings, where the same or similar reference numerals denote the same or similar elements or elements having the same or similar functions throughout. The embodiments described below with reference to the accompanying drawings are exemplary only for explaining the embodiments of the present application and should not be construed as limiting the embodiments of the present application.

[0037] The network topology diagram is used to intuitively display the current network hierarchy, making it more convenient for users to manage and view the network. In some Application (APP) for network management, the APP needs to draw a network topology diagram to manage the network, and users can view the network topology diagram on an electronic device installed with such an APP. At this time, the implementation of the network topology diagram mainly proceeds through three steps: node calculation, node drawing, and sliding processing. As Figure 1 shown, the data source of the topology is the backend. After the APP requests and obtains the node data for calculation and drawing, the connection topology relationship of the devices can be clearly displayed on the display screen, and dragging and zooming can also be performed.

[0038] However, when the number of network devices in the current scenario is relatively large, drawing a network topology diagram can easily lead to a large amount of computation and memory occupancy, thus easily causing problems such as APP memory overflow, severe lag, and inability to run smoothly. Specifically, when the existing technology draws a network topology diagram, it will draw all network devices in the current scenario. When the number of nodes in the topology is increased, the existing technology solutions cannot run properly. After verification, when the number of nodes is increased to more than 1000, severe lag will occur and it cannot run smoothly. After increasing to 2500 nodes, the APP will crash. The main reason for this problem is memory overflow. The View of each node will be drawn, and a too large number of nodes can easily lead to memory overflow.

[0039] To solve the above technical problems, the embodiments of the present application provide a method for displaying a network topology. The following will elaborate in detail on the method for displaying the network topology of the present application:

[0040] The embodiments of the present application provide a method for displaying a network topology. First, the application scenario of the method for displaying a network topology will be described:

[0041] The display method of the present application can be applied to a mobile terminal. A mobile terminal, also known as a mobile communication terminal, refers to a computer device that can be used while moving. Generally speaking, mobile terminals include mobile phones, laptop computers, tablet computers, POS machines, in-vehicle intelligent terminals, and wearable devices, etc. The mobile terminal operating system is a program that manages the hardware and software resources of the mobile terminal. It provides a user interface for interacting with the device and controls various functions of the device. The main mobile terminal operating systems include Android, iOS, Windows, and HarmonyOS, etc. In some embodiments, the operating system of the present application includes the Android system or the iOS system.

[0042] The network topology structure refers to the physical layout of interconnecting various devices with transmission media. The current scenario is a specific network environment or network architecture that needs to be understood or managed, such as a small office network, a large enterprise network, a data center network, or any network environment that needs to visualize and manage its structure and connection relationships through a network topology diagram.

[0043] Taking the network topology on the iOS system as an example, based on the iOS UIScrollView and the Zoom pinch gesture enabled by UIScrollView, the device is abstracted as a topology node, and the association between devices is abstracted as a topology line segment. The drawing of the topology map is divided into the following parts: (1) constructing a node model tree; (2) constructing a view model tree; (3) calculating the view layout; (4) drawing the view; (5) drawing the connection line. Finally, the following functions are realized: following finger zooming, dragging, and inertial sliding, supporting clicking to return to the center of the screen, supporting customizing the complex layout of sub-nodes, supporting node layout click events, and not conflicting with the sliding and zooming gestures, customizing the connection lines between nodes and supporting dynamic deletion and addition of nodes.

[0044] The entire custom View of IOS is divided into:

[0045] The topmost layer is the UIScrollView, which is mainly used to handle sliding and pinch gestures, and adjusts the position of the topology view in real time when zooming occurs to keep it always centered on the screen. The next layer is the TPTopologyView, which is responsible for creating and laying out all node and connection line views. Finally, there are the node view and the connection line view. The node TPTopographyNodeView updates the node display content according to the node data model; the connection line node TPTopographyLineView updates the line drawing according to the connection line node data; the response to click events occurs on the node view to support custom events such as clicking to jump to a device.

[0046] Taking the network topology on the Android system as an example, the custom view structure of the network topology is divided into three layers: the top layer is the TreeView, which inherits the FrameLayout and is mainly used to handle swipe and pinch gestures. When it is determined that the gesture is a swipe or a pinch, this layer will intercept and operate on the position and size of the lower-level page according to specific values. The next layer is the TreeViewContainer, which is a ViewGroup that places all the node Views (i.e., the node views of each topology node) and the connection lines (i.e., the topology line segments of each topology node). It can be understood that the network topology diagram is generated in the TreeViewContainer, and the APP displays based on the image in the TreeViewContainer. Finally, there are the node Views. The node Views are placed in the TreeViewContainer according to their specific positions and arranged in a certain layout. This layer will also respond to click events to support custom events such as clicking to jump to a device. In the page layout, the TreeView is basically the same size as the Activity layout, where Activity is a user interface in an Android application used to display various UI elements and handle the interaction events of these elements.

[0047] The size of the TreeViewContainer is obtained by calculating the size of the topology diagram. In the case of a large number of nodes, the TreeViewContainer will also be very large, causing a crash. Therefore, the TreeViewContainer cannot be increased without limit.

[0048] Therefore, it is considered to simulate the topology diagram in a virtual view, and by calculating the intersection between the virtual view and the display screen, the node views within the display screen range are displayed.

[0049] Based on the above thinking results, please refer to Figure 2 , the display method of the network topology of this application includes:

[0050] Step 01: Determine a virtual view based on the network topology. The virtual view includes each topology node and the topology line segment corresponding to each topology node.

[0051] Specifically, the network devices in the current scenario and the connection relationships between each network device can be obtained. For example, the device information in the network can be surveyed and recorded manually, including the IP address, MAC address, device type (such as routers, switches, servers, etc.), device name, connection relationship, etc. Or use network management tools (such as SolarWinds, PRTG, Nagios, Zabbix, etc.) or network scanning tools (such as Nmap, Ping, SNMP tools, etc.) to automatically discover the devices in the network. These tools can obtain the basic information of the devices by scanning the IP address range, sending ICMP requests (Ping), querying SNMP information, etc. At the same time, protocols such as LLDP (Link Layer Discovery Protocol) or CDP (Cisco Discovery Protocol) can be used to automatically discover the connection relationships and neighbor information of the devices in the network. This protocol can help determine the physical connection relationships between the devices. Then, based on the network devices in the current scenario and the connection relationships between each network device, the positions of the topology nodes corresponding to each network device in the topology diagram can be determined, and the positions of each topology line segment in the topology diagram can be determined, so as to determine the virtual view of the current scenario.

[0052] In one embodiment, the node data model tree can be determined based on the network topology and the device information of the current scenario. The node data model tree is a tree-like structure used to represent the node data and its hierarchical relationships in the network. It contains the information of each node in the network, such as node name, attributes, parent node, etc.

[0053] Then, a node view model tree is constructed based on the node data model tree. The node view model tree is a tree-like structure used to represent the node views and their hierarchical relationships in the network. It focuses on showing the content at the view level such as the physical location, connection status, attribute information, etc. of the nodes in the network, rather than the specific data content. For example, first extract the basic information such as the name and attributes of each node from the node data model tree. According to actual needs, map the data information of the nodes to the information at the view level. For example, map the IP address of the node to the physical location, and map the status information of the node to the connection status, etc. Then process the hierarchical relationships, keep the hierarchical relationships between the nodes unchanged, and continue to reflect the relationship between the parent node and the child node in the node view model tree. Then, according to the root node of the network topology (such as the network center node), create the corresponding root node in the node view model tree. Starting from the root node, recursively add child nodes. For each node, find its corresponding position in the node view model tree according to its parent node, and then add the node to the child node list of its parent node. Then, in the node view model tree, display the corresponding view information of each node, such as physical location, connection status, attribute information, etc.

[0054] Next, based on the node view model tree, determine the positions and size information of each topological node and the topological line segments corresponding to each topological node to determine the virtual view. For example, taking the display on the iOS system as an example, the calculation process of the position of each node in the topology graph is shown in the following figure. If the position of node A needs to be calculated, obtain its position relative to the parent node from childViewDict and add the absolute position of the parent node B: ATop = ATop to B + BTop. The absolute position of the parent node B depends on the absolute position of B's parent node. And so on, through the recursive algorithm, the absolute positions of all topological nodes can be known and placed into the TPTopographyView. Then, the corresponding size information can be determined according to the coordinate ranges corresponding to each topological node and topological line segment. Another example, taking the display on the Android system as an example, call the PerfromLayout method in the TreeLayoutManager to calculate the position of each topological node in the virtual topology graph and store it in the map. This position is the coordinate of the topological node relative to the virtual view. At the same time, calculate the start and end positions of the line connecting the child node to the parent node, that is, calculate the topological line segments between each topological node, and the topological line segments are also stored in the map. In the implementation of the specific class, the method for calculating the position and size relationship in the Android system is basically the same as that in the iOS system. The difference is that in the Android system, obtain its position relative to the parent node from nodeToBoxMap, and at the same time get the absolute positions of all topological nodes and place them into the ViewGroup.

[0055] It should be noted that the virtual view is not a real view. In this step, no view is generated. It is only assumed that there is a global network topology graph corresponding to the current scene, that is, the virtual view. This step is mainly used to obtain the coordinates and connection relationships of each topological node in the assumed virtual view, that is, only obtain the coordinate information and connection information of the topological nodes, and no network topology graph is specifically generated.

[0056] Step 02: Determine the target nodes and target topological line segments located in the current display area among the topological nodes and topological line segments of the virtual view.

[0057] Specifically, the current display area corresponds to the display screen. There are multiple ways to associate the virtual view with the current display area. In one embodiment, a display coordinate system corresponding to the display screen can be set. The area corresponding to the display screen in this space is the current display area. It can be understood that the display coordinate system is the initial coordinate system of the current display area. Then, the virtual view is mapped into this display coordinate system. The area within the current display area in the image obtained by mapping the virtual view into this display coordinate system is the displayable area of the virtual view. In another embodiment, a view coordinate system corresponding to the virtual view can also be set. It can be understood that the view coordinate system is the initial coordinate system of the virtual view. Then, the display screen is mapped into this view coordinate system. The mapped area of the display screen is the current display area. The area within the current display area in the virtual view is the displayable area of the virtual view. Therefore, the current display area is the area in the virtual view that can be displayed through the display screen. Of course, the display coordinate system and the view coordinate system can also be set as the same coordinate system, that is, the current display area and the virtual image are initially located in the same coordinate system, thereby reducing the mapping steps.

[0058] In one embodiment, a network topology diagram is stored in the TreeViewContainer of the Android system. The APP displays based on the network topology diagram stored in the TreeViewContainer. Then, the current display area is actually the area where the TreeViewContainer is currently located in the upper display coordinate system. The target node and the target topology line segment are the topology node and the topology line segment that can be displayed in the virtual view. Intuitively, please combine Figure 3 , the overlapping area between the TreeViewContainer and the virtual view is the displayable area in the virtual view.

[0059] The target stage and the target topology line segment within the current display area in the virtual view can be determined according to the relative positions of the current display area and the virtual view, that is, the intersection of the virtual view and the current display area is determined to determine the target node and the target topology line segment that can be displayed in the current display area.

[0060] Step 03: Render the target node and the target topology line segment to display the network topology diagram.

[0061] Specifically, the target node and the target topology line segment can be rendered to generate a node view corresponding to the target node, and each node view is connected by the target topology line segment to generate and display the network topology diagram.

[0062] For example, use the methods provided by the drawing library (such as Android's Canvas.drawCircle) to draw the node view corresponding to the target node according to the position and attributes of the target node. At the same time, use the methods provided by the drawing library (such as Android's Canvas.drawLine) to draw the target topology line segment according to the positions of the child node and the parent node corresponding to the target topology line segment, as well as the attributes of the target topology line segment. After the node views corresponding to the target topology line segment and the target node are both rendered, the generation of the network topology diagram can be completed. Then, the display screen can be controlled to display the generated network topology diagram. For example, the network topology diagram can be generated in the TreeViewContainer, and then the network topology diagram in the TreeViewContainer is displayed on the display screen.

[0063] It should be noted that the target topology line segment may not be a complete line segment connecting two topology nodes. When users view the network topology diagram, they often perform operations such as moving and zooming, so that the target topology line segment corresponding to the current display area may be a part of a certain topology line segment.

[0064] Therefore, the topology nodes and topology line segments that will be displayed in the current display area in the virtual view can be rendered to generate the network topology diagram, and then the network topology diagram can be displayed within the current display area, enabling users to view the network topology diagram corresponding to the current scenario within the current display area. For example, the effect of this application is as Figure 4 shown in the rightmost figure of Figure 4 The rectangular frame in

[0065] is the current display area, and the shadow is the area corresponding to the virtual view. In actual operation, this application only renders the target nodes and target topology line segments within the current display area.

[0066] The method for displaying the network topology according to the embodiments of the present application first determines the topology nodes and corresponding topology line segments corresponding to each device in the current scene in the virtual view, where the virtual view is a hypothetical network topology diagram and not a real-rendered image. At the same time, the display area of the display screen is abstracted as the current display area located in the same space as the virtual view, and then, among the topology nodes and topology line segments of the virtual view, the target nodes and target topology line segments located in the current display area are determined. It can be understood that the target nodes and target topology line segments are the nodes and line segments that can be displayed in the virtual view. Then, the target nodes and target topology line segments are rendered to generate and display the network topology diagram. In this way, the present application only generates and renders the topology nodes and topology line segments that can be displayed in the current display area corresponding to the display screen, without generating the global network topology diagram of the current scene, and the virtual view does not need to be actually generated, so as to greatly reduce the memory occupied by the finally generated network topology diagram, thereby avoiding problems such as memory overflow and unsmooth software operation.

[0067] Please refer to Figure 5 , in some embodiments, step 02: determining the target nodes and target topology line segments located in the current display area among the topology nodes and topology line segments of the virtual view includes:

[0068] Step 021: determining the corresponding coordinates of the virtual view and the current display area in the target coordinate system;

[0069] Step 022: determining the target nodes and target topology line segments located in the current display area according to the target coordinates of the topology nodes and topology line segments in the target coordinate system and the target coordinate range of the current display area in the target coordinate system.

[0070] Specifically, a target coordinate system can be set, and the corresponding coordinates of the virtual view and the current display area are unified onto the target coordinate system, so that the target nodes and target topology line segments located in the current display area in the virtual view can be obtained through coordinate comparison.

[0071] For example, the initial coordinates of the virtual view and the current display area can be set as the coordinates in the same coordinate system. At this time, the target coordinate system is this coordinate system, and no projection operation is required at this time. However, at this time, the initial positions of the virtual view and the current display area need to be set, so that after obtaining the initial coordinates of the topology nodes and topology line segments in the virtual view, the target coordinates of the topology nodes and topology line segments in the target coordinate system can be obtained by combining the initial position and the initial coordinates. The same applies to the current display area.

[0072] Alternatively, a corresponding coordinate system transformation matrix may also be set, and then, through the coordinate system transformation matrix, at least one of the virtual view and the current display area is projected to unify the coordinates corresponding to the virtual view and the current display area onto the target coordinate system. In one embodiment, the target coordinate system may be the display coordinate system corresponding to the above-mentioned display screen. In this case, it is necessary to project the virtual view into the target coordinate system, and the current display area does not need to be projected, but the initial position needs to be preset to facilitate obtaining the target coordinate range. In another embodiment, the target coordinate system is the view coordinate system corresponding to the virtual view. In this case, it is necessary to project the current display area into the target coordinate system, and the virtual view does not need to be projected, but the initial position needs to be preset to facilitate obtaining the target coordinates. In yet another embodiment, the target coordinate system is a third coordinate system other than the display coordinate system and the view coordinate system. In this case, both the virtual view and the current display area need to be projected into the target coordinate system.

[0073] After unifying the virtual view and the current display area to the target coordinate system, the target coordinates of the topological nodes and topological line segments in the virtual view in the target coordinate system can be determined, and the target coordinate range of the current display area in the target coordinate system can be determined. Then, the topological nodes whose target coordinates are within the target coordinate range of the current display area are confirmed as target nodes, and the topological line segments whose target coordinates are within the target coordinate range of the current display area are confirmed as target topological line segments.

[0074] In this way, the virtual view and the current display area can be unified onto the target coordinate system, so that the target nodes and target topological line segments in the virtual view located within the current display area can be accurately determined through coordinate comparison.

[0075] Please refer to Figure 6 , in some embodiments, step 021: determining the coordinates corresponding to the virtual view and the current display area in the target coordinate system includes:

[0076] Step 0211: Based on the input zoom operation and / or move operation, determine the coordinates corresponding to the topological nodes, topological line segments, and / or the current display area in the target coordinate system.

[0077] Specifically, the user can perform a zoom operation and / or a move operation on the display screen to change the display area and display effect of the network topology diagram displayed on the display screen. It can be understood that under the action of the zoom operation and the move operation, the target nodes and target topological line segments that can actually be displayed in the current display area change accordingly.

[0078] First, the zoom operation and / or pan operation input by the user can be obtained. For example, in the Android system, by overriding the onInterceptTouchEvent and onTouchEvent methods in the View class in the TreeView hierarchy, the current gesture type can be detected and judged. When a swipe and / or zoom gesture is detected, the MotionEvent event is intercepted, and the TreeViewContainer is controlled to move and / or zoom the virtual view, so as to change the relative positions of the topological nodes and topological line segments with respect to the current display area. In the iOS system, the zoom function can be implemented by the UIPinchGestureRecognizer added to the UIScrollView, and the UIScrollView is used to obtain the zoom operation and pan operation.

[0079] Then, based on the input zoom operation and / or pan operation, at least one of the virtual view, the current display area, or the coordinate system transformation matrix used in projection is adjusted. Here, adjusting the virtual view means adjusting the size of the virtual view to adjust the corresponding positions and sizes of the topological nodes and topological line segments in the virtual view, so as to adjust the corresponding positions and sizes of the topological nodes and topological line segments in the target coordinate system. Adjusting the current display area means the corresponding position and size of the current display area in the target coordinate system. Adjusting the coordinate system transformation matrix means adjusting the projection relationship to adjust the corresponding position and size of the projected virtual view or current display area in the target coordinate system. In this way, according to the input zoom operation and / or pan operation, the target coordinates of the virtual view in the target coordinate system and / or the target coordinate range of the current display area in the target coordinate system can be adjusted.

[0080] It should be noted that the coordinate system transformation matrix can be the coordinate system transformation matrix when the virtual view is projected onto the target coordinate system. In this case, the coordinate system transformation matrix can be directly adjusted according to the input zoom operation and / or pan operation. The coordinate system transformation matrix can also be the coordinate system transformation matrix when the current display area is projected onto the target coordinate system. However, when adjusting the parameters of the coordinate system transformation matrix according to the input zoom operation and / or pan operation, some processing is required. For example, if the user's input operation is to magnify the picture by 2 times, and at this time the current display area needs to be reduced by 0.5 times, then the actual zoom factor is 0.5 times.

[0081] In this way, it can be ensured that in the target coordinate system, the relative relationship between the virtual view and the current display area can be transformed according to the zoom operation and / or pan operation, so as to change the target nodes and target topological line segments located in the current display area based on the input zoom operation and / or pan operation, and the target nodes and target topological line segments conform to the user's operation.

[0082] Please refer to Figure 7, in some embodiments, parameters that can be adjusted according to scaling operations and moving operations can be set in the coordinate system transformation matrix. For example, the coordinate system transformation matrix includes a scaling factor and a moving distance. Then, based on the input scaling operation, the scaling factor is determined, and based on the moving operation, the moving direction and moving distance are determined, thereby adjusting the coordinate system transformation matrix. In this way, the projection area of the virtual view or the current display area in the target coordinate system can be adjusted.

[0083] In a certain embodiment, the target coordinate system is the display coordinate system corresponding to the current display area. Step 0211: Based on the input scaling operation and / or moving operation, determine the coordinates corresponding to the topological nodes, topological line segments, and / or the current display area in the target coordinate system, including:

[0084] Step 02111: Based on the input scaling operation and / or moving operation, adjust the coordinate system transformation matrix corresponding to the virtual view;

[0085] Step 02112: Based on the coordinate system transformation matrix corresponding to the virtual view, and the initial coordinates of the topological nodes and topological line segments in the virtual view, determine the target coordinates of the topological nodes and topological line segments in the display coordinate system.

[0086] Specifically, the initial coordinates are the coordinates of the topological nodes and topological line segments on the virtual view. The target coordinate system is the display coordinate system corresponding to the current display area. That is to say, at this time, it is necessary to project the virtual view onto the target coordinate system. The coordinate system transformation matrix is the transformation matrix for converting the display coordinate system corresponding to the virtual view to the target coordinate system. At the same time, since the target coordinates of the topological line segments and topological nodes will be adjusted according to the scaling operation and moving operation, the target coordinate range of the current display area can be fixed and does not need to be adjusted, and can be preset in advance.

[0087] A coordinate system transformation matrix that can maintain the mapping relationship when projecting topological nodes and topological line segments based on scaling operations and moving operations can be maintained. For example, the coordinate system transformation matrix Matrix is:

[0088]

[0089] MSCALE_X and MSCALE_X respectively represent the scaling factors on the x-axis and y-axis, MSTRANS_X and MSTRANS_Y respectively represent the distances that the node moves on the x-axis and y-axis, MSKEW_X and MSKEW_Y represent the shearing of the node on the x-axis and y-axis, and MPERSP_0, MPERSP_1, and MPERSP_2 represent the rotation of the node in the three-dimensional direction.

[0090] Initially, the value of Matrix is the identity matrix:

[0091]

[0092] At this time, the mapped image of the virtual view and the position of the current display area are as Figure 3 shown, and the origins of the two coincide. After the moving operation and the zooming operation, the origin coordinates of the mapped image of the virtual view will change, causing the coordinates of the topological nodes and topological line segments to also change. In another embodiment, initially, the origin of the mapped image of the virtual view does not coincide with the origin of the current display area. At this time, it is necessary to record the specific coordinates of the origin of the mapped image of the virtual view and the current display area.

[0093] Then, based on the coordinate system transformation matrix corresponding to the virtual view, the initial coordinates of the topological nodes and topological line segments in the virtual view, the target coordinates of the topological nodes and topological line segments in the display coordinate system are determined. That is, through the coordinate system transformation matrix, the coordinates (x0, y0) corresponding to each topological node and topological line segment in the virtual view can be coordinate-transformed to obtain the target coordinates (x1, y1) that conform to the moving operation and the zooming operation:

[0094]

[0095] For example, the sliding and zooming events are judged by the TreeView layer, and the zooming or moving values are passed to the TreeViewContainer through the ScaleListener and MoveListener for refreshing the value of the Matrix. If the virtual view is moved to the right by a distance dx and zoomed to 0.9 of the original, the new Matrix is:

[0096]

[0097] In this way, the coordinate system transformation matrix can be accurately adjusted according to the input zooming operation and / or moving operation, so that the target coordinates of the transformed virtual view meet the user's moving operation and zooming operation, ensuring that the network topology diagram displayed in the current display area subsequently matches the user's moving operation and zooming operation.

[0098] In another embodiment, a coordinate system transformation matrix that can maintain the mapping relationship when projecting the current display area based on the zooming operation and the moving operation can also be maintained. The method is similar to the above and will not be elaborated here.

[0099] Please refer to Figure 8 , in some embodiments, step 0211: Based on the input zooming operation and / or moving operation, determine the coordinates corresponding to the topological nodes, topological line segments, and / or the current display area in the target coordinate system, including:

[0100] Step 02113: Based on the zooming ratio corresponding to the zooming operation, determine the target spacing and the target view size in the virtual view;

[0101] Step 02114: Regenerate the virtual view based on the target spacing, the target view size, and the hierarchical relationship between each topological node to complete the adjustment of the virtual view;

[0102] Step 02115: Determine the coordinates corresponding to the topological line segments and topological nodes in the target coordinate system according to the adjusted virtual view.

[0103] Specifically, the standard spacing between each topological node in the virtual view and the standard view sizes corresponding to each topological node and topological line segment are preset. At this time, the target spacing and the target view size in the virtual view can be determined based on the scaling ratio corresponding to the scaling operation and the current ratio of the virtual view. The standard spacing and the standard view size correspond to a standard ratio, for example, the standard ratio is 1.

[0104] Then, obtain the scaling ratio corresponding to the scaling operation, determine the current multiple relationship between the scaling ratio and the standard ratio, and multiply the current multiple relationship by the standard spacing and the standard view size to obtain the target spacing and the target view size. For example, if the scaling ratio is 0.5 times, then the target spacing is 0.5 * standard spacing, and the target view size is 0.5 * standard view size.

[0105] Next, based on the target spacing, the target view size, and the hierarchical relationship between each topological node (which can be obtained according to the above node data model tree or node view model tree), regenerate the virtual view, that is, re-determine the coordinates and size information of the topological nodes and topological line segments after the scaling operation.

[0106] Finally, determine the coordinates corresponding to the topological line segments and topological nodes in the target coordinate system according to the adjusted virtual view. If the target coordinate system belongs to the view coordinate system, there is no need to perform a projection operation on the virtual view. According to the position of the virtual view in the view coordinate system (this position can be fixed and preset in advance, for example, the lower left corner of the virtual view is just located at the origin of the view coordinate system), and the coordinates of the topological nodes and topological line segments in the regenerated virtual view, determine the target coordinates of the topological nodes and topological line segments in the target coordinate system. If the target coordinate system belongs to the display coordinate system, projection needs to be performed based on the coordinate system transformation matrix and the regenerated virtual view. It can be understood that the target coordinates of the projected topological nodes and topological line segments in the target coordinate system match the scaling operation.

[0107] It can be understood that the coordinates of the topological nodes and topological line segments of the virtual view can be adjusted according to the scaling operation in the view coordinate system, so that the target coordinates of the subsequent topological nodes and topological line segments in the target coordinate system can also be adaptively adjusted according to the scaling operation.

[0108] For example, the zoom function of the iOS system is implemented by the UIPinchGestureRecognizer added to the UIScrollView. When zooming occurs, the current zoom scale (i.e., the zoom ratio) is updated in real time to the TPTolopogyLayout, and the logical size of the entire topology map and the size and position information of all nodes are refreshed, and then the views within the current display area are updated.

[0109] In this way, it can be ensured that the virtual view itself changes based on the zoom operation, so that the topology nodes and topology line segments in the target coordinate system can both change based on the zoom operation.

[0110] Please refer to Figure 9 , in some embodiments, step 0211: Based on the input zoom operation and / or movement operation, determine the coordinates corresponding to the topology nodes, topology line segments, and / or the current display area in the target coordinate system, including:

[0111] Step 02116: According to the movement direction and movement distance of the movement operation, and the current target coordinate range of the current display area in the target coordinate system, adjust the target coordinate range of the current display area in the target coordinate system.

[0112] Specifically, according to the movement direction and movement distance of the movement operation, and the current coordinate range of the current display area in the target coordinate system, adjust the coordinate range of the current display area in the target coordinate system. For example, determine the adjustment direction of the coordinate range according to the movement direction, and determine the adjustment distance of the coordinate range according to the movement distance, so as to complete the adjustment of the coordinate range of the current display area in the target coordinate system.

[0113] In this way, after adjusting the coordinate range of the current display area in the target coordinate system, it can be ensured that the target coordinate range matches the user's movement operation.

[0114] It should be noted that in the iOS system, topological zooming can be achieved by directly returning the topological view in the delegate method viewForZooming(inscrollView:UIScrollView)->UIView? of the UIScrollView. That is to say, in the iOS system, only the zoom ratio needs to be obtained to update the virtual view. Therefore, the above method of updating the virtual view and the current display area itself (i.e., steps 02113 - step 02116) is more applicable to the iOS system. While the Android system does not have this function, so the above method of updating the coordinate system transformation matrix (i.e., steps 02111 - step 02112) is more applicable to the Android system.

[0115] Please refer to Figure 10, in some embodiments, step 03: Render the target nodes and target topological line segments to display the network topology diagram, including:

[0116] Step 031: Render the target nodes based on a preset view generation component to obtain node views corresponding to each target node;

[0117] Step 032: Render the target topological line segments based on a preset algorithm and the corresponding target nodes to generate and display the network topology diagram.

[0118] Specifically, a preset view generation component can be preset. For example, the target nodes can be rendered according to an adapter. At this time, the adapter pattern is used to wrap the generation of the node views of the target nodes into an abstract class TreeViewAdapter. By inheriting and implementing the abstract class, rich custom node views can be achieved. Click events can also be added in the Adapter, and multiple different click events can be responded to in each node.

[0119] Then, the target topological line segments can be rendered based on a preset algorithm and the corresponding target nodes. For example, at this time, a basic BaseLine can be used to draw a straight line. By inheriting this class, various styles of line drawing can be achieved. At the same time, different types of lines, including dotted lines, straight lines, curves, etc., can be drawn according to the specific data carried in the ViewHolder. Or, the target topological line segments can be drawn in a CAShapeLayer through UIBezierPath. The drawing of the line styles is the same as the original solution, and the color, type, etc. of the lines can be customized. At the same time, the target topological line segments are rendered based on the corresponding target nodes. For example, topological line segments are drawn from the corresponding target nodes so that the target topological line segments are connected to their corresponding target nodes to achieve the rendering of the target topological line segments.

[0120] In this way, after rendering the views corresponding to the target nodes and the target topological line segments, the network topology diagram can be generated, and then the network topology diagram can be displayed on the display screen.

[0121] Please refer to Figure 11 , in some embodiments, the preset view generation component includes a preset cache pool for storing multiple view objects. Step 031: Render the target nodes based on the preset view generation component to obtain node views corresponding to each target node, including:

[0122] Step 0311: Determine the parameters of the target view object in the preset cache pool based on the selected target node to generate a node view corresponding to the selected target node. The selected target node is any target node, and the target view object is any view object in the preset cache pool;

[0123] In step 02, determining the topological nodes and topological segments of the virtual view that are located before the target node and the target topological segment in the current display area, the method further includes:

[0124] Step 04: When receiving the view update instruction, delete the current network topology map and put the view object corresponding to the current network topology map into the preset cache pool for standby use.

[0125] Specifically, the View object is the basic element of the user interface. Each View object is responsible for drawing and event processing within its rectangular area. The node view of a topological node is generated by a View object. Frequent destruction and creation of View objects is very performance-consuming, and node reuse is required.

[0126] Therefore, a preset cache pool (NodeViewPool in Android system and reusedNodeViewArray in iOS system) can be maintained to store multiple idle view objects. When generating node views, the view objects in the preset cache pool are preferentially selected for generation. At this time, the parameters of the target view object in the preset cache pool can be determined based on the selected target node to generate the node view corresponding to the selected target node. The selected target node is any target node, and the target view object is any view object in the preset cache pool. That is, the corresponding view object is selected for each target node, and the parameters of the view object are modified accordingly.

[0127] Then, based on the node views and target topology segments corresponding to each target node, a network topology diagram is generated and displayed. For example, all node views are placed at the positions of their corresponding target nodes in the current display area, and the corresponding node views are connected using the target topology segments to generate a network topology diagram, and the generated network topology diagram can also be displayed in the current display area.

[0128] The triggering condition of the view update instruction can be set according to the view update requirement. For example, in one embodiment, the triggering condition of the view update instruction is that the coordinates corresponding to the topological node change. That is, when the coordinates corresponding to the topological node in the virtual view change, it can be considered that the view needs to be updated at this time, so the view update instruction can be received. Therefore, in fact, each change in the coordinates will trigger the view update. It can be understood that multiple coordinate updates may be triggered in one movement operation, so multiple view updates will also be triggered in one movement operation. In this way, the view can be updated frequently to ensure that the presented network topology diagram can meet the needs of the user.

[0129] Upon receiving an update view instruction, the view object corresponding to the current network topology diagram is placed in a preset cache pool for later use, the current network topology diagram is deleted, and then step 02 is entered, that is, the target node and the target topology line segment are determined, and a network topology diagram is generated. That is to say, the view objects in the preset cache pool can be continuously reused to generate node views. When the view needs to be updated, all view objects are recycled into the preset cache pool, and then a network topology diagram is generated based on the re-determined target node and target topology line segment.

[0130] In this way, the view objects in the preset cache pool can be reused to generate node views, avoiding frequent destruction and creation of view objects, thereby saving energy consumption.

[0131] Please refer to Figure 12 , in some embodiments, before step 0311: determining the parameters of the target view object in the preset cache pool based on the selected target node to generate a node view corresponding to the selected target node, step 03: rendering the target node and the target topology line segment to display the network topology diagram, further includes:

[0132] Step 033: When the number of target nodes is not greater than the number of view objects in the preset cache pool, determine the target view objects among the view objects in the preset cache pool according to the number of target nodes;

[0133] Step 034: When the number of target nodes is greater than the number of view objects in the preset cache pool, determine all view objects as target view objects, and generate node views of the remaining nodes based on a preset adapter, where the remaining nodes are the nodes among the target nodes that do not have corresponding target view objects.

[0134] Specifically, when the number of target nodes is not greater than the number of view objects in the preset cache pool, that is, when the number of target nodes is less than or equal to the number of view objects in the preset cache pool, the target view objects are determined among the view objects in the preset cache pool according to the number of target nodes, so that the number of target view objects is the same as the number of target nodes, thereby ensuring that each target node has a corresponding target view object.

[0135] When the number of target nodes is greater than the number of view objects in the preset cache pool, all view objects are determined as target view objects. Then, each view object is assigned its corresponding target node to generate a node view of the corresponding target node using the view object.

[0136] A node without a corresponding target view object in the target nodes is called a remaining node. At this time, a node view of the remaining node can be generated based on a preset adapter. For example, in the Android system, a node view of the remaining node can be generated through a TreeViewAdapter, and at the same time, the node view of the remaining node is stored in a TreeViewContainer. Another example is that in the iOS system, a new view can be generated through a TPTopologyViewDelegate proxy and added to a UIScrollView.

[0137] That is to say, when there are idle view objects in the preset cache pool, the view objects in it are preferentially taken out for reuse, and at the same time, the data in the view objects is refreshed to ensure that the corresponding node views can be accurately generated. When there are no available view objects in the preset cache pool, a node view can be generated using a preset adapter.

[0138] In this way, on the one hand, energy consumption can be saved by reusing view objects, and on the other hand, a node view of a target node without a corresponding view object can be generated using a preset adapter, so as to ensure that all node views corresponding to the target nodes within the current display area can be displayed in the network topology diagram.

[0139] Please refer to Figure 13 , in some embodiments, the target topology line segment includes a bus bar and a sub-line. Step 032: Render the target topology line segment based on a preset algorithm and the corresponding target nodes, including:

[0140] Step 0321: Determine the parent node and child nodes in the target nodes;

[0141] Step 0322: Draw out the bus bar from the node view of the parent node;

[0142] Step 0323: Draw out the sub-line from the node view of the child node and connect the sub-line to the bus bar of the corresponding parent node to connect each node view.

[0143] Specifically, during the actual verification of large-scale data, it is found that when the number of child nodes of a certain node is too large, especially when the connection lines of the child nodes need to be drawn with dotted lines, the entire topology diagram will experience severe jamming and cannot be smoothly scrolled and zoomed. As Figure 14 shown, each child node needs to be connected to the parent node, and the scale of the lines that need to be drawn in real time will be very large. Frequent calls to Canvas for drawing encounter performance limitations, or adding too many UIBezierPaths to CAShapeLayer for drawing encounter performance limitations. When these lines are dotted lines, the jamming will be even more serious. The reason is that the amount of calculation required for drawing dotted lines is much greater than that for solid lines. For this problem, optimization processing is required.

[0144] First, it can be determined according to the parent nodes and child nodes in the target nodes, specifically according to the connection relationships between the respective target nodes. Then, from the node view corresponding to the parent node, a bus bar is led towards its corresponding child node. Then, from the node view corresponding to the child node, a sub-line is led towards its corresponding parent node, and the sub-line is connected to the target of its corresponding parent node. In this way, the rendering of the target topological line segment can be completed, connecting each node view and generating a network topology diagram. The result is as Figure 15 , it can be found that compared with Figure 14 , Figure 15 , the number of line segments is much less.

[0145] It should be noted that the current display area can be moved freely according to user operations. Therefore, the current display area may only contain a part of a certain target topological line segment. For example, a certain target node has a corresponding child node, but its child node does not belong to the target node, that is, it is not within the current display area. At this time, it is necessary to check whether the bus bar and sub-line corresponding to the target node are within the current display area, and only render the part of the bus bar and sub-line corresponding to the target node that is within the current display area, so as to ensure a relatively high accuracy of the network topology diagram displayed in the current display area.

[0146] In this way, the connection method between the parent node and the child node can be changed to reduce the number of line segments in the network topology diagram, thereby greatly improving the lag problem, and it can also run smoothly on mobile phones with ordinary performance.

[0147] In addition, in some embodiments, the form of the target topological line segment can also be changed. For example, the rendering format of the target topological line segment is in the form of a quarter circle plus a straight line. That is, the commonly used Bezier curve of the topological line segment is modified to the form of 1 / 4 circle + straight line to simplify the drawing process of the target topological line segment, thereby reducing the amount of calculation and being beneficial to improving the lag problem.

[0148] In some other embodiments, the minimum zoom ratio of the zoom operation can also be restricted to a preset zoom ratio, so that the number of target nodes is less than a preset number threshold. Among them, the preset number threshold is the maximum value of the number of target nodes that can be displayed in the current display area when the performance of the APP is relatively good. Once the number of target nodes is greater than the preset number threshold, there is a high probability that the APP will run smoothly. In some embodiments, the preset zoom ratio is 0.25. It can be understood that after restricting the minimum zoom ratio, the number of target topological line segments and target nodes located in the current display area can be restricted, which is beneficial to reducing the amount of calculation and improving the lag problem.

[0149] Please refer to Figure 16, in some embodiments, before the target nodes and target topological line segments located in the current display area in step 02: determining the topological nodes and topological line segments of the virtual view, the display method further includes:

[0150] Step 05: When receiving an update view instruction, delete the current network topology diagram.

[0151] Specifically, the update view instruction can control the update of the network topology diagram. At this time, the trigger condition of the update view instruction can be set as needed. For example, the trigger condition of the update view instruction is that the coordinates corresponding to the topological nodes change. After triggering and receiving the update view instruction, the current network topology diagram can be deleted first. Then enter step 02, re-determine the target nodes and target topological line segments based on the current display area, and re-generate the network topology diagram.

[0152] In this way, it can be ensured that the network topology diagram can be updated in a timely manner, so that the network topology diagram seen by the user can match the user's operations.

[0153] Please refer to Figure 17 , in some embodiments, the display method further includes:

[0154] Step 06: Determine the size of the virtual view based on the hierarchical relationship between each topological node and the topological line segments corresponding to each topological node.

[0155] Specifically, first, based on the hierarchical relationship between the topological nodes, the parent nodes and child nodes between the topological nodes can be determined, and then the view sizes corresponding to the parent nodes and child nodes, and the sizes of the topological line segments between the parent nodes and child nodes can be obtained, so as to determine the size of the virtual view.

[0156] In one embodiment, the CalculateMapSize method can be used to call PerfromMeasure in TreeLayoutManager to calculate the size of the entire topological diagram. The TreeLayoutManager is an abstract class, and the basic measurement method performMeasure() is set in the abstract class. By inheriting and implementing this method, algorithms in various different ways can be realized. PerfromMeasure mainly traverses each node in depth, and obtains the size of each node and the size of the entire topological diagram through the hierarchical relationship.

[0157] For example, two sets, parentsStack and childrenSet, can be set, which store non-leaf nodes (with child nodes) and leaf nodes (without child nodes) respectively. The parentsStack stores in an orderly manner. Through the depth traversal method, while measuring the size of each node, the nodes are put into these two sets. After the measurement is completed, the size of the entire topological diagram is calculated.

[0158] like Figure 18 As shown, to calculate the height of the entire topological graph, it is necessary to calculate the height of each node of the first-level child node, and the sum of the heights plus the distance between nodes is the height of the entire graph. Figure 18 The first-level child node (called A) has child nodes behind it, so the entire height is the sum of the heights of all direct child nodes of A. Similarly, by calculating the height of each node in parentsStack in turn, the height of the entire topology can be calculated. Similarly, if you want to calculate the width of the topology, you need to calculate the width of each node of the first-level child node, and the maximum value + root node + gap distance is the width of the entire topology.

[0159] In this way, the size of the virtual view can be accurately determined based on the hierarchical relationship between each topological node and the topological line segment corresponding to each topological node, thereby facilitating the management of the virtual view.

[0160] In summary, the specific implementation process of the display method of the present application on the Android system can be as follows: Figure 19 shown.

[0161] Activity is the display page, and Treeview can be used to receive touch gestures, that is, accept scaling and moving operations, and update the coordinate system transformation matrix Matrix according to the scaling and moving operations. Then, TreeViewcontainer calls the corresponding algorithm to calculate the size of the virtual view (corresponding to calculateMapSize in the figure), and calculates the corresponding coordinates of each topological node and topological segment in the virtual view (corresponding to calculateNodePosition in the figure). Among them, the abstract class called is the TreeLayoutManager abstract class, which covers a variety of algorithms. The specific algorithm is the algorithm with a plus sign in the box diagram of TreeLayoutManager in the figure. The algorithm derived from the TreeLayoutManager abstract class is the specific algorithm used, that is, BoxRightTreeLayoutManager is the specific algorithm used.

[0162] Then, the TreeViewcontainer uses the Matrix to determine the target coordinates of each topological node and topological line segment (corresponding to updateTreeNodeinView and onDraw in the figure), and determines the target topological nodes and target topological line segments located in the current display area among each topological node and topological line segment according to the target coordinates. Then, it renders the target topological nodes and target topological line segments to generate node views and their corresponding target topological line segments, thereby generating a network topology diagram. When rendering the target topological line segments, the BaseLine abstract class can be called and the corresponding algorithms inside can be used.

[0163] When rendering the node view corresponding to the target topological node, the view object in the preset cache pool NodeViewPool can be preferentially used to generate the node view (corresponding to obtainNodeViewFromPool in the figure). If there is an idle view object in the preset cache pool, the view object is directly used to generate the node view. If there is no idle view object in the preset cache pool, the TreeViewAdapter is called to generate the node view. Among them, the TreeViewAdapter is also an abstract class, and the algorithms it covers are as shown in the figure, and the DevicetopologyTreeViewAdapter can be called to generate a new view.

[0164] After testing, the topology diagram drawn by this application can run smoothly on the device, and the sliding and zooming functions are normal. 3000 devices can be loaded at one time and displayed normally, and there is theoretically no limit on the number of nodes, which greatly improves the running fluency under a large number of nodes. The click-expand and click-collapse functions are normal. It is superior to the existing solutions in the case of a large number of nodes.

[0165] In summary, the specific implementation process of the display method of this application on the iOS system can be as Figure 20 shown.

[0166] First, request the network topology data, that is, obtain the network devices in the current scenario and the connection relationships between each network device. Then, update the number of nodes and the layout of the connections, that is, update the node view model tree. At the same time, summarize the connections between all node views on a Layer and update the connection view. In this way, the basic information of the node view and the connection view can be saved. Then, use a proxy function (that is, a function that can obtain the target node) to obtain the node view, that is, obtain the target node. Next, draw the node view and the connection view on the TPTopologyView, that is, render the target node and the target topology segment on the TPTopologyView. Finally, all views on the TPTopologyView can be drawn, that is, draw all target nodes and target topology segments, so that only the target nodes and target topology segments located within the current display area can be rendered. The reuse mechanism therein is the reuse of the above view objects. The block diagram on the right side of each step is the class and protocol for the specific implementation of this step. The click event is a basic function provided by the iOS UIScrollView. This application is actually an improvement based on the iOS UIScrollView, so this application can also implement the click event.

[0167] The final effect diagram is as Figure 4 shown. After testing and verification, the topology diagram can run smoothly on the device, and the sliding and zooming functions are normal. Loading 3000 devices and 5000 Clients at one time are all displayed normally, and there is theoretically no limit to the number of nodes. The click to expand and contract functions are normal, and the device details page can be jumped to by clicking on the node.

[0168] Please refer to Figure 21 , to facilitate the better implementation of the network topology display method of the embodiment of the present application, the embodiment of the present application also provides a network topology display device 10. The network topology display device 10 may include a first determination module 11, a second determination module 12, and a rendering module 13. The first determination module 11 is used to determine a virtual view based on the network topology, and the virtual view includes each topology node and the topology segment corresponding to each topology node. The second determination module 12 is used to determine the target nodes and target topology segments located in the current display area among the topology nodes and topology segments of the virtual view. The rendering module 13 is used to render the target nodes and target topology segments to display the network topology diagram.

[0169] Specifically, the second determination module 12 is used to determine the coordinates corresponding to the virtual view and the current display area in the target coordinate system; according to the target coordinates of the topology nodes and topology segments in the target coordinate system and the target coordinate range of the current display area in the target coordinate system, determine the target nodes and target topology segments located in the current display area.

[0170] The second determination module 12 is specifically configured to determine the coordinates corresponding to the topological nodes, topological line segments, and / or the current display area in the target coordinate system based on the input zoom operation and / or movement operation.

[0171] The second determination module 12 is specifically configured to adjust the coordinate transformation matrix corresponding to the virtual view based on the input zoom operation and / or movement operation; and determine the target coordinates of the topological nodes and topological line segments in the display coordinate system based on the coordinate transformation matrix corresponding to the virtual view, the initial coordinates of the topological nodes and topological line segments in the virtual view.

[0172] The second determination module 12 is specifically configured to determine the target spacing and target view size in the virtual view based on the zoom ratio corresponding to the zoom operation; regenerate the virtual view based on the target spacing, target view size, and the hierarchical relationship between each topological node to complete the adjustment of the virtual view; and determine the coordinates corresponding to the topological line segments and topological nodes in the target coordinate system according to the adjusted virtual view.

[0173] The second determination module 12 is specifically configured to adjust the target coordinate range of the current display area in the target coordinate system according to the moving direction and moving distance of the movement operation, and the current target coordinate range of the current display area in the target coordinate system.

[0174] The rendering module 13 is specifically configured to render the target nodes based on the preset view generation components to obtain the node views corresponding to each target node; and render the target topological line segments based on the preset algorithm and the corresponding target nodes to generate and display the network topology diagram.

[0175] The rendering module 13 is specifically configured to determine the parameters of the target view object in the preset cache pool based on the selected target node to generate the node view corresponding to the selected target node, where the selected target node is any target node, and the target view object is any view object in the preset cache pool.

[0176] The display device 10 of the network topology further includes a multiplexing module 14, and the multiplexing module 14 is configured to, when receiving an update view instruction, delete the current network topology diagram and put the view object corresponding to the current network topology diagram into the preset cache pool for later use.

[0177] The rendering module 13 is specifically configured to, when the number of target nodes is not greater than the number of view objects in the preset cache pool, determine the target view object among the view objects in the preset cache pool according to the number of target nodes; and when the number of target nodes is greater than the number of view objects in the preset cache pool, determine all view objects as target view objects, and generate the node views of the remaining nodes based on the preset adapter, where the remaining nodes are the nodes among the target nodes that do not have corresponding target view objects.

[0178] The rendering module 13 is specifically configured to determine the parent node and child nodes in the target node; draw a bus bar from the node view of the parent node; draw a sub-line from the node view of the child node, and connect the sub-line to the bus bar of the corresponding parent node to connect the respective node views.

[0179] The network topology display device 10 further includes a deletion module 15, and the deletion module 15 is configured to delete the current network topology diagram when receiving an update view instruction.

[0180] The network topology display device 10 further includes a calculation module 16, and the calculation module 16 is configured to determine the size of the virtual view based on the hierarchical relationship between the respective topology nodes and the topology line segments corresponding to the respective topology nodes.

[0181] The first determination module 11 is specifically configured to determine a node data model tree based on the network topology and the device information of the current scene; construct a node view model tree based on the node data model tree; determine the position and size information of each topology node and the topology line segment corresponding to each topology node based on the node view model tree to determine the virtual view.

[0182] In the above, the network topology display device 10 has been described from the perspective of functional modules in combination with the accompanying drawings. These functional modules can be implemented in hardware form, can also be implemented by instructions in software form, or can be implemented by a combination of hardware and software modules. Specifically, the steps of the method embodiments in this application can be completed by the integrated logic circuit in the hardware in the processor and / or instructions in software form. The steps of the method disclosed in combination with the embodiments of this application can be directly embodied as being executed and completed by a hardware-encoded processor, or can be executed and completed by a combination of the hardware and software modules in the encoded processor. Optionally, the software module can be located in a mature storage medium in the art such as a random access memory, a flash memory, a read-only memory, a programmable read-only memory, an electrically erasable programmable memory, a register, etc. This storage medium is located in the memory, and the processor reads the information in the memory and combines its hardware to complete the steps in the above method embodiments.

[0183] Please refer to Figure 22 , the electronic device 100 of the embodiment of this application includes a processor 20, a memory 30, and a computer program. Among them, the computer program is stored in the memory 30 and is executed by the processor 20. The computer program includes instructions for executing the network topology display method of any of the above embodiments. Among them, the electronic device 100 can be the above-mentioned mobile terminal.

[0184] Please refer to Figure 23, Embodiments of the present application also provide a computer-readable storage medium 200, on which a computer program 210 is stored. When the computer program 210 is executed by a processor 220, the steps of the method for displaying a network topology according to any of the above embodiments are implemented. For the sake of brevity, details are not repeated here.

[0185] Please refer to Figure 24 , Embodiments of the present application also provide a computer program product 300, on which a computer program 310 is stored. The computer program 310 includes instructions for executing the method for displaying a network topology according to any of the above embodiments. For the sake of brevity, details are not repeated here.

[0186] In the description of this specification, the descriptions with reference to terms such as "certain embodiments", "in an example", "exemplarily", etc. mean that the specific features, structures, materials or characteristics described in connection with the embodiments or examples are included in at least one embodiment or example of the present application. In this specification, the schematic representations of the above terms do not necessarily refer to the same embodiments or examples. Moreover, the specific features, structures, materials or characteristics described may be combined in a suitable manner in any one or more embodiments or examples. In addition, without contradiction, those skilled in the art can combine and combine the different embodiments or examples described in this specification and the features of the different embodiments or examples.

[0187] Any process or method description shown in the flowchart or described in other ways herein can be understood as representing a module, segment or portion of code including one or more executable instructions for implementing a specific logical function or process. The scope of the preferred embodiments of the present application includes additional implementations, where the functions may be executed in a substantially simultaneous manner or in an order opposite to that shown or discussed, according to the functions involved, which should be understood by those skilled in the technical field of the embodiments of the present application.

[0188] Although the embodiments of the present application have been shown and described above, it can be understood that the above embodiments are exemplary and should not be construed as limiting the present application. Those of ordinary skill in the art can make changes, modifications, substitutions and variations to the above embodiments within the scope of the present application.

Claims

1. A method for displaying a network topology, characterized in that, Including: Determine a virtual view based on the network topology, where the virtual view includes each topology node and the topology line segments corresponding to each topology node; Determine the target nodes and target topology line segments located in the current display area among the topology nodes and topology line segments of the virtual view; Render the target nodes and target topology line segments to display the network topology diagram.

2. The display method according to claim 1, wherein The determining the target nodes and target topology line segments located in the current display area among the topology nodes and topology line segments of the virtual view includes: Determine the coordinates corresponding to the virtual view and the current display area in the target coordinate system; Based on the target coordinates of the topology nodes and topology line segments in the target coordinate system and the target coordinate range of the current display area in the target coordinate system, determine the target nodes and target topology line segments located in the current display area.

3. The display method according to claim 2, wherein The determining the coordinates corresponding to the virtual view and the current display area in the target coordinate system includes: Based on the input zoom operation and / or pan operation, determine the coordinates corresponding to the topology nodes, the topology line segments, and / or the current display area in the target coordinate system.

4. The display method according to claim 3, characterized in that The target coordinate system is the display coordinate system corresponding to the current display area. The based on the input zoom operation and / or pan operation, determining the coordinates corresponding to the topology nodes, the topology line segments, and / or the current display area in the target coordinate system includes: Based on the input zoom operation and / or pan operation, adjust the coordinate transformation matrix corresponding to the virtual view; Based on the coordinate transformation matrix corresponding to the virtual view, the initial coordinates of the topology nodes and topology line segments in the virtual view, determine the target coordinates of the topology nodes and topology line segments in the display coordinate system.

5. The display method according to claim 3, wherein The determining the coordinates corresponding to the virtual view and the current display area in the target coordinate system includes: Based on the zoom ratio corresponding to the zoom operation, determine the target spacing and target view size in the virtual view; Based on the target spacing, the target view size, and the hierarchical relationship between each topology node, regenerate the virtual view to complete the adjustment of the virtual view; According to the adjusted virtual view, determine the coordinates corresponding to the topology line segments and topology nodes in the target coordinate system.

6. The display method according to claim 3 or 5, characterized in that, The based on the input zoom operation and / or pan operation, determining the coordinates corresponding to the topology nodes, the topology line segments, and / or the current display area in the target coordinate system includes: According to the moving direction and moving distance of the pan operation and the current target coordinate range of the current display area in the target coordinate system, adjust the target coordinate range of the current display area in the target coordinate system.

7. The display method according to claim 1, wherein The rendering the target nodes and target topology line segments to display the network topology diagram includes: Based on a preset view generation component, render the target nodes to obtain the node views corresponding to each target node; Based on a preset algorithm and the corresponding target nodes, render the target topology line segments to generate and display the network topology diagram.

8. The display method according to claim 7, wherein The preset view generation component includes a preset cache pool for storing multiple view objects. Rendering the target nodes based on the preset view generation component to obtain the node views corresponding to each of the target nodes includes: Determining the parameters of the target view object in the preset cache pool based on the selected target node to generate the node view corresponding to the selected target node, where the selected target node is any one of the target nodes, and the target view object is any one of the view objects in the preset cache pool; Before the target nodes and target topological line segments located in the current display area among the topological nodes and topological line segments of the virtual view are determined, the method further includes: When a view update instruction is received, deleting the current network topology graph and putting the view object corresponding to the current network topology graph into the preset cache pool for later use.

9. The display method according to claim 8, characterized in that Before determining the parameters of the target view object in the preset cache pool based on the selected target node to generate the node view corresponding to the selected target node, rendering the target nodes and target topological line segments to display the network topology graph includes: When the number of the target nodes is not greater than the number of view objects in the preset cache pool, determining the target view objects among the view objects in the preset cache pool according to the number of the target nodes; When the number of the target nodes is greater than the number of view objects in the preset cache pool, determining all the view objects as the target view objects and generating the node views of the remaining nodes based on a preset adapter, where the remaining nodes are the nodes among the target nodes that do not have corresponding target view objects.

10. The display method of the network topology according to claim 7, wherein The target topological line segment includes a bus bar and sub-lines. Rendering the target topological line segment based on a preset algorithm and the corresponding target nodes includes: Determining the parent node and child nodes among the target nodes; Drawing out the bus bar from the node view of the parent node; Drawing out the sub-lines from the node views of the child nodes and connecting the sub-lines to the bus bar of the corresponding parent node to connect each of the node views.

11. The display method according to claim 1, wherein The rendering format of the target topological line segment is in the form of a quarter circle plus a straight line.

12. The display method according to claim 3, wherein The minimum zoom ratio of the zoom operation is a preset zoom ratio so that the number of the target nodes is less than a preset number threshold.

13. The display method according to claim 1, wherein Before the target nodes and target topological line segments located in the current display area among the topological nodes and topological line segments of the virtual view are determined, the method further includes: When a view update instruction is received, deleting the current network topology graph.

14. The display method according to claim 13, characterized in that, The trigger condition of the view update instruction is that the coordinates corresponding to the topological nodes change.

15. The display method according to claim 1, wherein Further included is: Determining the size of the virtual view based on the hierarchical relationship among the topological nodes and the topological line segments corresponding to each of the topological nodes.

16. The display method according to claim 1, wherein Determining the virtual view based on the network topology includes: Determining the node data model tree based on the network topology and the device information of the current scene; Constructing the node view model tree based on the node data model tree; Determining the position and size information of each topological node and the topological line segment corresponding to each topological node based on the node view model tree to determine the virtual view.

17. The display method according to claim 1, wherein Applied to a mobile terminal.

18. The display method according to claim 17, wherein The operating system of the mobile terminal includes the Android system or the iOS system.

19. A display device for a network topology, characterized in that, Comprising: A first determination module, configured to determine a virtual view based on a network topology, the virtual view including each topological node and the topological line segments corresponding to each topological node; A second determination module, configured to determine, among the topological nodes and topological line segments of the virtual view, the target nodes and target topological line segments located in the current display area; A rendering module, configured to render the target nodes and target topological line segments to display a network topology diagram.

20. An electronic device, characterized in that, Comprising: A processor, a memory; And A computer program, wherein the computer program is stored in the memory and executed by the processor, and the computer program includes instructions for executing the display method of the network topology according to any one of claims 1 to 18.

21. A non-volatile computer-readable storage medium comprising a computer program, characterized in that, When the computer program is executed by the processor, the processor is caused to execute the display method of the network topology according to any one of claims 1-18.

22. A computer program product, characterized in that, Including a computer program, the computer program including instructions for executing the display method of the network topology according to any one of claims 1-18.

Images