Method and apparatus for presenting flowcharts

By displaying flowcharts in layers, the performance degradation issue of flowchart display is solved, and the number of task nodes is reduced, resulting in a user-friendly browsing and management experience.

CN120374791BActive Publication Date: 2025-10-17CHINA SECURITIES DEPOSITORY & CLEARING CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202510873164.3
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2025-06-26
Publication Date
2025-10-17
Estimated Expiration
2045-06-26

AI Technical Summary

Technical Problem

The existing flowchart visualization engine shows performance degradation when the number of task nodes exceeds a certain value, and is not convenient for users to browse and manage.

Method used

The flowchart is presented in a hierarchical manner, which breaks down the flowchart of the business system into a top-level flowchart and multiple sub-flowcharts. By determining the request task nodes and their levels, descendant task nodes are drawn and dependency information is connected to generate the flowchart.

Benefits of technology

The number of task nodes displayed in the flowchart has been reduced, improving the display performance of the graph visualization engine and making it easier for users to browse and manage flowcharts.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120374791B_ABST
    Figure CN120374791B_ABST
Patent Text Reader

Abstract

The application discloses a flowchart display method and device, and relates to the technical field of computers. A specific implementation of the method comprises the following steps: receiving a flowchart display request; determining a request task node and a request level corresponding to the flowchart display request, and determining a plurality of child task nodes of the request task node at the request level; for each child task node, drawing a node icon corresponding to the child task node on a canvas according to coordinate information corresponding to the child task node; for each child task node, determining dependency information corresponding to the child task node; from a plurality of node icons on the canvas, determining a plurality of path node icons corresponding to the dependency information; and connecting each path node icon in sequence through a directed edge. The implementation displays the flowchart in a hierarchical manner, can reduce the number of task nodes that need to be displayed, improve the display performance of a graph visualization engine, and facilitates user browsing of the flowchart.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of computer, and in particular, to a process diagram display method and device. BACKGROUND

[0002] Process scheduling systems are widely used in the fields of computing resource management, industrial production, task allocation, etc., and the core value thereof lies in solving the contradiction between resource limitation and demand complexity. With the development of information technology and automation, the demand for process scheduling systems is growing. Process scheduling systems are usually implemented through process diagrams. A process diagram uses various different icons to represent tasks or activities in a work process, and uses the connection relationship between the icons to represent the execution order between the tasks. Existing graph visualization engines usually display process diagrams in a flat manner, i.e., all node icons are uniformly displayed in the process diagram. However, when the number of task nodes is greater than a certain value, the display performance of the graph visualization engine will obviously degrade, and this display manner is also not convenient for users to browse and manage the process diagram. SUMMARY

[0003] Therefore, the embodiments of the present application provide a process diagram display method and device to display the process diagram in a hierarchical manner, which can reduce the number of task nodes to be displayed, improve the display performance of the graph visualization engine, and facilitate users to browse and manage the process diagram.

[0004] In a first aspect, the embodiments of the present application provide a process diagram display method, comprising:

[0005] receiving a process diagram display request;

[0006] determining a request task node and a request level corresponding to the process diagram display request, and determining a plurality of descendant task nodes of the request task node at the request level;

[0007] for each descendant task node, drawing a node icon corresponding to the descendant task node on a canvas according to coordinate information corresponding to the descendant task node;

[0008] for each descendant task node, determining dependency information corresponding to the descendant task node; determining a plurality of path node icons corresponding to the dependency information from a plurality of node icons on the canvas; and sequentially connecting each path node icon through a directed edge.

[0009] Optionally, the process diagram display request is issued for a current process diagram.

[0010] The determination of the request task node and the request level corresponding to the process diagram display request comprises:

[0011] determining a current node icon corresponding to the process diagram display request from a plurality of node icons of the current process diagram;

[0012] determine the task node corresponding to the current node icon as the request task node;

[0013] determine the level of the sub-process graph corresponding to the request task node as the request level.

[0014] Optionally, determining the request task node and the request level corresponding to the process graph display request comprises:

[0015] in response to the process graph being used for a top-level process graph of a business system, determining a root task node corresponding to the business system as the request task node, and determining the top level as the request level;

[0016] in response to the process graph being used for a sub-process graph of a business system, determining a root task node corresponding to the sub-process graph as the request task node, and determining a level corresponding to the sub-process graph as the request level.

[0017] Optionally, before receiving the process graph display request, the method further comprises:

[0018] determining a plurality of configuration node icons and a plurality of dependency edges in a process configuration interface;

[0019] for each configuration node icon, determining coordinate information of the configuration node icon in the process configuration interface; generating attribute information of a configuration task node corresponding to the configuration node icon; wherein the attribute information comprises a task number and coordinate information corresponding to the configuration task node;

[0020] for each dependency edge, determining a target node icon and a plurality of path node icons corresponding to the dependency edge; generating dependency information corresponding to the dependency edge; wherein the dependency information comprises a task number corresponding to the target node icon and a task number corresponding to each path node icon.

[0021] Optionally, before determining the plurality of configuration node icons and the plurality of dependency edges in the process configuration interface, the method further comprises:

[0022] receiving a process graph configuration request and displaying a process configuration interface;

[0023] receiving an arrangement operation for the process configuration interface;

[0024] generating a plurality of configuration node icons and a plurality of dependency edges in the process configuration interface according to the arrangement operation.

[0025] Optionally, generating the attribute information of the configuration task node corresponding to the configuration node icon comprises:

[0026] determining a parent task node and a sub-process identifier of the configuration task node; wherein the sub-process identifier is used to identify whether the configuration task node corresponds to a sub-process;

