A method and system for automatic layout of flowcharts based on web terminals

Abstract

The present invention proposes a method and system for automatic layout of flowcharts based on a web terminal, including: obtaining the coordinates and related parameters of each node of the web terminal flowchart, outputting the horizontal coordinate and vertical coordinate of each node after the Y-axis symmetrical layout; after performing Y-axis symmetrical layout on any flowchart, counting the number of intersections of the lines in the current flowchart, recording it as the first value, entering a conditional loop, recording the current node sorting, re-arranging the order of the current nodes through a neighborhood weight heuristic algorithm, re-laying out the symmetrical layout according to the Y axis, counting the number of node line intersections again and setting it as the first value, and entering the next loop; based on the horizontal coordinate and vertical coordinate after the Y-axis symmetrical layout, drawing the flowchart in the rendering layer. After the layout, the logical relationship between each business line and each node is clearer, which is convenient for business developers to understand the business relationship between departments and improve the data sharing quality of data between departments.

Description

Technical Field

[0001] The present invention belongs to the field of computer processing technology, and in particular, relates to a method and system for automatically laying out flowcharts based on a web terminal. Background Art

[0002] The statements in this section merely provide background information related to the present invention and do not necessarily constitute prior art.

[0003] The overall construction of government informationization has entered a new stage of intelligent governance characterized by data empowerment, collaborative governance, smart decision-making, and high-quality services, and has put forward new demands on the government data governance platform, including: centralized construction of a unified national government exchange platform, on-demand expansion of basic data field items, and enhanced diversified data collection and thematic data aggregation capabilities.

[0004] In order to meet current requirements, the government data governance platform needs to implement a series of complex functions related to data governance flowcharts, such as the introduction of multiple data sources, flexible configuration of complex ETL (data extraction, transformation, loading) processes, process visualization, data theming, etc. Due to the complexity of government business logic, users often manually create and organize flowcharts based on actual business attributes, resulting in complex and chaotic flowchart structures that cannot intuitively and clearly reflect the data flow and the logical relationships between business lines and process nodes.

[0005] The current chaotic flow charts are not conducive to business understanding, supporting cross-departmental business collaboration, or improving the quality of data resources shared among departments. Summary of the invention

[0006] In order to overcome the shortcomings of the above-mentioned prior art, the present invention provides a web-based automatic flowchart layout method. After the layout, the logical relationship between the nodes between the business lines is clearer, which is convenient for business developers to understand the business relationship between departments and improve the data sharing quality between departments.

[0007] To achieve the above objectives, one or more embodiments of the present invention provide the following technical solutions:

[0008] In a first aspect, a method for automatically laying out a flowchart based on a web terminal is disclosed, comprising:

[0009] Get the coordinates and related parameters of each node of the web-side flowchart, and output the horizontal and vertical coordinates of each node after the Y-axis symmetrical layout;

[0010] After performing a Y-axis symmetrical layout on any flowchart, the number of intersections of the lines in the current flowchart is counted and recorded as the first value. The conditional loop is entered. After recording the current node order, the order of the current nodes is rearranged using the neighborhood weight heuristic algorithm. After re-layout along the Y-axis symmetrically, the number of node line intersections is counted again and set as the first value, and the next loop is entered.

[0011] When jumping out of the loop, the current node is arranged symmetrically along the Y axis according to the order in the record to reduce the number of cross-connections in the flowchart;

[0012] Based on the horizontal and vertical coordinates after the Y-axis symmetrical layout, a flowchart is drawn in the rendering layer.

[0013] A further technical solution is to obtain the coordinates and related parameters of each node of the web-side flowchart, specifically including:

[0014] The horizontal coordinate, vertical coordinate, node level of the current node, the index value of the current node in a certain level, the vertical interval and horizontal interval of the nodes, the number of nodes in the highest level among all levels in the flowchart, and the number of levels of the current level.

[0015] According to a further technical solution, after the Y-axis symmetrical layout, the horizontal coordinate x of each node is L*M2, and the vertical coordinate is (LL*M2–CL*M1) / 2+I*M1;