[0027] Generate attribute information corresponding to the configuration task node; wherein the attribute information includes: the task number and coordinate information corresponding to the configuration task node, the task number corresponding to the parent task node, and the sub-process identifier.

[0028] Optionally, after determining the multiple configuration node icons and the multiple dependency edges in the process configuration interface, the method further includes:

[0029] Determine the target level corresponding to the process configuration interface;

[0030] Combine the task numbers corresponding to the configuration node icons to generate a set of task nodes corresponding to the target level.

[0031] Optionally, for each descendant task node, after drawing the node icon corresponding to the descendant task node on the canvas according to the coordinate information corresponding to the descendant task node, the method further includes:

[0032] Determine multiple display node icons in the canvas;

[0033] For each display node icon, the running status of the task node corresponding to the display node icon is determined; based on the running status, the display information corresponding to the display node icon is determined; based on the display information, the display node icon is displayed on the canvas.

[0034] In a second aspect, an embodiment of the present invention provides a flow chart display device, comprising:

[0035] A request receiving module, used for receiving a flowchart display request;

[0036] A node determination module is used to determine the request task node and request hierarchy corresponding to the flowchart display request, and to determine multiple descendant task nodes of the request task node under the request hierarchy;

[0037] The icon drawing module is used to draw the node icon corresponding to each descendant task node on the canvas according to the coordinate information corresponding to the descendant task node;

[0038] The edge connection module is used to determine the dependency information corresponding to each descendant task node; determine multiple path node icons corresponding to the dependency information from multiple node icons on the canvas; and connect each path node icon in sequence through directed edges.

[0039] In a third aspect, an embodiment of the present invention provides an electronic device, including:

[0040] one or more processors;

[0041] The storage device is used to store one or more programs. When the one or more programs are executed by one or more processors, the one or more processors implement the method of any of the above embodiments.

[0042] In a fourth aspect, an embodiment of the present application provides a computer readable medium, which stores a computer program, and the program is executed by a processor to implement the method of any of the above embodiments.

[0043] An embodiment of the above application has the following advantages or beneficial effects: The request task node and the request level corresponding to the flowchart display request are determined. According to the plurality of descendant task nodes of the request task node at the request level, the flowchart corresponding to the flowchart display request is generated. By splitting the entire flow of the business system into a plurality of different levels, the number of task nodes that need to be displayed in the flowchart can be reduced, the display performance of the graph visualization engine is improved, and the user can conveniently browse and manage the flowchart.

[0044] In addition, the request task nodes for completing the same function, having similar functions or having similar task attributes are aggregated into a sub-flowchart, which can reduce the number of task nodes displayed in the top-level flowchart or the high-level flowchart, and further facilitate the user to browse and manage the top-level flowchart or the high-level flowchart.

[0045] The further effects of the above-mentioned non-conventional optional mode will be described in the following combined with the specific embodiments. BRIEF DESCRIPTION OF DRAWINGS

[0046] The accompanying drawings are used to better understand the present application and do not constitute an improper limitation on the present application. Among them:

[0047] Figure 1 is a flowchart of a flowchart display method provided by a first embodiment of the present application;

[0048] Figure 2 is a flowchart of a flowchart display method provided by a second embodiment of the present application;

[0049] Figure 3 is a flowchart of a flowchart display method provided by a third embodiment of the present application;

[0050] Figure 4 is a schematic diagram of a configuration interface of a main flowchart provided by an embodiment of the present application;

[0051] Figure 5 is a schematic diagram of a configuration interface of a sub-flowchart provided by an embodiment of the present application;

[0052] Figure 6 is a schematic diagram of another configuration interface of a sub-flowchart provided by an embodiment of the present application;

[0053] Figure 7is a schematic diagram of a display interface of a main flowchart provided by an embodiment of the present application;

[0054] Figure 8 is a schematic diagram of a display interface of a sub-flowchart provided by an embodiment of the present application;

[0055] Figure 9 is a schematic diagram of another display interface of a sub-flowchart provided by an embodiment of the present application;

[0056] Figure 10 is a structural schematic diagram of a display device of a flowchart provided by an embodiment of the present application;

[0057] Figure 11 is a structural schematic diagram of a computer system of a terminal device or a server suitable for implementing an embodiment of the present application. DETAILED DESCRIPTION

[0058] Exemplary embodiments of the present application are described herein with reference to the accompanying drawings, which are meant to be exemplary and not limiting. Therefore, it should be recognized that many changes and modifications can be made to the embodiments described herein, without departing from the spirit and scope of the application. Also, for the sake of brevity and clarity, descriptions of well-known functions and constructions are omitted herein.

[0059] In the technical solutions of the present application, the acquisition, transmission, storage, use, processing, etc. of data comply with relevant provisions of national laws and regulations.

[0060] It should be noted that in the embodiments of the present application, some industry existing solutions, components, models, etc. may be mentioned, which should be considered as exemplary, and the purpose is only to illustrate the feasibility of the technical solutions of the present application, but it does not mean that the applicant has or will necessarily use the solutions.

[0061] Figure 1 is a flowchart of a display method of a flowchart provided by a first embodiment of the present application, as shown in Figure 1 The method comprises the following steps.

[0062] Step 101: receiving a flowchart display request.

[0063] Step 102: determining a request task node and a request level corresponding to the flowchart display request, and determining a plurality of descendant task nodes of the request task node at the request level.