[0016] The horizontal coordinate of the current node is x, the vertical coordinate is y, the node level is L, the index value of the current node in a certain level is I, the node interval is M1 vertically and M2 horizontally, the number of nodes in the highest level among all levels in the flowchart is LL, and the number of levels of the current level is CL.

[0017] A further technical solution also includes: a node level determination step, specifically:

[0018] After initializing the data level of each node, a recursive algorithm is used to traverse each node in the graph along the connection lines starting from all head nodes to determine the data level of each node in the graph.

[0019] A further technical solution is to traverse each node in the graph along the connection starting from all the head nodes, and each time a node is visited:

[0020] Push the id of the access node into the 'access record stack';

[0021] Check whether the IDs of all the upper nodes of the access node exist in the access record stack. If so, take the largest data level in the upper node plus one as the data level of the access node, and recursively call all the lower nodes of the access node; if the ID of the upper node of the access node does not exist in the access record stack, exit the current recursive call;

[0022] After the traversal is completed, the index value of each node in its data level is calculated and sorted in ascending order.

[0023] A further technical solution is to count the number of intersections of the lines in the current flowchart through the intersections of the lines in the flowchart. The steps for determining the intersections of the lines in the flowchart are:

[0024] Use the vector cross product method to determine whether two line segments intersect. A line segment consists of two objects, a starting endpoint and an ending endpoint. Each endpoint consists of the x-coordinate and y-coordinate of the endpoint.

[0025] A further technical solution is to construct two two-dimensional vectors, with A pointing to C and B pointing to D, from two line segments AB and CD formed by points A and B and points C and D, and perform cross product of the two vectors. If the result is a positive number, it means that the two line segments AB and CD intersect, otherwise they do not intersect.

[0026] A further technical solution is to rearrange the order of the current nodes through a neighborhood weight heuristic algorithm, specifically:

[0027] Rearrange nodes according to the average rank value of their neighbors in adjacent levels;

[0028] If the data level of the current node is 0, that is, the current node is the head node, then the neighborhood average order value of the current node is the sum of the index values ​​of the nodes connected to the current node in the second layer divided by the number of nodes in the second layer;

[0029] If the current node is neither the head node nor the tail node, and the data level of the current node is L, then the average neighborhood order value of the current node is the sum of the index values ​​of the upper nodes of the current node in the L-1 layer plus the sum of the index values ​​of all the lower nodes of the current node in the L+1 layer, divided by the total number of nodes in the L-1 layer and the L+1 layer;

[0030] If the current node is the tail node and the current level is L, that is, there is no lower-level node, the average neighborhood index value of the current node is the sum of the index values ​​of the upper-level nodes in the L-1 layer divided by the total number of nodes in the L-1 layer.

[0031] In a second aspect, a web-based flowchart automatic layout system is disclosed, comprising:

[0032] The node coordinate acquisition module is configured to: obtain the coordinates and related parameters of each node of the web-side flow chart, and output the horizontal coordinate and vertical coordinate of each node after the Y-axis symmetrical layout;

[0033] The Y-axis symmetrical layout node coordinate calculation module is configured to: after performing Y-axis symmetrical layout on any flow chart, count the number of intersections of the lines in the current flow chart, record it as the first value, enter a conditional loop, record the current node sorting, rearrange the order of the current nodes through the neighborhood weight heuristic algorithm, re-layout symmetrically along the Y axis, and then count the number of node line intersections again and set it as the first value, and enter the next loop;

[0034] When jumping out of the loop, the current node is arranged symmetrically along the Y axis according to the order in the record to reduce the number of cross-connections in the flowchart;

[0035] The flowchart drawing module is configured to draw the flowchart in the rendering layer based on the horizontal coordinate and the vertical coordinate after the Y-axis symmetrical layout.

[0036] One or more of the above technical solutions have the following beneficial effects:

[0037] The present invention proposes a web-based automatic layout method for flowcharts, that is, to arrange the nodes in the flowchart symmetrically according to their node levels in the diagram and make the data flow direction consistent. Try to keep the flowchart structure compact, avoid long edges, and reduce the intersection of edges to maintain a balanced layout of the nodes in the diagram. Nodes at the same level are in the same column and have the same x value in the web canvas; each business line is arranged horizontally according to the input source to avoid intersection. After the layout, the logical relationship between each node between each business line is clearer, which is convenient for business developers to understand the business relationship between departments and improve the data sharing quality of data between departments.

[0038] The solution of the present invention makes the manually generated flowchart more readable to a certain extent, and makes the logical relationship between nodes and processes clearer. This method improves the comprehensive operation and maintenance management system of the government data governance platform, facilitates the business personnel of the government data governance platform to understand the flow direction of government data, improves the operation and maintenance guarantee capability of the government data governance platform, and improves the level of cross-departmental business collaboration and data integration.

[0039] Advantages of additional aspects of the present invention will be given in part in the following description, and in part will become obvious from the following description, or will be learned through practice of the present invention. BRIEF DESCRIPTION OF THE DRAWINGS

[0040] The accompanying drawings in the specification, which constitute a part of the present invention, are used to provide a further understanding of the present invention. The exemplary embodiments of the present invention and their descriptions are used to explain the present invention and do not constitute improper limitations on the present invention.

[0041] Figure 1 This is a flow chart before automatic layout of an embodiment of the present invention;

[0042] Figure 2This is a flow chart after automatic layout according to an embodiment of the present invention;

[0043] Figure 3 The figure is a schematic diagram of the automatic layout process according to an embodiment of the present invention. DETAILED DESCRIPTION

[0044] It should be noted that the following detailed descriptions are exemplary and are intended to provide further explanation of the present invention. Unless otherwise specified, all technical and scientific terms used herein have the same meanings as those commonly understood by those skilled in the art to which the present invention belongs.

[0045] It should be noted that the terms used herein are for describing specific embodiments only and are not intended to be limiting of exemplary embodiments according to the present invention.

[0046] In the absence of conflict, the embodiments of the present invention and the features of the embodiments may be combined with each other.

[0047] Embodiment 1

[0048] See attached Figure 3 As shown, this embodiment discloses a method for automatic layout of flowcharts based on a web terminal, which specifically includes three steps: node level determination, intersection reduction, and canvas rendering.

[0049] Step 1: Node level determination steps:

[0050] After initializing the data level of each node, a recursive algorithm is used to traverse each node in the graph along the connection lines starting from all the head nodes.

[0051] In this process, each time a node is visited:

[0052] Push the id of the access node into the 'access record stack';

[0053] Check whether the ids of all the upper nodes of the access node exist in the access record stack. If they do, take the largest data level in the upper node plus one as the data level of the access node, and recursively call all the lower nodes of the access node; if the id of the upper node of the access node does not exist in the access record stack, exit the current recursive call.

[0054] After the traversal is completed, the index value of each node in its data level is calculated and sorted in ascending order.

[0055] The above method can be used to determine the data level of each node in the graph and prepare for the next step.

[0056] Step 2: Reduce crossover: Reducing crossover is the core step in this method and can be divided into two steps:

[0057] 2-1. Calculation of intersection points of lines in the flow chart;

[0058] Calculation of line intersections in the flowchart: Use the vector cross product method to determine whether two line segments intersect. A line segment consists of two objects, a starting endpoint and an ending endpoint. Each endpoint consists of the x-coordinate and y-coordinate of the endpoint.

[0059] Example: If there are two line segments AB and CD formed by two points A and B and two points C and D. Construct two two-dimensional vectors, A pointing to C and B pointing to D, and perform the cross product of these two vectors. If the result is a positive number, it means that the two line segments AB and CD intersect, otherwise they do not intersect.

[0060] 2-2. Neighborhood weight heuristic algorithm rearrangement.