[0064] The entire flow of the business system is split into a top-level flowchart and a plurality of sub-flowcharts. The top-level flowchart is the top-level flowchart of the business system. All the sub-flowcharts are sub-flowcharts of the top-level flowchart.

[0065] Different flowcharts correspond to different root task nodes and levels. Determine the flowchart corresponding to the flowchart display request, determine the root task node corresponding to the flowchart as the request task node, and determine the level corresponding to the flowchart as the request level.

[0066] If the flowchart is used for the top-level flowchart of the request business system, the root task node corresponding to the business system is determined as the request task node, and the top level is determined as the request level. If the flowchart is used for the sub-flowchart of the request business system, the root task node corresponding to the sub-flowchart is determined as the request task node, and the level corresponding to the sub-flowchart is determined as the request level.

[0067] For example, the business system is used to perform user login processing. The top-level flowchart includes: a root task node, a user login information acquisition task node, a user identity confirmation task node, a login success processing node, and a login failure processing node. Among them, the user login information acquisition task node, the user identity confirmation task node, the login success processing node, and the login failure processing node all correspond to their own sub-flowcharts.

[0068] In the sub-flowchart corresponding to the login success processing node, the login success processing node is the root task node of the sub-flowchart, and each task node in the sub-flowchart is a descendant node of the login success processing node. The level corresponding to the sub-flowchart is: top-level flowchart\login success processing. The sub-flowchart can include: a user permission determination node, a login interface display node, and a to-do list reminder node. By sequentially executing each of the above task nodes, the flow processing corresponding to the login success processing node is completed.

[0069] Step 103: For each descendant task node, draw the node icon corresponding to the descendant task node on the canvas according to the coordinate information corresponding to the descendant task node.

[0070] The coordinate information can include the x-axis coordinate and y-axis coordinate corresponding to the task node. The high performance and rich built-in components of the canvas are used to ensure the efficient and stable operation of the state refresh, operation and maintenance monitoring, and manual intervention of the task node.

[0071] Step 104: For each descendant task node, determine the dependency information corresponding to the descendant task node; from the multiple node icons on the canvas, determine multiple path node icons corresponding to the dependency information; and sequentially connect each path node icon through a directed edge.

[0072] The dependency information corresponding to the task node includes at least one node set. Each node set includes multiple task nodes with execution order. The dependency information is used to represent other task nodes that the task node depends on in the execution process.

[0073] For example, the dependency information corresponding to the target task node includes: node set 1. The node set 1 includes in turn: task node 1, task node 2, task node 3 and task node 4, then the task corresponding to the task node 1 is the front dependent task of the task corresponding to the task node 2, the task corresponding to the task node 2 is the front dependent task of the task corresponding to the task node 3, the task corresponding to the task node 3 is the front dependent task of the task corresponding to the task node 4, and the task corresponding to the task node 4 is the front dependent task of the task corresponding to the target task node. In the execution process of the business system, the task nodes are executed in turn: task node 1-> task node 2-> task node 3-> task node 4-> target task node, to complete the execution of the target task node.

[0074] From the multiple node icons on the canvas, multiple path node icons corresponding to the dependency information corresponding to the descendant task node are determined. Then, the path node icons are connected in turn through directed edges, and finally a flowchart corresponding to the flowchart display request is generated. The directed edge is a line segment with an arrow. The directed edge in the flowchart can reflect the execution order and the dependency relationship between the task nodes.

[0075] In the scheme of the embodiment of the application, the request task node and the request level corresponding to the flowchart display request are determined. The flowchart corresponding to the flowchart display request is generated according to the multiple descendant task nodes of the request task node at the request level. By splitting the entire flow of the business system into multiple different levels, the number of task nodes that need to be displayed in the flowchart can be reduced, the display performance of the graph visualization engine can be improved, and the user can conveniently browse the flowchart.

[0076] In an embodiment of the application, the flowchart display request is issued for the current flowchart; determining the request task node and the request level corresponding to the flowchart display request includes: determining a current node icon corresponding to the flowchart display request from the multiple node icons of the current flowchart; determining the task node corresponding to the current node icon as the request task node; and determining the level of the subflowchart corresponding to the request task node as the request level.

[0077] The user browses the current flowchart and wants to view the subflowchart of a task node in the current flowchart. The user can click the node icon of the task node with the left mouse button, and a function menu for the task node is popped up in the current flowchart. The function menu can include: viewing a subflow, viewing task attributes, setting a checkpoint, etc. The user issues a flowchart display request by selecting to view the subflow.

[0078] The task node corresponding to the current node icon is determined as the request task node. The level of the subflowchart corresponding to the request task node is determined as the request level. The subflowchart corresponding to the request task node is displayed to respond to the flowchart display request.

[0079] Figure 2 is a flow diagram provided by a second embodiment of the present application, as shown in the method comprises: Figure 2

[0080] Step 201: determine the plurality of configuration node icons and a plurality of dependent edges in the flow configuration interface.

[0081] The user configures the flow diagram in the flow configuration interface. The flow diagram configured by the flow configuration interface includes: a plurality of configuration node icons and a plurality of dependent edges.

[0082] Step 202: for each configuration node icon, determine the coordinate information of the configuration node icon in the flow configuration interface; generate the attribute information of the configuration task node corresponding to the configuration node icon; wherein the attribute information includes: the task number and coordinate information corresponding to the configuration task node.

[0083] The attribute information of the configuration task node corresponding to the configuration node icon can be generated by determining the parent task node and the sub-flow identifier of the configuration task node. The attribute information corresponding to the configuration task node is generated. The attribute information includes: the task number corresponding to the configuration task node, the coordinate information corresponding to the configuration task node, the task number corresponding to the parent task node, and the sub-flow identifier. Wherein, the sub-flow identifier is used to identify whether the configuration task node corresponds to a sub-flow.