[0061] Neighborhood weight heuristic algorithm: Rearrange nodes according to the average rank value (d2) of their neighboring nodes (superior nodes, subordinate nodes) in adjacent levels.

[0062] Example 1: If the data level of the current node is 0 (first layer), that is, the current node is the head node, then the neighborhood average order value (d2) of the current node is the sum of the index values ​​of the nodes connected to the current node in the second layer divided by the number of nodes in the second layer.

[0063] Example 2: If the current node is neither the head node nor the tail node, and the data level of the current node is L, then the neighborhood average order value of the current node is the sum of the index values ​​of the upper nodes of the current node in the L-1 layer plus the sum of the index values ​​of all the lower nodes of the current node in the L+1 layer, divided by the total number of nodes in the L-1 layer and the L+1 layer.

[0064] Example 3: If the current node is the tail node and the current level is L, that is, there is no lower-level node, the average neighborhood order value of the current node is the sum of the index values ​​of the upper-level nodes in the L-1 level divided by the total number of nodes in the L-1 level.

[0065] The concept of the above-mentioned order average is similar to the weighted average index number, which is a form of calculating the weights of the order of data in adjacent levels at the same data level, and is used to sort the nodes in the same data level from small to large.

[0066] Its basic characteristics are: first calculate the rank value of a node in the adjacent levels (that is, the sum of the rank values ​​of each connected upstream and downstream node in the adjacent levels), and then perform weighted average of the rank values ​​of the individual nodes in the adjacent levels to obtain the rank average of the individual nodes. Its purpose is to measure the impact of the ranking of the upstream and downstream nodes of the current node on the ranking of the current node.

[0067] Y-axis symmetric layout method: Let the horizontal coordinate of the current node be x, the vertical coordinate be y, the node level be L, the index value of the current node in a certain level be I, the node interval be M1 vertically and M2 horizontally (unit px, for example: 200 pixels), the number of nodes in the highest level of all levels in the flowchart be LL, and the number of levels of the current level be CL. Then the node coordinates after Y-axis symmetric layout: the horizontal coordinate x of each node is L*M2, and the vertical coordinate is (LL*M2–CL*M1) / 2+I*M1.

[0068] During automatic layout, after performing Y-axis symmetrical layout on any flowchart, count the number of intersections of the lines in the current graph model, record it as CountNumber, and set o_countNumber to infinity. Enter the conditional loop when o_countNumber is greater than CountNumber: set o_countNumber equal to CountNumber, record the current node sorting O1, re-arrange the order of the current nodes through the neighborhood weight heuristic algorithm, re-layout symmetrically along the Y axis, and then count the number of node line intersections again and set it to CountNumber. Enter the next loop. When jumping out of the loop, the current nodes are arranged symmetrically along the Y axis according to the sorting in the O1 record.

[0069] o_countNumber is an int type value, which records the number of line intersections in the graph after calculating the average order value and reordering in the previous cycle. Its initial value is infinite, and then it is reassigned to the number of line intersections after reordering during the neighborhood weight heuristic algorithm.

[0070] The current node order O1 is: the order in which all nodes in the current graph are arranged in their data hierarchy. The function is: in the neighborhood weight heuristic algorithm, the best node order is the node order of the last cycle recorded by O1 when exiting.

[0071] Step 3: Canvas rendering:

[0072] According to the node coordinates generated in step 2, draw the flowchart in the rendering layer and move the center of gravity of the flowchart to the center of the canvas.

[0073] Attached Figure 1 This is the flowchart before automatic layout. Figure 2 This is the flowchart after automatic layout.

[0074] Embodiment 2

[0075] The purpose of this embodiment is to provide a computing device, including a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the steps of the above method are implemented when the processor executes the program.

[0076] Embodiment 3

[0077] The purpose of this embodiment is to provide a computer-readable storage medium.

[0078] A computer-readable storage medium stores a computer program, which executes the steps of the above method when executed by a processor.

[0079] Embodiment 4