[0084] Step 203: for each dependent edge, determine the target node icon and a plurality of path node icons corresponding to the dependent edge; generate the dependent information corresponding to the dependent edge; wherein the dependent information includes: the task number corresponding to the target node icon and the task number corresponding to each path node icon.

[0085] The end task node corresponding to the dependent edge is determined as the target task node corresponding to the dependent edge. The dependent information corresponding to the dependent edge is the dependent information corresponding to the target task node.

[0086] For example, the dependent edge passes through the icons of task node 1, task node 2 and task node 3 in turn, then the task corresponding to task node 1 is the previous dependent task of the task corresponding to task node 2, and the task corresponding to task node 2 is the previous dependent task of the task corresponding to task node 3. In the execution process of the business system, the tasks corresponding to task node 1, task node 2 and task node 3 need to be executed in turn. Task node 3 is the target task node of the dependent edge. The dependent information corresponding to the dependent edge includes: the task number corresponding to task node 3 and the node set. Wherein, the node set includes: the task number corresponding to task node 1, the task number corresponding to task node 2 and the task number corresponding to task node 3. ​

[0087] In an embodiment of the present application, the format of the node set can also be represented as: V1x, V1y; V2x, V2y; V3x, V3y;...; Vnx, Vny. Wherein, V1x, V1y represents the x-axis coordinate and y-axis coordinate corresponding to the first path node icon of the dependent edge. Vnx, Vny represents the x-axis coordinate and y-axis coordinate corresponding to the n-th path node icon of the dependent edge.

[0088] In an embodiment of the present application, after determining the plurality of configuration node icons and the plurality of dependent edges in the process configuration interface, the method further comprises: determining a target level corresponding to the process configuration interface; and combining the task numbers corresponding to the configuration node icons to generate a task node set corresponding to the target level. By generating the task node set corresponding to the target level, the task node under the request level corresponding to the process diagram display request can be quickly determined after receiving the process diagram display request.

[0089] By obtaining the coordinate information in the attribute information of the task node under the request level, the node icon corresponding to the node is drawn on the canvas. By obtaining the dependency information of the task node under the request level, the plurality of path node icons in the dependency information are connected in sequence by using the directed edge, so that the process diagram display is efficiently completed.

[0090] Step 204: receiving a process diagram display request.

[0091] Step 205: determining a request task node and a request level corresponding to the process diagram display request, and determining a plurality of descendant task nodes of the request task node under the request level.

[0092] Step 206: for each descendant task node, drawing a node icon corresponding to the descendant task node on the canvas according to the coordinate information corresponding to the descendant task node.

[0093] Step 207: for each descendant task node, determining dependency information corresponding to the descendant task node; determining a plurality of path node icons corresponding to the dependency information from the plurality of node icons on the canvas; and connecting the plurality of path node icons in sequence by using a directed edge.

[0094] In the scheme of the embodiment of the present application, the attribute information and the dependency information corresponding to each task node are generated according to the plurality of configuration node icons and the plurality of dependent edges in the process configuration interface. The configuration node icon and the task node are in a one-to-one correspondence. After receiving the process diagram display request, the generation and display of the process diagram can be efficiently completed according to the attribute information and the dependency information corresponding to each task node.

[0095] The system also provides the adding, deleting, modifying and inquiring functions of the attribute information of the task nodes and the adding, deleting, modifying and inquiring functions of the dependency information. The attribute information of the task nodes includes the parent task number and the coordinate information of the task nodes. The parent task number and the coordinate information of the task nodes determine the level of the task nodes and the position of the task nodes in the level. The dependency information includes the task number of the target node corresponding to the dependency information, the task number or the coordinate information of each path task node corresponding to the dependency information, etc. By using the dependency information, the drawing of each directed edge in the flowchart can be completed.

[0096] In an embodiment of the present application, before the plurality of configuration node icons and the plurality of dependency edges in the flow configuration interface are determined, the method further includes: receiving a flowchart configuration request and displaying the flow configuration interface; receiving an arrangement operation on the flow configuration interface; and generating the plurality of configuration node icons and the plurality of dependency edges in the flow configuration interface according to the arrangement operation.

[0097] The arrangement operation can include a drag operation and an editing operation, etc. The node icons in the configuration interface can be subjected to the drag operation. The front end will call the interface for updating the attribute information of the task node to update the attribute information of the task node. The directed edges in the configuration interface can also be subjected to the drag operation. The front end will call the interface for updating the dependency information to update the path task node information corresponding to the dependency information. The task node can also be clicked to perform the editing operation. The front end will call the interface for updating the attribute information of the task node to update the attribute information of the task node.

[0098] Figure 3 is a flowchart of a method for displaying a flowchart provided by a third embodiment of the present application, as shown in Figure 3 The method includes the following steps:

[0099] Step 301: receiving a flowchart display request.

[0100] Step 302: determining a request task node and a request level corresponding to the flowchart display request, and determining a plurality of descendant task nodes of the request task node at the request level.

[0101] Step 303: for each descendant task node, drawing a node icon corresponding to the descendant task node on a canvas according to the coordinate information corresponding to the descendant task node.

[0102] Step 304: for each descendant task node, determining dependency information corresponding to the descendant task node; determining a plurality of path node icons corresponding to the dependency information from a plurality of node icons on the canvas; and connecting each path node icon by a directed edge.