[0080] The purpose of this embodiment is to provide a web-based flowchart automatic layout system. The system is structurally divided into a rendering layer and a data logic layer. The rendering layer is implemented based on the third-party library JsPlumb and is responsible for flowchart rendering; the data logic layer is mainly responsible for storing and maintaining the data set of each node and its connection in the flowchart, as well as various flowchart-related logical operations.

[0081] The graph type is a directed acyclic graph. The data types and concepts involved in this method are as follows:

[0082] Head node: All nodes with in-degree 0, that is, the set of all nodes in the flowchart that have no predecessor node.

[0083] Tail node: All nodes with out-degree 0, that is, the set of nodes without subordinate nodes in the flowchart.

[0084] Connection set: A collection of all connections in a flowchart, where a connection is an object described by a source node and a target node.

[0085] Node set: The set of all nodes in the flowchart.

[0086] Node: An object described by id, node type, horizontal axis, vertical axis, data level, lower node set, upper node set and other business attributes.

[0087] Subordinate node: The collection of nodes pointed to by all the links on a node in the flowchart.

[0088] Parent node: Relative to the child node, the set of all nodes in the flowchart that have a connection pointing to a certain node.

[0089] Data level: The level of a node in the graph. The initial value is 0. A node belongs to only one level in the graph.

[0090] See again the attached Figure 3 As shown, this embodiment specifically discloses a flowchart automatic layout system based on a web terminal, including:

[0091] The node coordinate acquisition module is configured to: obtain the coordinates and related parameters of each node of the web-side flow chart, and output the horizontal coordinate and vertical coordinate of each node after the Y-axis symmetrical layout;

[0092] The Y-axis symmetrical layout node coordinate calculation module is configured to: after performing Y-axis symmetrical layout on any flow chart, count the number of intersections of the lines in the current flow chart, record it as the first value, enter a conditional loop, record the current node sorting, rearrange the order of the current nodes through the neighborhood weight heuristic algorithm, re-layout symmetrically along the Y axis, and then count the number of node line intersections again and set it as the first value, and enter the next loop;

[0093] When jumping out of the loop, the current node is arranged symmetrically along the Y axis according to the order in the record to reduce the number of cross-connections in the flowchart;

[0094] The flowchart drawing module is configured to draw the flowchart in the rendering layer based on the horizontal coordinate and the vertical coordinate after the Y-axis symmetrical layout.

[0095] It also includes: a module for calculating the number of intersection points of lines in the figure: configured to execute: calculation of intersection points of lines in the flowchart: using mathematical knowledge, judging whether two line segments intersect by vector cross product method (a line segment consists of two objects, a starting endpoint and an ending endpoint, and each endpoint consists of the x-coordinate and y-coordinate of the endpoint).

[0096] Example: If there are two line segments AB and CD formed by two points A and B and two points C and D. Construct two two-dimensional vectors, A pointing to C and B pointing to D, and perform the cross product of these two vectors. If the result is a positive number, it means that the two line segments AB and CD intersect, otherwise they do not intersect.

[0097] Domain weight heuristic rearrangement module: configured to rearrange nodes according to the average rank value (d2) of the node's neighboring nodes (superior nodes, subordinate nodes) in the adjacent levels.

[0098] If the data level of the current node is 0 (first layer), that is, the current node is the head node, then the neighborhood average order value (d2) of the current node is the sum of the index values ​​of the nodes connected to the current node in the second layer divided by the number of nodes in the second layer.

[0099] If the current node is neither the head node nor the tail node, and the data level of the current node is L, then the average neighborhood order value of the current node is the sum of the index values ​​of the upper nodes of the current node in the L-1 layer plus the sum of the index values ​​of all the lower nodes of the current node in the L+1 layer, divided by the total number of nodes in the L-1 layer and the L+1 layer.

[0100] If the current node is the tail node and the current level is L, that is, there is no lower-level node, the average neighborhood index value of the current node is the sum of the index values ​​of the upper-level nodes in the L-1 layer divided by the total number of nodes in the L-1 layer.