[0103] Step 305: determining a plurality of display node icons in the canvas.

[0104] Step 306: for each display node icon, determining a running state of the task node corresponding to the display node icon; according to the running state, determining display information corresponding to the display node icon; according to the display information, displaying the display node icon in the canvas.

[0105] The running state can include: not running, running, completed, and running failure, etc. The display information can include: display color, display shape, display size, display font, etc. A mapping relationship between the running state and the display information is preset in the system. According to the mapping relationship, the display information corresponding to each display node icon is determined, and the display node icon is displayed in the canvas.

[0106] For example, if the task node is in a not running state, the display color is a first color. When the task node starts running, the display color is a second color. The icon of the completed task node is displayed as a third color. The icon of the task node with running failure is displayed as a fourth color.

[0107] In the scheme of the embodiment of the application, after the flowchart corresponding to the flowchart display request is generated, the display information corresponding to the display node icon is determined according to the running state of the task node corresponding to the display node icon, and the display node icon is displayed in the canvas. By displaying the task node icons in different running states through different display information, the user can conveniently observe the running state of the task node and understand the overall running state of the business system, thereby improving the flowchart browsing experience of the user.

[0108] The scheme of the embodiment of the application realizes task layering based on the nesting of the directed acyclic graph. By analyzing the dependency relationship of the tasks in the flowchart, the tasks in each group of each layer are controlled in a reasonable range using a grouping and layering mode. Meanwhile, the scheme of the embodiment of the application also realizes the nesting of the sub-flowchart, and converts the complex dependency relationship in the originally flat flowchart into the parent-child relationship and the front-back dependency relationship between the task nodes, thereby reducing the complexity of the arrangement and display of the flowchart.

[0109] In the flowchart configuration process, the visual arrangement design is used to obtain the coordinate information of the task node icon and the coordinate information of the approach node of the dependency edge. The attribute information and the dependency information of the tasks in the flowchart are saved in the system. In the flowchart display process, the coordinate information of the task node and the coordinate information of the approach node of the dependency edge are used for flowchart rendering, thereby realizing the restoration display of the flowchart.

[0110] Figure 4 is a schematic diagram of a configuration interface of a main flowchart provided by an embodiment of the application, as Figure 4As shown, the main flow configuration interface provides a workspace for visual editing of a flowchart. The information in the upper left corner of the main flow configuration interface shows the hierarchy corresponding to the current flowchart. The configuration interface can also provide a variety of flowchart components, such as database batch tasks, database stream tasks, kafka stream tasks, and other types of tasks. Different flowchart components are used to represent different task types, so that the generated flowchart can express more complete flow execution information, and the user's browsing experience is better.

[0111] In addition, the configuration interface can also provide a thumbnail function. In the case where the number of task nodes in the flowchart is large, the user can quickly understand the architecture of the business system and the execution of the flow by using the thumbnail function, which facilitates the user's analysis and management of the business system.

[0112] Figure 4 The configuration interface shown in FIG. 19 is used to edit the flowchart corresponding to as400-sq-prod-test. as400-sq-prod-test is the description information corresponding to the main flow of the business system.

[0113] The task nodes in the solid frame correspond to specific tasks. The task nodes in the dashed frame correspond to virtual tasks. A virtual task generally corresponds to a sub-flow. A virtual task is a special type of task that does not perform specific business processing in the scheduling system and is mainly used to simplify the dependency relationship between task nodes. Virtual tasks include virtual tasks with aggregation functions and virtual tasks containing sub-flows.

[0114] Figure 4 The directed edges with arrows in FIG. 19 are used to represent the dependency relationship between task nodes. For example, the start of task 30 and task 31 depends on the completion of task 406, and task 406 is connected to task 30 by a directed edge with an arrow. Task 406 is also connected to task 31 by a directed edge with an arrow.

[0115] Clicking on task 33 in FIG. 19 displays the configuration interface of the sub-flow corresponding to task 33. Figure 4 The configuration interface shown in FIG. 19 is used to edit the flowchart corresponding to as400-sq-prod-test. as400-sq-prod-test is the description information corresponding to the main flow of the business system. Figure 5 is a schematic diagram of a configuration interface of a sub-flowchart provided by an embodiment of the present application, as shown in Figure 5 As shown, the sub-flow configuration interface provides a workspace for visual editing of a flowchart. The breadcrumb navigation in the upper left corner of the sub-flow configuration interface shows the hierarchy corresponding to the currently edited flowchart. Figure 5 The configuration interface shown in FIG. 19 is used to edit the flowchart corresponding to as400-sq-prod-test. as400-sq-prod-test is the description information corresponding to the main flow of the business system.

[0116] Click Figure 5 the task 419, the configuration interface of the corresponding sub-process is displayed. Figure 6 is a schematic diagram of another sub-process configuration interface provided by an embodiment of the application, as shown in Figure 6 , Figure 6 The breadcrumb navigation in the upper left corner shows the hierarchy corresponding to the currently edited process diagram. deal-receiving-and-resolving is the parent task node of deal-receiving. deal-receiving is the parent task node of the current (421, 422, 423) -> 427 process.

[0117] Figure 7 is a schematic diagram of a display interface of a main process diagram provided by an embodiment of the application. Figure 7 is Figure 4 a display effect diagram of the main process diagram arranged. Figure 7 The displayed main process diagram is a view for an operation and maintenance personnel to monitor the running state of a business system during system running. The information in the upper left corner of the main process diagram shows the level in which the process diagram is located. The main process diagram and the sub-process diagram are displayed in a canvas. The task numbers and Chinese names of the task nodes are displayed in the canvas. The task nodes cannot be dragged, and the directed edges between the task nodes cannot be edited.

[0118] If the entire task process is in an unrunning state, the colors of all the task nodes are gray. When the process starts running, the task nodes that are running are displayed in yellow, the completed task nodes are displayed in blue, and the task nodes that fail to run are displayed in red.

[0119] Like the visual arrangement, the display of the process diagram also includes the function of embedding a sub-process. Right-click the task 33 in Figure 7 , and select View Sub-process to display the sub-process diagram corresponding to the task 33. Figure 8 is a schematic diagram of a display interface of a sub-process diagram provided by an embodiment of the application. Figure 8 is Figure 5 a display effect diagram of the sub-process diagram arranged. The upper left corner of the sub-process diagram or the main process diagram is provided with an internal tool bar, which provides functions such as picture zooming, task node searching, up-down layout and left-right layout switching, thumbnail, picture exporting, full screen, and theme color switching, for use by an operation and maintenance personnel.

[0120] Right-click the task 419 in Figure 8 , and select View Sub-process to display the sub-process diagram corresponding to the task 419. Figure 9 is a schematic diagram of another display interface of a sub-process diagram provided by an embodiment of the application. Figure 9 isFigure 6 A display diagram of the arranged sub-flowchart. Figure 9 Used to display the sub-flowchart corresponding to task 419.

[0121] During the visual arrangement of the flowchart, the attribute information and dependency information of the task nodes are saved. During the flowchart display process, the saved attribute information and dependency information of the task nodes are obtained and the flowchart is displayed. After the flowchart is displayed, the running status of each task node is obtained in real time, and the display information of the task node icon in the flowchart is determined based on the running status of the task node.

[0122] The solution of this embodiment of the present invention decomposes a complex, large-scale scheduling task flow chart into multiple, editable and restorable small flow charts. By utilizing nested directed acyclic graphs, this solution simplifies the dependencies between task nodes, reduces the number of tasks displayed in the layout, and enables fast retrieval within nested sub-processes. Furthermore, this solution provides graph arrangement and display capabilities, improving the rendering performance and layout stability of the graph visualization engine.

[0123] Figure 10 This is a schematic diagram of a flow chart display device provided by an embodiment of the present invention, which is applied to a business system, such as Figure 10 As shown, the device includes:

[0124] Request receiving module 1001, used to receive a flowchart display request;

[0125] The node determination module 1002 is used to determine the request task node and request hierarchy corresponding to the flowchart display request, and determine multiple descendant task nodes of the request task node under the request hierarchy;

[0126] The icon drawing module 1003 is used to draw the node icon corresponding to each descendant task node on the canvas according to the coordinate information corresponding to the descendant task node;

[0127] The edge connection module 1004 is used to determine the dependency information corresponding to each descendant task node; determine multiple path node icons corresponding to the dependency information from multiple node icons on the canvas; and connect each path node icon in sequence through directed edges.

[0128] Optionally, the flowchart display request is issued for the current flowchart;

[0129] The node determination module 1002 is specifically configured to:

[0130] Determine, from multiple node icons of the current flowchart, a current node icon corresponding to the flowchart display request;

[0131] determine the task node corresponding to the current node icon as the request task node;

[0132] determine the level of the sub-process graph corresponding to the request task node as the request level.

[0133] Optionally, the node determination module 1002 is specifically configured to:

[0134] in response to the process graph being used for a top-level process graph of a request business system, determine a root task node corresponding to the business system as the request task node, and determine a top level as the request level;

[0135] in response to the process graph being used for a sub-process graph of a request business system, determine a root task node corresponding to the sub-process graph as the request task node, and determine a level corresponding to the sub-process graph as the request level.

[0136] Optionally, the method further comprises:

[0137] a configuration module configured to determine a plurality of configuration node icons and a plurality of dependency edges in a process configuration interface;

[0138] for each configuration node icon, determine coordinate information of the configuration node icon in the process configuration interface, and generate attribute information of a configuration task node corresponding to the configuration node icon; wherein the attribute information comprises a task number and coordinate information corresponding to the configuration task node;

[0139] for each dependency edge, determine a target node icon and a plurality of path node icons corresponding to the dependency edge, and generate dependency information corresponding to the dependency edge; wherein the dependency information comprises a task number corresponding to the target node icon and a task number corresponding to each path node icon.

[0140] Optionally, the configuration module is further configured to:

[0141] receive a process graph configuration request, and display the process configuration interface;

[0142] receive an arrangement operation for the process configuration interface;

[0143] generate a plurality of configuration node icons and a plurality of dependency edges in the process configuration interface according to the arrangement operation.

[0144] Optionally, the configuration module is further configured to:

[0145] determine a parent task node and a sub-process identifier of the configuration task node; wherein the sub-process identifier is used to identify whether the configuration task node corresponds to a sub-process;

[0146] generate attribute information corresponding to the configuration task node; wherein the attribute information comprises a task number and coordinate information corresponding to the configuration task node, a task number corresponding to the parent task node, and the sub-process identifier.

[0147] Optionally, the configuration module is further configured to:

[0148] determine a target level corresponding to the flow configuration interface;

[0149] combine the task numbers corresponding to the configuration node icons to generate a task node set corresponding to the target level.

[0150] Optionally, the method further comprises:

[0151] a display module configured to determine a plurality of display node icons in the canvas;

[0152] for each display node icon, determine a running state of the task node corresponding to the display node icon, determine display information corresponding to the display node icon according to the running state, and display the display node icon in the canvas according to the display information.