[0101] The steps involved in the apparatuses of the above embodiments 2, 3 and 4 correspond to the method embodiment 1, and the specific implementation methods can refer to the relevant description part of embodiment 1. The term "computer-readable storage medium" should be understood as a single medium or multiple media including one or more instruction sets; it should also be understood to include any medium that can store, encode or carry an instruction set for execution by a processor and enable the processor to execute any method in the present invention.

[0102] Those skilled in the art should understand that the modules or steps of the present invention described above can be implemented by a general-purpose computer device, or alternatively, they can be implemented by a program code executable by a computing device, so that they can be stored in a storage device and executed by the computing device, or they can be made into individual integrated circuit modules, or multiple modules or steps therein can be made into a single integrated circuit module for implementation. The present invention is not limited to any specific combination of hardware and software.

[0103] Although the above describes the specific implementation mode of the present invention in conjunction with the accompanying drawings, it is not intended to limit the scope of protection of the present invention. Those skilled in the art should understand that various modifications or variations that can be made by those skilled in the art on the basis of the technical solution of the present invention without creative work are still within the scope of protection of the present invention.

Claims

1. A method for automatic layout of flowcharts based on a web terminal, characterized in that: include: Get the coordinates and related parameters of each node of the web-side flowchart, and output the horizontal and vertical coordinates of each node after the Y-axis symmetrical layout; When traversing each node in the graph along the lines starting from all the head nodes, each time a node is visited: Push the id of the access node into the 'access record stack'; Check whether the IDs of all the upper nodes of the access node exist in the access record stack. If so, take the largest data level in the upper node plus one as the data level of the access node, and recursively call all the lower nodes of the access node; if the ID of the upper node of the access node does not exist in the access record stack, exit the current recursive call; After the traversal is completed, the index value of each node in its data hierarchy is calculated and sorted in ascending order; After performing a Y-axis symmetrical layout on any flowchart, the number of intersections of the lines in the current flowchart is counted and recorded as the first value. The conditional loop is entered. After recording the current node order, the order of the current nodes is rearranged using the neighborhood weight heuristic algorithm. After re-layout along the Y-axis symmetrically, the number of node line intersections is counted again and set as the first value, and the next loop is entered. The current nodes are rearranged in order through the neighborhood weight heuristic algorithm, specifically: Rearrange nodes according to the average rank value of their neighbors in adjacent levels; If the data level of the current node is 0, that is, the current node is the head node, then the neighborhood average order value of the current node is the sum of the index values ​​of the nodes connected to the current node in the second layer divided by the number of nodes in the second layer; If the current node is neither the head node nor the tail node, and the data level of the current node is L, then the average neighborhood order value of the current node is the sum of the index values ​​of the upper nodes of the current node in the L-1 layer plus the sum of the index values ​​of all the lower nodes of the current node in the L+1 layer, divided by the total number of nodes in the L-1 layer and the L+1 layer; If the current node is the tail node and the current level is L, that is, there is no lower-level node, the average index value of the neighborhood of the current node is the sum of the index values ​​of the upper-level nodes in the L-1 layer divided by the total number of nodes in the L-1 layer; When jumping out of the loop, the current node is arranged symmetrically along the Y axis according to the order in the record to reduce the number of cross-connections in the flowchart; Based on the horizontal and vertical coordinates after the Y-axis symmetrical layout, a flowchart is drawn in the rendering layer.

2. The method for automatically laying out a flowchart based on a web terminal as claimed in claim 1, characterized in that: Get the coordinates and related parameters of each node of the web-side flowchart, including: The horizontal coordinate, vertical coordinate, node level of the current node, the index value of the current node in a certain level, the vertical interval and horizontal interval of the nodes, the number of nodes in the highest level among all levels in the flowchart, and the number of levels of the current level; After the Y-axis symmetrical layout, the horizontal coordinate x of each node is , the vertical axis is ; The horizontal coordinate of the current node is x, the vertical coordinate is y, the node level is L, the index value of the current node in a certain level is I, the node interval is M1 vertically and M2 horizontally, the number of nodes in the highest level among all levels in the flowchart is LL, and the number of levels of the current level is CL.