[0153] An electronic device is provided in an embodiment of the application, and the electronic device comprises:

[0154] one or more processors;

[0155] a storage device configured to store one or more programs, when the one or more programs are executed by the one or more processors, the one or more processors implement the method of any one of the above embodiments.

[0156] A computer program product is provided in an embodiment of the application, and the computer program product comprises a computer program, when the computer program is executed by a processor, the computer program implements the display method of the flowchart in the embodiment of the application.

[0157] Reference is made below to Figure 11 which shows a structural schematic diagram of a computer system 1100 of a terminal device suitable for being used to implement the embodiments of the application. Figure 11 The terminal device shown is merely an example, and should not bring any limitation to the functions and use range of the embodiments of the application.

[0158] As shown in Figure 11 , the computer system 1100 comprises a central processing unit (CPU) 1101, which can perform various appropriate actions and processes according to programs stored in a read-only memory (ROM) 1102 or programs loaded from a storage portion 1108 into a random access memory (RAM) 1103. In the RAM 1103, various programs and data required for the operation of the system 1100 are also stored. The CPU 1101, the ROM 1102, and the RAM 1103 are connected to each other through a bus 1104. An input / output (I / O) interface 1105 is also connected to the bus 1104.

[0159] The following components are connected to the I / O interface 1105: an input part 1106 including a keyboard, a mouse, etc.; an output part 1107 including a display such as a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage part 1108 including a hard disk, etc.; and a communication part 1109 including a network interface card such as a LAN card, a modem, etc. The communication part 1109 performs communication processing via a network such as the Internet. A drive 1110 is also connected to the I / O interface 1105 as necessary. A removable media 1111 such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc. is attached to the drive 1110 as necessary, so that a computer program read out therefrom is installed in the storage part 1108 as necessary.

[0160] In particular, the processes described above with reference to the flowcharts can be implemented as a computer software program according to embodiments of the present disclosure. For example, embodiments of the present disclosure include a computer program product comprising a computer program carried on a computer readable medium, the computer program containing program code for executing the methods illustrated by the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network by the communication part 1109, and / or installed from the removable media 1111. When the computer program is executed by the central processing unit (CPU) 1101, the above-described functions defined in the system of the present disclosure are executed.

[0161] It should be noted that the computer-readable medium shown in the present application can be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may, for example, but is not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or component, or any combination of the above. More specific examples of computer-readable storage media can include, but are not limited to, an electrical connection having one or more wires, a portable computer diskette, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present application, the computer-readable storage medium can be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, device or component. In the present application, the computer-readable signal medium can include a data signal carried in a baseband or as a part of a carrier wave, which carries computer-readable program code. Such a propagated data signal can take various forms, including but not limited to an electromagnetic signal, an optical signal or any suitable combination of the above. The computer-readable signal medium can also be any computer-readable medium other than the computer-readable storage medium, which can send, propagate or transmit a program for use by or in conjunction with an instruction execution system, device or component. The program code contained on the computer-readable medium can be transmitted by any suitable medium, including but not limited to wireless, wire, optical cable, RF, etc., or any suitable combination of the above.

[0162] The flowcharts and block diagrams in the drawings illustrate the possible implementation architectures, functions and operations of the systems, methods and computer program products according to various embodiments of the present application. In this regard, each block in the flowcharts or block diagrams can represent a module, a program segment, or a portion of code that contains one or more executable instructions for implementing the specified logical functions. It should also be noted that in some alternative implementations, the functions noted in the blocks can occur in different orders than that shown in the figures. For example, two blocks that are shown in succession can actually be executed substantially concurrently, or they can sometimes be executed in reverse order, depending on the functionality involved. It should also be noted that each block in the block diagrams or flowcharts, and combinations of blocks in the block diagrams or flowcharts, can be implemented by a dedicated hardware-based system that performs specified functions or operations, or can be implemented by a combination of special-purpose hardware and computer instructions.

[0163] The modules described in the embodiments of the present application can be implemented in the form of software or in the form of hardware. The modules described can be arranged in a processor, for example, can be described as: request receiving module, node determining module, icon drawing module and edge connecting module. In some cases, the names of these modules do not constitute a limitation on the modules themselves, for example, the request receiving module can also be described as "a module for receiving flowchart display request".

[0164] As another aspect, the present application also provides a computer readable medium, which can be included in the device described in the above embodiments, or can exist independently without being assembled into the device. The computer readable medium carries one or more programs, which, when executed by the device, cause the device to include:

[0165] receiving a flowchart display request;

[0166] determining a request task node and a request level corresponding to the flowchart display request, and determining a plurality of descendant task nodes of the request task node at the request level;

[0167] for each descendant task node, drawing a node icon corresponding to the descendant task node on a canvas according to coordinate information corresponding to the descendant task node;

[0168] for each descendant task node, determining dependency information corresponding to the descendant task node; determining a plurality of path node icons corresponding to the dependency information from a plurality of node icons on the canvas; and connecting each path node icon by a directed edge.

[0169] According to the technical solution of the embodiments of the present application, the request task node and the request level corresponding to the flowchart display request are determined. The flowchart corresponding to the flowchart display request is generated according to the plurality of descendant task nodes of the request task node at the request level. By splitting the entire flow of the business system into a plurality of different levels, the number of task nodes that need to be displayed in the flowchart can be reduced, the display performance of the graph visualization engine can be improved, and the user can easily browse the flowchart.