3. The method for automatically laying out a flowchart based on a web terminal as claimed in claim 1, characterized in that: include: The node level determination steps are as follows: After initializing the data level of each node, a recursive algorithm is used to traverse each node in the graph along the connection lines starting from all head nodes to determine the data level of each node in the graph.

4. The method for automatically laying out a flowchart based on a web terminal as claimed in claim 1, characterized in that: The number of intersections of the lines in the current flowchart is counted through the intersections of the lines in the flowchart. The steps for determining the intersections of the lines in the flowchart are as follows: Use the vector cross product method to determine whether two line segments intersect. A line segment consists of two objects: the starting endpoint and the ending endpoint. Each endpoint consists of the x-coordinate and y-coordinate of the endpoint. From the two line segments AB and CD formed by the two points A and B and the two points C and D, construct two two-dimensional vectors with A pointing to C and B pointing to D. Perform the cross product of these two vectors. If the result is a positive number, it means that the two line segments AB and CD intersect, otherwise they do not intersect.

5. A web-based automatic flow chart layout system using the method of claim 1, characterized in that: include: The node coordinate acquisition module is configured to: obtain the coordinates and related parameters of each node of the web-side flow chart, and output the horizontal coordinate and vertical coordinate of each node after the Y-axis symmetrical layout; The Y-axis symmetrical layout node coordinate calculation module is configured to: after performing Y-axis symmetrical layout on any flow chart, count the number of intersections of the lines in the current flow chart, record it as the first value, enter a conditional loop, record the current node sorting, rearrange the order of the current nodes through the neighborhood weight heuristic algorithm, re-layout according to the Y axis symmetrically, and then count the number of node line intersections again and set it as the first value, and enter the next loop; When jumping out of the loop, the current node is arranged symmetrically along the Y axis according to the order in the record to reduce the number of cross-connections in the flowchart; The flowchart drawing module is configured to draw the flowchart in the rendering layer based on the horizontal coordinate and the vertical coordinate after the Y-axis symmetrical layout.

6. The web-based automatic flow chart layout system according to claim 5, characterized in that: include: The line intersection calculation module in the figure is configured to execute: The line intersection calculation in the flowchart: using mathematical knowledge, the vector cross product method is used to determine whether two line segments intersect. The line segment consists of two objects, the starting endpoint and the ending endpoint. Each endpoint consists of the x-coordinate and the y-coordinate of the endpoint; If there are two line segments AB and CD formed by two points A and B and two points C and D, construct two two-dimensional vectors with A pointing to C and B pointing to D, and perform the cross product of these two vectors. If the result is a positive number, it means that the two line segments AB and CD intersect, otherwise they do not intersect; Further, it also includes: a domain weight heuristic rearrangement module: configured to: rearrange the nodes according to the average rank values ​​of the nodes' neighboring nodes in the adjacent levels; If the data level of the current node is 0, that is, the current node is the head node, then the neighborhood average order value of the current node is the sum of the index values ​​of the nodes connected to the current node in the second layer divided by the number of nodes in the second layer; If the current node is neither the head node nor the tail node, and the data level of the current node is L, then the average neighborhood order value of the current node is the sum of the index values ​​of the upper nodes of the current node in the L-1 layer plus the sum of the index values ​​of all the lower nodes of the current node in the L+1 layer, divided by the total number of nodes in the L-1 layer and the L+1 layer; If the current node is the tail node and the current level is L, that is, there is no lower-level node, the average neighborhood index value of the current node is the sum of the index values ​​of the upper-level nodes in the L-1 layer divided by the total number of nodes in the L-1 layer.

7. A computing device comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein: When the processor executes the program, the steps of the method described in any one of claims 1 to 5 are implemented.

8. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the steps of the method described in any one of claims 1 to 5 are performed.

Images