[0170] The above detailed description does not constitute a limitation on the protection scope of the present application. Those skilled in the art should understand that various modifications, combinations, sub-combinations and substitutions can be made depending on design requirements and other factors. Any modification, equivalent replacement and improvement made within the spirit and principles of the present application shall be included in the protection scope of the present application.

Claims

1. A method for displaying a flow chart, characterized in that: include: Receive flowchart display request; Determine a request task node and a request hierarchy corresponding to the flowchart display request, and determine a plurality of descendant task nodes of the request task node under the request hierarchy; For each of the descendant task nodes, drawing a node icon corresponding to the descendant task node on the canvas according to the coordinate information corresponding to the descendant task node; For each of the descendant task nodes, determining dependency information corresponding to the descendant task node; Determining, from a plurality of node icons on the canvas, a plurality of pathway node icons corresponding to the dependency information; Connecting each of the pathway node icons in sequence through directed edges; Before receiving the flowchart display request, the method further includes: Determine multiple configuration node icons and multiple dependency edges in the process configuration interface; For each of the configuration node icons, determine the coordinate information of the configuration node icon in the process configuration interface; generate attribute information of the configuration task node corresponding to the configuration node icon; wherein the attribute information includes: the task number and coordinate information corresponding to the configuration task node; For each dependency edge, determining a target node icon and a plurality of path node icons corresponding to the dependency edge; generating dependency information corresponding to the dependency edge; wherein the dependency information includes: a task number corresponding to the target node icon and a task number corresponding to each path node icon; the dependency information corresponding to the dependency edge is dependency information corresponding to the end task node corresponding to the dependency edge; After determining the multiple configuration node icons and multiple dependency edges in the process configuration interface, it also includes: determining the target level corresponding to the process configuration interface; combining the task numbers corresponding to each of the configuration node icons to generate a task node set corresponding to the target level.

2. The method according to claim 1, characterized in that The flowchart display request is issued for the current flowchart; Determining the request task node and request level corresponding to the flowchart display request includes: Determining, from a plurality of node icons of the current flowchart, a current node icon corresponding to the flowchart display request; Determine the task node corresponding to the current node icon as the requested task node; The level of the sub-flowchart corresponding to the request task node is determined as the request level.

3. The method according to claim 1, characterized in that Determining the request task node and request level corresponding to the flowchart display request includes: In response to the flowchart being a top-level flowchart for requesting a business system, determining a root task node corresponding to the business system as the request task node, and determining a top level as the request level; In response to a sub-flowchart of the flowchart being used to request the business system, a root task node corresponding to the sub-flowchart is determined as the request task node, and a level corresponding to the sub-flowchart is determined as the request level.

4. The method according to claim 1, wherein Before determining the multiple configuration node icons and the multiple dependency edges in the process configuration interface, the method further includes: Receive a flowchart configuration request and display the flowchart configuration interface; receiving an orchestration operation for the process configuration interface; According to the orchestration operation, the multiple configuration node icons and the multiple dependency edges are generated in the process configuration interface.

5. The method according to claim 1, wherein The generating of attribute information of the configuration task node corresponding to the configuration node icon includes: Determine the parent task node and sub-process identifier of the configuration task node; wherein the sub-process identifier is used to identify whether the configuration task node corresponds to a sub-process; Generate attribute information corresponding to the configuration task node; wherein the attribute information includes: the task number corresponding to the configuration task node, the coordinate information corresponding to the configuration task node, the task number corresponding to the parent task node, and the sub-process identifier.

6. The method according to claim 1, characterized in that After drawing the node icon corresponding to each of the descendant task nodes on the canvas according to the coordinate information corresponding to the descendant task node, the method further includes: Determining a plurality of display node icons in the canvas; For each display node icon, determine the running status of the task node corresponding to the display node icon; determine the display information corresponding to the display node icon according to the running status; and display the display node icon on the canvas according to the display information.

7. A flow chart display device, characterized in that: include: A request receiving module, used for receiving a flowchart display request; a node determination module, configured to determine a request task node and a request hierarchy corresponding to the flowchart display request, and to determine a plurality of descendant task nodes of the request task node under the request hierarchy; An icon drawing module is used to draw, for each of the descendant task nodes, a node icon corresponding to the descendant task node on a canvas according to the coordinate information corresponding to the descendant task node; an edge connection module for determining, for each of the descendant task nodes, dependency information corresponding to the descendant task node; determining, from a plurality of node icons on the canvas, a plurality of path node icons corresponding to the dependency information; and sequentially connecting the path node icons via directed edges; The configuration module is used to determine multiple configuration node icons and multiple dependency edges in the process configuration interface; For each of the configuration node icons, determining coordinate information of the configuration node icon in the process configuration interface; Generate attribute information of the configuration task node corresponding to the configuration node icon; wherein the attribute information includes: the task number and coordinate information corresponding to the configuration task node; For each dependency edge, determining a target node icon and a plurality of path node icons corresponding to the dependency edge; generating dependency information corresponding to the dependency edge; wherein the dependency information includes: a task number corresponding to the target node icon and a task number corresponding to each path node icon; the dependency information corresponding to the dependency edge is dependency information corresponding to the end task node corresponding to the dependency edge; Determine the target level corresponding to the process configuration interface; combine the task numbers corresponding to the configuration node icons to generate a task node set corresponding to the target level.

8. An electronic device, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 6.

9. A computer readable medium having a computer program stored thereon, characterized in that When the program is executed by a processor, the method according to any one of claims 1 to 6 is implemented.

Citation Information

Patent Citations

  • Flow monitoring diagram display method and apparatus

    CN106485399A

  • Image generation method and device, equipment and storage medium

    CN115423898A