Graph layout method and related equipment

Abstract

The invention provides a graph layout method, which is applied to a graph layout system, the graph layout system comprises a visualization module, a layout management module and a layout calculation module, the layout management module and the layout calculation module use a shared memory to perform data interaction, and the method comprises the following steps: the visualization module receives a layout adjustment request, the layout calculation module is used for providing the adjusted graph layout parameters for the layout management module, the layout management module loads the adjusted graph layout parameters into a shared memory, and the layout calculation module obtains the adjusted graph layout parameters from the shared memory and performs at least one iterative calculation according to the adjusted graph layout parameters. The adjusted graph layout result is updated in the shared memory, the adjusted graph layout result comprises at least one of an intermediate result and a final result, and the visual module displays the adjusted graph layout result. According to the method, a layout technical scheme which is high in performance, real-time in presentation and interactive can be provided, so that the user experience when a user views a graph (especially a large-scale graph) is improved.

Description

[0001] This application claims the priority of the Chinese patent application filed with the State Intellectual Property Office on September 22, 2023, with application number 202311235023.6 and invention name “A graph layout processing method and related system”, all contents of which are incorporated by reference in this application. Technical Field

[0002] The present application relates to the field of computer technology, and in particular to a graph layout method, system, computing device, computer-readable storage medium, and computer program product. Background Art

[0003] With the advent of the information age, information visualization (infovis) can enhance the perception of information, and is therefore widely used in areas such as relationship analysis and data governance. A typical application of information visualization is graph visualization. Graph visualization specifically displays the relationship between elements through graphs to help users observe or analyze data.

[0004] The effect of graph visualization is usually related to the graph layout (the layout of elements in the graph). A good graph layout can facilitate users to conduct in-depth mining or exploration. With the development of web-based display technology, the main carrier of graph visualization has become the web. Compared with native applications, the algorithm execution efficiency of web applications is limited by JavaScript and is often not ideal. It is difficult to display large-scale interactive graphs on web pages. Summary of the invention

[0005] The present application provides a graph layout method, which realizes efficient transmission of graph layout parameters and graph layout results based on shared memory, can support real-time presentation of intermediate results, and support real-time adjustment of graph layout by users, so as to realize rapid response of user interaction. Even for large-scale graphs, it can provide high-performance, real-time presentation, and interactive layout technology solutions, thereby improving user experience. The present application also provides a graph layout system, computing device, computer-readable storage medium, and computer program product corresponding to the above-mentioned graph layout method.

[0006] In the first aspect, the present application provides a graph layout method. The method can be performed by a graph layout system. The graph layout system can be a software system. The software system can be integrated into a browser, for example, as a functional module of the browser, providing graph layout capabilities for browser-based web applications. The software system can also be independent of the browser, and the browser calls the software system to implement graph layout. The software system can be deployed on a computing device, for example, on a terminal device such as a desktop, laptop, tablet computer, smart phone (also referred to as a terminal). The computing device executes the program code of the software system, thereby executing the graph layout method of the present application. The graph layout system can also be a hardware system, for example, a computing device with a graph layout function, and when the hardware system is running, the graph layout method of the present application is executed.

[0007] Specifically, the graph layout system includes a visualization module, a layout management module and a layout calculation module. The layout management module and the layout calculation module use shared memory for data interaction. Among them, the visualization module can be the user interface main thread, the layout management module can be the graph layout working thread, and the layout calculation module can be the graph layout engine, also known as the layout calculation engine or the graph layout calculation engine. Shared memory includes but is not limited to shared memory between threads; for modules with different operating environments or execution languages ​​in the same thread, such as JavaScript and WebAssembly (WASM), the memory they share is also referred to as shared memory in this article.

[0008] The visualization module may receive a layout adjustment request, the layout adjustment request includes adjusted graph layout parameters, and then the visualization module provides the adjusted graph layout parameters to the layout management module, the layout management module loads the adjusted graph layout parameters into the shared memory, the layout calculation module obtains the adjusted graph layout parameters from the shared memory, performs at least one iterative calculation based on the adjusted graph layout parameters, and updates the adjusted graph layout result in the shared memory, the adjusted graph layout result includes at least one of the intermediate result or the final result. The visualization module displays the adjusted graph layout result.

[0009] This method is based on shared memory to achieve efficient transmission of graph layout parameters and results, and can support real-time presentation of intermediate results, as well as real-time adjustment of graph layout by users, thus achieving rapid response to user interaction. Whether it is a small-scale graph or a large-scale graph, this method can provide a high-performance, real-time presentation, and interactive layout technology solution, thereby improving the user experience when viewing graphs (especially large-scale graphs).

[0010] In some possible implementations, before the visualization module receives the layout adjustment request, the visualization module receives an access request for accessing a web page supporting graph visualization. The visualization module provides the graph layout parameters to the layout management module according to the access request. The layout management module loads the graph layout parameters into the shared memory. The layout calculation module obtains the graph layout parameters from the shared memory, performs at least one iterative calculation according to the graph layout parameters, and updates the graph layout result in the shared memory, wherein the graph layout result includes the intermediate result. The visualization module may also display the graph layout result.

[0011] In this way, the intermediate results can be displayed in real time during the graph layout process, and the user can be supported to intervene and adjust the graph layout based on the intermediate results, thereby ensuring the quality and efficiency of the graph layout.

[0012] In some possible implementations, the visualization module may also receive a query request from the user, and the visualization module queries the adjusted graph layout result in response to the query request and displays the adjusted graph layout result. In this way, the graph layout result can be queried in response to the user's needs, thereby realizing on-demand query.

[0013] In some possible implementations, the visualization module can query the adjusted graph layout result in response to the timed task, render the adjusted graph layout result, and display the rendered graph layout result. Among them, the period of the timed task can be equal to the refresh period of the browser, and the frequency of the timed task can be equal to the rendering frequency of the browser (such as the refresh frequency). In this way, it is possible to avoid the layout management module returning the result after each iterative calculation, but to query the graph layout result on demand according to the rendering frequency of the browser, etc., reduce unnecessary communication, and thus reduce resource overhead.

[0014] In some possible implementations, the visualization module may also provide a layout identifier to the layout management module. Accordingly, the visualization module may query the adjusted graph layout result corresponding to the layout identifier according to the layout identifier.

[0015] This method introduces layout identifiers to achieve layout management of different versions. In addition, when querying the layout result of the graph with the layout identifier, the layout identifier can be used for verification to prevent the result of the previous layout from being affected and ensure the accuracy of the query result.

[0016] In some possible implementations, the visualization module may send a graph layout adjustment message to the layout management module, where the graph layout adjustment message carries adjusted graph layout parameters.

[0017] By utilizing a reasonable message mechanism, this method can enable the visualization module to obtain the latest graph layout results in a timely manner when the page is refreshed, and the graph layout engine can respond to the update of graph layout parameters in real time, thereby supporting real-time display of graph layout results and real-time adjustment of graph layout parameters by users.

[0018] In some possible implementations, the layout management module may further decompose the iterative calculation task into multiple subtasks, and add the multiple subtasks to the task queue, where the subtasks are used to instruct the layout calculation module to perform at least one iterative calculation. When receiving a message from the visualization module, the layout management module adds a message event corresponding to the message to the task queue, so as to process the message when the currently executed subtask is completed.

[0019] This method breaks down long tasks into subtasks, and adds subtasks that include at least one iterative calculation to the browser's task queue. When the visualization module sends a message, the corresponding message event will be added to the task queue for message processing. After the subtask of iterative calculation is completed, the message can be processed first instead of the next calculation. This can solve the problem of layout calculation blocking leading to the inability to respond to the visualization module in a timely manner, and provide real-time interaction capabilities.

[0020] In some possible implementations, considering that the single calculation of a high-performance graph layout engine (layout calculation module) is relatively fast, and a minimum time interval (e.g., 4 milliseconds) is usually set for joining a task queue, if the time of a single layout iteration is less than 4 milliseconds, it will cause a waste of time. Based on this, the layout management module can count the time of a single iteration calculation, and determine the number of iteration calculations in the subtask according to the time of a single iteration calculation.

[0021] In this way, the execution time of the subtask can be kept just above the minimum time interval, which prevents the layout management module from being idle for too long and improves resource utilization.

[0022] In some possible implementations, the visualization module and the layout management module use shared memory to perform data exchange. Accordingly, the visualization module can provide the adjusted graph layout parameters to the layout management module through the shared memory.

[0023] This method is based on the shared memory of the browser to achieve efficient transmission of graph layout parameters and graph layout results between the visualization module (such as the user interface main thread) and the layout management module (such as the working thread), so that the visualization module can obtain the graph layout results in real time and pause or stop the layout when necessary, reducing data communication overhead, and achieving real-time presentation of graph layout results and rapid response to user interaction.

[0024] In some possible implementations, the layout calculation module can perform iterative calculations based on the target parameters after the layout management module adds a lock to the target parameters in the adjusted graph layout parameters, and update the adjusted graph layout results obtained after the iterative calculations in the shared memory. This can prevent the visualization module from reading the data being calculated, thereby ensuring data security.

[0025] In some possible implementations, the layout calculation module includes a layout calculation engine based on WebAssembly, WebGL, or WebGPU.

[0026] This method is based on the browser task mechanism and uses high-performance engines such as WebAssembly, WebGL, and WebGPU to accelerate layout calculations in a non-blocking manner in the working thread (layout management module), shortening the calculation time, thereby ensuring the response to the main thread (visualization module) and achieving real-time presentation of graph layout results and rapid response to user interactions.

[0027] In a second aspect, the present application provides a graph layout system. The graph layout system includes a visualization module, a layout management module, and a layout calculation module, wherein the layout management module and the layout calculation module use shared memory for data exchange;

[0028] The visualization module is used to receive a layout adjustment request, the layout adjustment request includes adjusted graph layout parameters, and provide the adjusted graph layout parameters to the layout management module;

[0029] The layout management module is used to load the adjusted graph layout parameters into the shared memory;

[0030] The layout calculation module is used to obtain the adjusted graph layout parameters from the shared memory, perform at least one iterative calculation according to the adjusted graph layout parameters, and update the adjusted graph layout result in the shared memory, wherein the adjusted graph layout result includes at least one of an intermediate result or a final result;

[0031] The visualization module is also used to display the adjusted graph layout result.

[0032] In some possible implementations, the visualization module is further configured to:

[0033] receiving an access request for accessing a web page supporting graph visualization;

[0034] providing graph layout parameters to the layout management module according to the access request;

[0035] The layout management module is also used for:

[0036] Loading the graph layout parameters into the shared memory;

[0037] The layout calculation module is also used for:

[0038] Acquire the graph layout parameters from the shared memory, perform at least one iterative calculation according to the graph layout parameters, and update the graph layout results in the shared memory, wherein the graph layout results include intermediate results;

[0039] The visualization module is also used for:

[0040] The graph layout result is displayed.

[0041] In some possible implementations, the visualization module is further configured to:

[0042] Receive user query requests;

[0043] In response to the query request, the adjusted graph layout result is queried and the adjusted graph layout result is displayed.

[0044] In some possible implementations, the visualization module is specifically used to:

[0045] In response to the scheduled task, querying the adjusted graph layout result;

[0046] Render the adjusted graph layout result, and display the rendered graph layout result.

[0047] In some possible implementations, the visualization module is further configured to:

[0048] Providing a layout identifier to the layout management module;

[0049] The visualization module is specifically used for:

[0050] The adjusted graph layout result corresponding to the layout identifier is queried according to the layout identifier.

[0051] In some possible implementations, the visualization module is specifically used to:

[0052] A graph layout adjustment message is sent to the layout management module, wherein the graph layout adjustment message carries the adjusted graph layout parameters.

[0053] In some possible implementations, the layout management module is further used to:

[0054] Decomposing the iterative calculation task into a plurality of subtasks, and adding the plurality of subtasks to a task queue, wherein the subtasks are used to instruct the layout calculation module to perform at least one iterative calculation;

[0055] When a message is received from the visualization module, a message event corresponding to the message is added to the task queue so that the message can be processed when the currently executed subtask is completed.

[0056] In some possible implementations, the layout management module is further used to:

[0057] The time of a single iterative calculation is counted, and the number of iterative calculations in the subtask is determined according to the time of the single iterative calculation.

[0058] In some possible implementations, the visualization module and the layout management module use a shared memory to perform data interaction, and the visualization module is specifically used to:

[0059] The adjusted graph layout parameters are provided to the layout management module through the shared memory.

[0060] In some possible implementations, the layout calculation module is specifically used to:

[0061] After the layout management module adds a lock to the target parameter in the adjusted graph layout parameter, iterative calculation is performed according to the target parameter, and the adjusted graph layout result obtained after the iterative calculation is updated in the shared memory.

[0062] In some possible implementations, the layout calculation module includes a layout calculation engine based on WebAssembly, WebGL, or WebGPU.

[0063] In a third aspect, the present application provides a computing device. The computing device includes at least one processor and at least one memory. The at least one processor and the at least one memory communicate with each other. The at least one processor is used to execute instructions stored in the at least one memory, so that the computing device performs the graph layout method described in the first aspect or any implementation of the first aspect.

[0064] In a fourth aspect, the present application provides a computer-readable storage medium, wherein the computer-readable storage medium stores instructions, wherein the instructions instruct a computing device to execute the graph layout method described in the first aspect or any one of the implementations of the first aspect.

[0065] In a fifth aspect, the present application provides a computer program product comprising instructions, which, when executed on a computing device, enables the computing device to execute the graph layout method described in the first aspect or any one of the implementations of the first aspect.

[0066] Based on the implementations provided in the above aspects, this application can also be further combined to provide more implementations. BRIEF DESCRIPTION OF THE DRAWINGS

[0067] In order to more clearly illustrate the technical method of the embodiments of the present application, the drawings required for use in the embodiments are briefly introduced below.

[0068] Figure 1A A flowchart of a graph layout method provided in this application;

[0069] Figure 1B A flowchart of another graph layout method provided for this application;

[0070] Figure 2 A schematic diagram of the architecture of a graph layout system provided in an embodiment of the present application;

[0071] Figure 3A A schematic diagram of the layout of an object relationship diagram provided in an embodiment of the present application;

[0072] Figure 3B A schematic diagram of the layout of a data asset map provided in an embodiment of the present application;

[0073] Figure 3C A schematic diagram of the layout of a bubble chart provided in an embodiment of the present application;

[0074] Figure 3D A schematic diagram of another bubble chart layout provided in an embodiment of the present application;

[0075] Figure 3E A schematic diagram of the layout of a bee map provided in an embodiment of the present application;

[0076] Figure 4 A flowchart of a graph layout method provided in an embodiment of the present application;

[0077] Figure 5 A signaling flow chart of a graph layout method for data interaction based on a message mechanism provided in an embodiment of the present application;

[0078] Figure 6 A signaling flow chart of a graph layout method for data interaction based on a shared memory mechanism provided in an embodiment of the present application;

[0079] Figure 7 A schematic diagram of the structure of a computing device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0080] The terms "first" and "second" in the embodiments of the present application are used for descriptive purposes only and should not be understood as indicating or implying relative importance or implicitly indicating the number of the indicated technical features. Therefore, the features defined as "first" and "second" may explicitly or implicitly include one or more of the features.

[0081] First, some technical terms involved in the embodiments of the present application are introduced.

[0082] Graph visualization is an information visualization technology that presents information or data through graphs. Graphs can show the relationship between elements, thereby helping users observe and analyze data. Elements can be entities extracted from data, including but not limited to names, locations, contact information, time, and Internet protocol addresses (IP). IP can be used to identify devices (such as computing devices such as servers, or network devices such as routers).

[0083] Depending on the application scenario, the graphs generated by graph visualization technology can be divided into different types. Graph visualization technology can be applied to applications that require iterative calculations. Among them, the application that requires iterative calculations can be a web-based graph visualization application, including but not limited to data asset graph applications, network structure visualization applications, object relationship analysis applications, knowledge graph applications or other force-oriented visualization applications. Accordingly, the graphs generated by the above-mentioned graph visualization technology can include object relationship graphs, data asset graphs, network topology graphs, knowledge graphs, force-oriented bubble charts, and beeswarm plots.

[0084] The core of graph visualization technology lies in graph layout. Among the technical solutions for graph layout, the most widely used are animated and interactive graph layout methods, such as Figure 1A As shown in the figure, all operations (including iterative calculation and rendering) are performed in the main thread of the user interface (UI). Since iterative calculation and rendering are in the same thread, no data transmission is required. Users can see the results of the graph layout in real time and make WYSIWYG adjustments. However, iterative calculation and rendering occupy each other's execution time. If more time is allocated to iterative calculation, it may lead to long page refresh time and display jamming; if the iterative calculation time is short and the page is refreshed frequently, it will lead to long layout time. At the same time, limited by the execution efficiency of JavaScript, this solution usually supports interactive layout of small-scale graphs.

[0085] For large-scale graphs (also referred to as large graphs), in order to speed up layout, you can use a graph layout engine to accelerate calculations, and use a graph layout worker thread (such as a graph layout Web Worker) to prevent the UI main thread from blocking interactions. Figure 1BAs shown in the figure, the user operates in the user interface, triggering a request for graph visualization. The UI main thread sends the graph layout request to the graph layout worker thread (graph layout Web Worker). The graph layout worker thread calls the high-performance graph layout engine for iterative calculations. After the graph layout engine completes the iterative calculations, it returns the results and finally completes the rendering. Although the total calculation time is shortened, the data transmission cost of large-scale graphs is high. If the graph layout results are returned in real time, it will have a serious negative impact on performance. At the same time, because the calculation of the graph layout engine in the graph layout worker thread is blocked, the graph layout worker thread cannot respond to messages from the UI main thread in a timely manner, such as layout parameter adjustments. This method is difficult to provide real-time feedback and interaction. Users can only see the final graph layout results and cannot make interactive adjustments.

[0086] In view of this, the present application provides a graph layout method. The method can be performed by a graph layout system. The graph layout system can be a software system. The software system can be integrated into a browser, for example, as a functional module of the browser, providing graph layout capabilities for browser-based web applications. The software system can also be independent of the browser, and the browser calls the software system to implement graph layout. The software system can be deployed on a computing device, for example, on a terminal device such as a desktop, laptop, tablet computer, smart phone (also referred to as a terminal). The computing device executes the program code of the software system, thereby executing the graph layout method of the present application. The graph layout system can also be a hardware system, for example, a computing device with a graph layout function, and when the hardware system is running, the graph layout method of the present application is executed.

[0087] Specifically, the graph layout system may include a visualization module (e.g., a UI main thread), a layout management module (e.g., a graph layout worker thread, also called a graph layout web worker), and a layout calculation module (e.g., a graph layout engine, also called a layout calculation engine, a graph layout calculation engine). The layout management module and the layout calculation module use shared memory for data interaction. Shared memory includes but is not limited to shared memory between threads; for modules with different operating environments or execution languages ​​in the same thread, such as JavaScript and WebAssembly (WASM), their shared memory is also referred to as shared memory in this article.

[0088] The visualization module receives a layout adjustment request, which includes adjusted graph layout parameters, and then provides the adjusted graph layout parameters to the layout management module. The layout management module loads the adjusted graph layout parameters into the shared memory, and the layout calculation module obtains the adjusted graph layout parameters from the shared memory, performs at least one iterative calculation based on the adjusted graph layout parameters, and updates the adjusted graph layout result in the shared memory, wherein the adjusted graph layout result includes at least one of the intermediate results or the final results. The visualization module displays the adjusted graph layout result.

[0089] This method is based on shared memory to achieve efficient transmission of graph layout parameters and results, and can support real-time presentation of intermediate results, as well as real-time adjustment of graph layout by users, thus achieving rapid response to user interaction. Whether it is a small-scale graph or a large-scale graph, this method can provide a high-performance, real-time presentation, and interactive layout technology solution, thereby improving the user experience when viewing graphs (especially large-scale graphs).

[0090] In order to make the technical solution of the present application clearer and easier to understand, the system architecture of the present application is introduced below with reference to the accompanying drawings.

[0091] See also Figure 2 As shown in the schematic diagram of the architecture of a graph layout system, the graph layout system 200 includes a visualization module 202, a layout management module 204, and a layout calculation module 206. Similar to the graph layout system 200, which can be a software system or a hardware system, the above modules can be software modules or hardware modules. For ease of description, this application uses the above modules as software modules for example.

[0092] The visualization module 202 is specifically a graph visualization display interface module, which is responsible for processing user interactions, such as loading graph layout results, adjusting the layout position of one or more nodes, periodically querying graph layout results (such as adjusted graph layout results, including intermediate results or final results), and displaying adjusted graph layout results. The visualization module 202 can be implemented based on HyperText Markup Language (HTML) and JavaScript, for example, a code block implemented based on HTML and JavaScript, which can implement corresponding functions through a process or thread when executed. For ease of description, this application uses a thread example, for example, the visualization module 202 can be the UI main thread.

[0093] The layout management module 204 is used to manage the layout, including starting the layout, stopping the layout, updating the graph layout parameters, and querying the graph layout results. In specific implementation, the layout management module 204 can receive and respond to messages from the visualization module 202 (such as the UI main thread) to perform layout management, such as starting the layout, stopping the layout, updating the graph layout parameters, and querying the graph layout results in response to the messages of the UI main thread. Among them, the layout management module 204 can run independently of the UI main thread in the form of a working thread (such as a Web Worker).

[0094] The layout calculation module 206 is used to perform iterative calculations to achieve graph layout. The layout calculation module 206 can be a high-performance graph layout calculation engine (also referred to as a graph layout engine, layout calculation engine). For example, the layout calculation module 206 can be a graph layout engine based on web page assembly, web graphics library (Web Graphics Library, WebGL) or web graphics processor (webgraphics processing unit, WebGPU). Taking the layout calculation module 206 as an example of a graph layout engine based on WebAssembly, the graph layout engine can be implemented based on C++ and compiled by a compilation tool into a browser executable WebAssembly code. Among them, the layout management module 204 also supports the management of the status of the layout calculation module 206.

[0095] Among them, the layout management module 204 and the layout calculation module 206 use shared memory for data interaction. Accordingly, the graph layout system 200 can support real-time adjustment of the layout based on shared memory to realize an interactive graph layout. Specifically, the visualization module 202 is used to receive a layout adjustment request, the layout adjustment request includes the adjusted graph layout parameters, and provides the adjusted graph layout parameters to the layout management module 204. The layout management module 204 is used to load the adjusted graph layout parameters into the shared memory, and the layout calculation module 206 is used to obtain the adjusted graph layout parameters from the shared memory, perform at least one iterative calculation according to the adjusted graph layout parameters, and update the adjusted graph layout results in the shared memory. The adjusted graph layout results include at least one of the intermediate results or the final results. The visualization module 202 displays the adjusted graph layout results (also called presentation layout). It should be noted that the visualization module 202 and the layout management module 204 can also use shared memory for data interaction, so that the visualization module 202 can efficiently obtain the adjusted graph layout results through the shared memory. Alternatively, the visualization module 202 and the layout management module 204 may also use a message-based mechanism to perform data interaction, which is not limited in the present application.

[0096] Based on the Web Worker multithreading and high-performance graph layout engine, the scheduled refresh of the browser page (generally at a refresh frequency of 60 Hz, that is, refreshed every 16.7 milliseconds. When the scale of the graph is large, due to rendering performance limitations, the refresh interval may be extended to several times the screen refresh time) is decoupled from the iterative calculation of the graph layout (depending on the scale of the graph, it takes about 0.2 milliseconds when the graph includes 100 nodes, and about 20 milliseconds when the graph includes 10,000 nodes). The two have their own operating cycles. At the same time, by using a reasonable message mechanism or using shared memory, the UI main thread can obtain the latest graph layout results in time when the page is refreshed, and the graph layout engine can respond to the main thread's graph layout parameter updates in real time, thereby supporting the real-time display of graph layout results and real-time adjustment of graph layout parameters by users.

[0097] In the implementation based on the message mechanism, the UI main thread can change the state of the graph layout WebWorker and query the latest layout results through different types of messages. The graph layout Web Worker can process the messages from the UI main thread and return them during the intervals of iterative calculations. In the implementation based on shared memory, the UI main thread can directly read the graph layout results in the shared memory, and can also directly modify the graph layout parameters in the shared memory to change the layout calculation state.

[0098] The graph layout method provided in this application can be applied to web-based graph visualization applications, including but not limited to data asset graph applications, network structure visualization applications, object relationship analysis applications, and knowledge graph applications. For ease of understanding, the following is an explanation with examples. In some examples, the graph layout system 200 can extract objects and start layout based on objects and the relationships between objects. During the layout process, the graph layout system 200 can display the graph layout results in real time. The user can adjust the layout based on the graph layout results displayed in real time by the graph layout system 200. The graph layout system 200 can display the adjusted object relationship graph, such as Figure 3A In other examples, the graph layout system 200 can obtain data assets, which can be data resources that can generate value and are recorded in physical or electronic form, such as file materials, electronic data, etc. The graph layout system 200 performs iterative calculations based on the data assets to perform a graph layout on the data assets to obtain a data asset map. During the graph layout process, the graph layout system 200 supports real-time adjustments by users to display a more accurate data asset map, such as Figure 3B shown.

[0099] The graph layout method provided in this application can also be applied to other force-directed graph visualization applications. Figure 3C or Figure 3DAs shown, the graph layout system 200 can support an interactive graph layout method, thereby displaying the above bubble graph to assist users in data analysis. Figure 3E As shown, the graph layout system 200 can support an interactive graph layout method, thereby displaying the above-mentioned bee graph to assist users in data analysis.

[0100] In order to make the technical solution of the present application clearer and easier to understand, the graph layout method of the present application is described in detail below in conjunction with an embodiment.

[0101] See also Figure 4 The flowchart of a graph layout method shown in FIG. 2 is applied to a graph layout system 200, and the graph layout system 200 includes a visualization module 202, a layout management module 204, and a layout calculation module 206. The layout management module 204 and the layout calculation module 206 use shared memory to perform data interaction, and the method includes:

[0102] S402: The visualization module 202 receives a layout adjustment request.

[0103] The layout adjustment request includes the adjusted graph layout parameters. The graph layout parameters include force-directed layout parameters. Among them, the force-directed layout parameters may include at least one of node parameters, force parameters or simulated annealing parameters. Among them, the node parameters may include node positions or node sizes. When initializing the layout, the node position may be the initial position of the node. Considering that the positions of some nodes are fixed, the node position may also be a fixed position. When adjusting the layout, the node position may be the adjusted position. The force parameters may include at least one of the attractive or repulsive force between nodes, the collision force between nodes, the attractive force of a node at a certain position, the centripetal force of the node, or the spring force of the edge between two nodes. The simulated annealing parameters may include but are not limited to the Markov chain length and the temperature attenuation coefficient. Simulated annealing is an optimization algorithm that effectively avoids falling into a local minimum and eventually tends to a global optimal serial structure by giving the search process a time-varying and eventually zero probability jump. Among them, the repulsive force, attractive force or collision force is calculated based on a quadtree.

[0104] Taking into account the version iteration issue, the graph layout parameters may also include a layout identifier (ID). The layout ID is usually unique and is used to uniquely identify a layout process. The layout ID is usually an integer type and can be maintained by the visualization module 202 (such as the UI main thread). In some examples, the layout ID may be an ordered number. For example, at the beginning of the layout, the layout ID may be 1. When the user triggers the layout adjustment (switching the layout), the visualization module 202 may perform mathematical operations on the layout ID, such as increasing the layout ID by 1 as a new layout ID. In other examples, the layout ID may also be a random number.

[0105] In specific implementation, the visualization module 202 can display the graph layout result through the layout interface, and the user can trigger the adjustment operation according to the graph layout result displayed by the visualization module 202 to generate a layout adjustment request. Among them, the adjustment operation can be a drag-and-drop operation based on a graphical user interface (GUI), or a command input operation based on a command user interface (CUI). Then the visualization module 202 receives the layout adjustment request from the user. It should be noted that the graph layout result can be an intermediate result or a final result. In other words, the user can adjust the layout in real time during the graph layout process, or adjust the layout after the layout is completed.

[0106] Among them, the visualization module 202 can display the graph layout result in response to the user's access request. Specifically, the visualization module 202 can first receive an access request, and the access request is used to access a web page that supports graph visualization. The visualization module 202 provides the graph layout parameters to the layout management module 204 according to the access request. The layout management module 204 loads the graph layout parameters into the shared memory, and the layout calculation module 206 obtains the graph layout parameters from the shared memory, performs at least one iterative calculation according to the graph layout parameters, and updates the graph layout results in the shared memory. Among them, the graph layout results include intermediate results or final results. The intermediate result can be an iterative calculation result that has not yet met the iteration stop condition, and the final result is an iterative calculation result that meets the iteration stop condition. The iteration stop condition can be set according to experience. For example, the iteration stop condition can be set to the number of iterations reaching n times, and n is greater than 1. Accordingly, the intermediate result can be the iterative calculation result of iteration 1, 2...n-1 times, and the final result can be the iterative calculation result of iteration n times.

[0107] S404 , the visualization module 202 provides the adjusted graph layout parameters to the layout management module 204 .

[0108] In some possible implementations, the visualization module 202 may provide the adjusted graph layout parameters to the layout management module 204 through a message mechanism. Specifically, the visualization module 202 may send a graph layout adjustment message to the layout management module 204, and the graph layout adjustment message carries the adjusted graph layout parameters.

[0109] In some other possible implementations, the visualization module 202 and the layout management module 204 use shared memory to exchange data. Accordingly, the visualization module 202 can provide the adjusted graph layout parameters to the layout management module 204 through the shared memory. For example, the visualization module 202 can write the adjusted graph layout parameters into the shared memory, and the layout management module 204 can read the adjusted graph layout parameters from the shared memory.

[0110] It should be noted that the shared memory for data interaction between the visualization module 202 and the layout management module 204 and the shared memory for data interaction between the layout management module 204 and the layout calculation module 206 can be the same shared memory, or different shared memories (for example, the visualization module 202 and the layout management module 204 can be shared memories opened separately). When the shared memory for data interaction between the visualization module 202 and the layout management module 204 and the shared memory for data interaction between the layout management module 204 and the layout calculation module 206 are different shared memories, data synchronization can also be performed between the shared memories.

[0111] S406 : The layout management module 204 loads the adjusted graph layout parameters into the shared memory.

[0112] Specifically, the layout management module 204 loads the adjusted graph layout parameters into a shared memory for data exchange with the layout calculation module 206 , so that the layout calculation module 206 can perform layout adjustment based on the adjusted graph layout parameters.

[0113] S408 . The layout calculation module 206 obtains the adjusted graph layout parameters from the shared memory, performs at least one iterative calculation according to the adjusted graph layout parameters, and updates the adjusted graph layout result in the shared memory.

[0114] Iteration is the activity of repeating a feedback process, and its purpose is usually to approach and reach the desired goal or result. Each repetition of the process is called an "iteration", and the result obtained in each iteration can be used as the initial value of the next iteration. For example, after the position and size of node A are obtained by iterative calculation in one iteration, the position and size of node B can be iteratively calculated based on the position and size of node A in the next iteration. The iterative process can also be set with an iteration stop condition. The iteration stop condition can be set to the maximum number of iterations (for example, n), or to the convergence of the iterative loss function.

[0115] In order to timely respond to the message of the visualization module 202, the layout management module 204 can decompose the iterative calculation task into multiple subtasks and add the multiple subtasks to the task queue. The subtask is used to instruct the layout calculation module 206 to perform at least one iterative calculation. When receiving a message from the visualization module 202 (such as a message for adjusting the layout or a message for querying the layout result of the graph), the layout management module 204 can add the message event corresponding to the message to the task queue so that the message can be processed when the currently executed subtask is completed.

[0116] Considering that the layout calculation module 206 is a high-performance graph layout engine, it is faster to execute a single iterative calculation, and the method of adding a task queue has a minimum time interval (for example, 4 milliseconds). If the time of a single iterative calculation is less than 4ms, splitting each iterative calculation into a subtask (a subtask includes one iterative calculation) may cause a waste of time. The layout management module 204 can count the time of a single iterative calculation and determine the number of iterative calculations in the subtask based on the time of the single iterative calculation. In this way, an appropriate number of iterative calculations can be set for the subtask, keeping the execution time of the subtask just over 4ms, and avoiding the layout management module 204 being idle for too long.

[0117] Similarly, in a solution using shared memory for data interaction, the layout management module 204 can add a lock to the target parameters in the graph layout parameters (e.g., the node positions of several nodes), and the layout calculation module 206 can perform iterative calculations according to the target parameters after the layout management module 204 adds the lock, and update the adjusted graph layout results obtained after the iterative calculation in the shared memory. Then the layout management module 204 can release the lock. During the iterative calculation process, if the visualization module 202 receives a message for querying the graph layout results or adjusting the layout, the visualization module 202 can add a lock to the corresponding position of the shared memory after the iterative calculation lock is released, and release the lock after processing the message, thereby ensuring data consistency.

[0118] In this embodiment, the above-mentioned adjusted graph layout result may be an intermediate result or a final result, and this embodiment does not limit this.

[0119] S410 , the visualization module 202 displays the adjusted graph layout result.

[0120] Specifically, after obtaining the adjusted graph layout result, such as the node position and node size calculated according to the adjusted graph layout parameters, the visualization module 202 renders the adjusted graph layout result, thereby displaying the adjusted graph layout result. It should be noted that rendering can also be performed by other modules such as the layout management module 204. After the layout management module 204 renders the adjusted graph layout result, it can return the rendering result to the visualization module 202, and the visualization module 202 displays the adjusted graph layout result according to the rendering result.

[0121] In some possible implementations, the visualization module 202 may query the adjusted graph layout result in response to a timed task. For example, the visualization module 202 may create a timed task based on the refresh frequency of the browser, and the timed task is used to refresh the page at a fixed time. In this way, the visualization module 202 may query the layout management module 204 for the adjusted graph layout result in response to the timed task. The visualization module 202 then renders the adjusted graph layout result and displays the rendered graph layout result.

[0122] In some possible implementations, the visualization module 202 may also respond to a user's query message for the graph layout result to implement a real-time interactive graph layout. Specifically, the visualization module 202 receives a query request from the user, and the visualization module 202 may query the adjusted graph layout result in response to the query request and display the adjusted graph layout result.

[0123] Considering that the frequency of layout switching may be very high, the query request may also include a layout ID. When querying the graph layout result, the visualization module 202 may also first perform a check based on the layout ID. For example, the visualization module 202 may compare the layout ID in the query request with the current layout ID. If they are consistent, the check passes, and the visualization module 202 may query the corresponding graph layout result (for example, the adjusted graph layout result). If they are inconsistent, the check fails, and the visualization module 202 may discard the query request.

[0124] Based on the above description, it can be seen that the graph layout method provided in the embodiment of the present application shares memory (for example, browser shared memory), realizes efficient transmission of graph layout parameters and graph layout results, can support real-time presentation of intermediate results, and supports real-time adjustment of graph layout by users, and realizes rapid response of user interaction. Whether it is a small-scale graph or a large-scale graph, this method can provide a high-performance, real-time presentation, and interactive layout technology solution, thereby improving the user experience when viewing the graph.

[0125] Next, combined with specific application scenarios, the graph layout method for data interaction based on the message mechanism and the graph layout method for data interaction based on shared memory are explained.

[0126] First, see Figure 5 A signaling flow chart of a graph layout method for data interaction based on a message mechanism is shown. The method may include: an initialization phase, an iterative calculation phase, a view update phase, and a layout adjustment phase.

[0127] During the initialization phase, the user can trigger the operation of accessing the web application that supports graph visualization, and send an access request (also referred to as a graph visualization request) to the visualization module 202 (such as the UI main thread). The visualization module 202 can start the layout management module for graph layout (such as the graph layout Web Worker), and send the graph layout parameters including force-directed layout parameters (node ​​position, node size; force parameters; simulated annealing parameters) and layout ID to the graph layout Web Worker through a message (such as postMessage). Among them, the above message sent during the initialization phase can also be referred to as a graph layout request, and the force-directed layout parameters and layout ID carried in the graph layout request can be in array form. In some examples, the force-directed layout parameters and layout ID can also be encapsulated in the message in object form. Compared with the object form, the array form is easier to read and can improve the interaction efficiency.

[0128] When the layout management module 204 receives the access request, it can save the layout ID and load the layout calculation module 206, for example, it can load a graph layout engine based on WebAssembly, a graph layout engine based on WebGL, or a graph layout engine based on WebGPU. The layout management module 204 loads the graph layout parameters into the shared memory (ArrayBuffer or SharedArrayBuffer, which can be applied for by the layout management module 204 or the layout calculation module 206) shared by the layout management module 204 and the layout calculation module 206 (such as the above-mentioned WebAssembly-based graph layout engine), and starts the layout calculation. Among them, the layout calculation can be at least one iterative calculation based on the graph layout parameters. The layout calculation module 206 can also return initialization completion to the layout management module 204, and the layout management module 204 can also notify the visualization module 202 to update the status to layout start.

[0129] In the iterative calculation stage, the layout management module 204 controls the calculation of the layout calculation module 206 after starting the layout, and processes the message from the visualization module 202 at the interval of the calculation. The layout calculation module 206 calculates the graph layout in an iterative calculation manner, and after each iterative calculation, the data of the corresponding node position in the memory will be updated.

[0130] The calculation of the layout calculation module 206 is blocking. When performing layout calculation, the layout management module 204 cannot respond to the request from the visualization module 202. If the layout management module 204 continuously performs layout calculation, it will not be able to respond to the message from the visualization module 202 in time. The related technology usually uses a loop such as for or while to continuously call the layout calculation module 206 (graph layout engine) for iterative calculation. At this time, the iterative calculation task is a long task (Task), and the layout management module 204 is blocked during the execution of the long task and cannot process messages.

[0131] To this end, the layout management module 204 can decompose a long task into multiple subtasks, each subtask includes at least one iterative calculation. The sum of the iterative calculation times of the subtasks is equal to the iterative calculation times of the long task. The layout management module 204 adds the subtasks separately to the Task Queue of the browser. Among them, the layout management module 204 supports multiple ways to decompose a long task into multiple subtasks, including but not limited to setInterval, setTimeout, postMessage, etc. Among them, setInterval is a method for repeatedly calling a function or executing a code snippet with a fixed time interval between each call; setTimeout is a method for calling a function or calculating an expression after a specified number of milliseconds; postMessage is a method that allows scripts from different sources to communicate effectively in an asynchronous manner to achieve cross-text document, multi-window, and cross-domain message delivery.

[0132] When the visualization module 202 sends a message, the layout management module 204 can add the message event corresponding to the message to the task queue Task Queue for message processing. After the current subtask (the subtask for iterative calculation) is completed, the layout management module 204 can give priority to processing the message instead of executing the next subtask (the next calculation). Specifically, the layout management module 204 can maintain two task queues, one task queue for iterative calculation and one task queue for processing messages. When the layout management module 204 receives a message, the corresponding message event can be added to the task queue for processing the message. After the current subtask is executed, the layout management module 204 can determine whether the task queue for processing the message is empty. If so, the next subtask is taken out from the task queue for iterative calculation for iterative calculation; if not, the message event is taken out from the task queue for processing the message, and the message is processed until the task queue for processing the message is empty, and then the next subtask is taken out from the task queue for iterative calculation for iterative calculation.

[0133] In some possible implementations, the single calculation of a high-performance graph layout engine is faster, and some of the above-mentioned ways of adding Task Queue have a minimum time interval (usually 4ms). If the time of a single iterative calculation is less than 4ms, treating an iterative calculation as a subtask can lead to a waste of time. In this regard, the layout management module 204 can count the time of a single iterative calculation. For example, the layout management module 204 can obtain the time of each iterative calculation in multiple iterative calculations, perform statistical analysis on the time of each iterative calculation in multiple iterative calculations, and obtain the time of a single iterative calculation. In some examples, the time of a single iterative calculation can be the average or median of the time of each iterative calculation in multiple iterative calculations. The layout management module 204 can determine the number of iterative calculations in the subtask based on the time of a single iterative calculation. In this way, it is possible to set an appropriate number of iterations, keep the execution time of the subtask just over 4 milliseconds (or equal to 4 milliseconds), and avoid the layout management module 204 being in an idle state for too long.

[0134] During the view update phase, the visualization module 202 receives a notification from the layout management module 204 that the layout has started, and can monitor the browser rendering. Before each browser re-renders the page, the visualization module 202 can send a query request to the layout management module 204, which is used to query the graph layout result, and the graph layout result is used for the next page refresh. The layout management module 204 can read the node position from the shared memory, and return it to the visualization module 202 through a message (such as a query result message) in combination with the layout ID currently held by itself. The visualization module 202 checks whether the layout ID in the message matches the current layout ID. If it matches, it renders according to the new node position, thereby refreshing the page. If it does not match, the visualization module 202 can ignore the message. This process allows users to observe the layout calculation process in real time.

[0135] It should be noted that rendering can be performed by the visualization module 202, or by an additional module for rendering. Among them, the additional module for rendering can be a Web Worker based on Canvas or WebGL, WebGPU rendering. This application does not limit the specific rendering method, and Scalable Vector Graphics (SVG), Canvas, WebGL, and WebGPU can all be used for rendering of graph visualization.

[0136] In the layout adjustment stage, the user can trigger the layout adjustment by dragging one or more selected nodes. Specifically, the visualization module 202 receives the user's layout adjustment request, and the layout adjustment request includes the adjusted graph layout parameters, wherein the adjusted graph layout parameters may include the adjusted node positions and the adjusted layout ID. The visualization module 202 may notify the layout management module 204 of the adjustment of the corresponding layout ID and graph layout parameters through a message (such as a layout adjustment request). The layout management module 204 receives the message and performs layout adjustment.

[0137] The layout ID is an integer type and is usually maintained by the visualization module 202. When the layout starts, the layout ID can be 1. When the layout is adjusted, the visualization module 202 can increase the layout ID by 1 as the new layout ID. The frequency of layout adjustment may be very high, and the message of the previous round of layout may not have been processed yet. In order to prevent the result of the previous round of layout from being affected, the layout ID can be used for verification. Specifically, if the layout ID in the message is greater than the held layout ID, the layout management module 204 can start a new layout. When starting a new layout, if there is currently a layout in progress, it can be ended early, and the layout calculation can be restarted with the new graph layout parameters (adjusted graph layout parameters) combined with the current graph layout results.

[0138] Furthermore, if the number of nodes requested for layout adjustment is greater than the number of nodes requested for graph layout, the layout management module 204 can call the shared memory expansion method provided by the browser to expand the shared memory. For browsers that do not provide a shared memory expansion method, the layout management module 204 can reapply for new shared memory. It should be noted that the layout management module 204 can also destroy the original shared memory, for example, after the synchronization of the current graph layout result is completed, the original shared memory is destroyed.

[0139] After each iteration calculation is completed, the layout calculation module 206 can return information on whether it is necessary to continue the iteration calculation. When the layout calculation is completed (no need to continue the iteration calculation), the layout management module 204 can stop calling the layout calculation module 206 and notify the visualization module 202 that the layout is completed (layout is finished). The layout management module 204 can also return the layout ID. After the visualization module 202 verifies the layout ID, it renders the final result and stops refreshing the page.

[0140] Next, see Figure 6 The signaling flow chart of a graph layout method for data interaction based on a shared memory mechanism is shown in FIG. Figure 5 The differences in the illustrated embodiments lie primarily in the data transmission, Figure 6The visualization module 202 and the layout management module 204 of the embodiment shown in the figure pass messages, transmit graph layout parameters and graph layout results based on shared memory (SharedArrayBuffer), and do not rely on Figure 5 The message mechanism in the illustrated embodiment. The method may include: an initialization phase, an iterative calculation phase, a view update phase, and a layout adjustment phase.

[0141] In the initialization phase, the user can trigger the operation of accessing the web application supporting graph visualization, and send an access request (also referred to as a graph visualization request) to the visualization module 202 (such as the UI main thread). The visualization module 202 can start the layout management module 204 (such as the graph layout Web Worker) for graph layout, store the graph layout parameters including the force-directed layout parameters and the layout ID in the shared memory, and provide an area in the shared memory for storing the graph layout results, and then send the address of the shared memory to the layout management module 204.

[0142] The layout management module 204 receives the address of the shared memory and uses the shared memory from the visualization module 202 to load the layout calculation module 206, such as the graph layout engine, for initialization. Considering that some graph layout engines may not support it, the layout management module 204 can separately allocate shared memory to load the layout calculation module 206. In this case, the layout management module 204 synchronizes the two shared memories as needed. For example, after each iterative calculation is completed, the layout management module 204 synchronizes, or the visualization module 202 can notify the layout management module 204 to synchronize through the shared memory flag. After the initialization is completed, the layout management module 204 can notify the visualization module 202 to update the status to layout start through the shared memory flag.

[0143] In the iterative calculation phase, the layout management module 204 calls the layout calculation module 206 for iterative calculation. Before each iterative calculation, the layout management module 204 checks the shared memory flag to determine whether the layout calculation needs to be paused or ended. If the calculation can continue, the layout management module 204 uses atomic operations to check and modify the shared memory specific flag (acquire the lock) to prevent the visualization module 202 from reading the data in the calculation, and then starts the calculation. When the iterative calculation of a subtask is completed, the corresponding shared memory specific flag is restored (release the lock).

[0144] In the view update phase, the visualization module 202 receives the layout start notification from the layout management module 204 and monitors the browser rendering. Before each browser re-renders the page, the visualization module 202 acquires the lock (waiting for the layout management module 204 to release the lock), suspends the calculation of the layout management module 204, retrieves the node position from the shared memory, and then releases the lock. The visualization module 202 can render the layout result according to the new node position, thereby refreshing the page.

[0145] During the layout adjustment phase, the user can adjust the layout by dragging one or more selected nodes. The visualization module 202 receives the user's layout adjustment request, which includes the adjusted graph layout parameters, wherein the adjusted graph layout parameters may include the adjusted node positions and the adjusted layout ID. The visualization module 202 then acquires the lock, suspends the calculation of the layout management module 204, and updates the adjusted graph layout parameters in the shared memory, and then releases the lock. The layout management module 204 can restart the layout calculation based on the adjusted graph layout parameters and the current graph layout results. If the layout management module 204 has stopped calculating, the visualization module 202 can notify the layout management module 204 to restart the iterative calculation through the shared memory flag.

[0146] The original shared memory can still be used when the layout is adjusted. When the adjusted graph layout parameters indicate that the number of nodes or edges has changed, the visualization module 202 can use the grow method to scale the size of the shared memory. For browsers that do not support the grow method, when the capacity of the shared memory cannot accommodate the layout data (graph layout parameters, graph layout results), the visualization module 202 can re-apply for the shared memory and send the address to the layout management module 204 to destroy the original shared memory.

[0147] After each iteration calculation is completed, or after the subtask is executed, the layout calculation module 206 can return information on whether it is necessary to continue the iteration calculation. When the layout calculation is completed (no need to continue the iteration calculation), the layout management module 204 can stop calling the layout calculation module 206 and notify the visualization module 202 that the layout is completed (layout is finished). The layout management module 204 can also return the layout ID. After the visualization module 202 verifies the layout ID, it renders the final result and stops refreshing the page.

[0148] Based on the above-mentioned graph layout method, the present application also provides a graph layout system. Figure 2 As shown, the diagram layout system 200 includes:

[0149] The visualization module 202 is used to receive a layout adjustment request, the layout adjustment request includes adjusted graph layout parameters, and provide the adjusted graph layout parameters to the layout management module;

[0150] A layout management module 204, used for loading the adjusted graph layout parameters into the shared memory;

[0151] A layout calculation module 206, configured to obtain the adjusted graph layout parameters from the shared memory, perform at least one iterative calculation according to the adjusted graph layout parameters, and update the adjusted graph layout result in the shared memory, wherein the adjusted graph layout result includes at least one of an intermediate result or a final result;

[0152] The visualization module 202 is also used to display the adjusted graph layout result.

[0153] Exemplarily, the visualization module 202 , the layout management module 204 , and the layout calculation module 206 may be implemented by hardware or software.

[0154] When implemented by software, the visualization module 202, the layout management module 204, and the layout calculation module 206 can be applications running on a computing device, such as a computing engine, etc. Among them, the application can be provided in the form of a virtualization service. Virtualization services may include virtual machine (VM) services, bare metal server (BMS) services, and container services. Among them, the VM service can be a service that virtualizes a virtual machine (VM) resource pool on multiple physical hosts through virtualization technology to provide users with VMs on demand for use. The BMS service is a service that virtualizes a BMS resource pool on multiple physical hosts to provide users with BMS on demand for use. The container service is a service that virtualizes a container resource pool on multiple physical hosts to provide users with containers on demand for use. VM is a simulated virtual computer, that is, a logical computer. BMS is a high-performance computing service that can be elastically scalable, and its computing performance is no different from that of a traditional physical machine, and it has the characteristics of secure physical isolation. Containers are a kernel virtualization technology that can provide lightweight virtualization to achieve the purpose of isolating user space, processes, and resources. It should be understood that the VM service, BMS service and container service in the above-mentioned virtualization services are only specific examples. In actual applications, virtualization services can also be other lightweight or heavyweight virtualization services, which are not specifically limited here.

[0155] When implemented by hardware, the visualization module 202, the layout management module 204, and the layout calculation module 206 may include at least one processor or a core of a processor, etc. Alternatively, the visualization module 202, the layout management module 204, and the layout calculation module 206 may also be implemented by using an application-specific integrated circuit (ASIC) or a programmable logic device (PLD), etc. The PLD may be a complex programmable logical device (CPLD), a field-programmable gate array (FPGA), a generic array logic (GAL), or any combination thereof.

[0156] In some possible implementations, the visualization module 202 is further configured to:

[0157] receiving an access request for accessing a web page supporting graph visualization;

[0158] providing graph layout parameters to the layout management module according to the access request;

[0159] The layout management module 204 is also used for:

[0160] Loading the graph layout parameters into the shared memory;

[0161] The layout calculation module 206 is also used for:

[0162] Acquire the graph layout parameters from the shared memory, perform at least one iterative calculation according to the graph layout parameters, and update the graph layout results in the shared memory, wherein the graph layout results include intermediate results;

[0163] The visualization module 202 is also used for:

[0164] The graph layout result is displayed.

[0165] In some possible implementations, the visualization module 202 is further configured to:

[0166] Receive user query requests;

[0167] In response to the query request, the adjusted graph layout result is queried and the adjusted graph layout result is displayed.

[0168] In some possible implementations, the visualization module 202 is specifically configured to:

[0169] In response to the scheduled task, querying the adjusted graph layout result;

[0170] Render the adjusted graph layout result, and display the rendered graph layout result.

[0171] In some possible implementations, the visualization module 202 is further configured to:

[0172] Providing a layout identifier to the layout management module;

[0173] The visualization module is specifically used for:

[0174] The adjusted graph layout result corresponding to the layout identifier is queried according to the layout identifier.

[0175] In some possible implementations, the visualization module 202 is specifically configured to:

[0176] A graph layout adjustment message is sent to the layout management module, wherein the graph layout adjustment message carries the adjusted graph layout parameters.

[0177] In some possible implementations, the layout management module 204 is further configured to:

[0178] Decomposing the iterative calculation task into a plurality of subtasks, and adding the plurality of subtasks to a task queue, wherein the subtasks are used to instruct the layout calculation module to perform at least one iterative calculation;

[0179] When a message is received from the visualization module, a message event corresponding to the message is added to the task queue so that the message can be processed when the currently executed subtask is completed.

[0180] In some possible implementations, the layout management module 204 is further configured to:

[0181] The time of a single iterative calculation is counted, and the number of iterative calculations in the subtask is determined according to the time of the single iterative calculation.

[0182] In some possible implementations, the visualization module and the layout management module use a shared memory to perform data interaction, and the visualization module is specifically used to:

[0183] The adjusted graph layout parameters are provided to the layout management module through the shared memory.

[0184] In some possible implementations, the layout calculation module 206 is specifically used to:

[0185] After the layout management module adds a lock to the target parameter in the adjusted graph layout parameter, iterative calculation is performed according to the target parameter, and the adjusted graph layout result obtained after the iterative calculation is updated in the shared memory.

[0186] In some possible implementations, the layout calculation module includes a layout calculation engine based on WebAssembly, WebGL, or WebGPU.

[0187] The present application also provides a computing device 700. Figure 7 As shown, computing device 700 includes: bus 702, processor 704, memory 706 and communication interface 708. Processor 704, memory 706 and communication interface 708 communicate through bus 702. Computing device 700 can be a server or a terminal device. It should be understood that the present application does not limit the number of processors and memories in computing device 700.

[0188] The bus 702 may be a peripheral component interconnect (PCI) bus or an extended industry standard architecture (EISA) bus. The bus may be divided into an address bus, a data bus, a control bus, etc. For ease of representation, Figure 7 The bus 702 may include a path for transmitting information between various components of the computing device 700 (eg, the memory 706, the processor 704, and the communication interface 708).

[0189] The processor 704 may include any one or more of a central processing unit (CPU), a graphics processing unit (GPU), a microprocessor (MP), or a digital signal processor (DSP).

[0190] The memory 706 may include a volatile memory, such as a random access memory (RAM). The memory 706 may also include a non-volatile memory, such as a read-only memory (ROM), a flash memory, a hard disk drive (HDD), or a solid state drive (SSD).

[0191] The memory 706 stores executable program codes, and the processor 704 executes the executable program codes to implement the aforementioned graph layout method. Specifically, the memory 706 stores instructions for the graph layout system 200 to execute the graph layout method. For example, the memory 706 stores instructions for implementing the functions of the visualization module 202, the layout management module 204, and the layout calculation module 206. The processor 704 executes the instructions for implementing the functions of the visualization module 202, thereby executing the method steps executed by the visualization module 202 in the aforementioned embodiment, the processor 704 executes the instructions for implementing the functions of the layout management module 204, thereby executing the method steps executed by the layout management module 204 in the aforementioned embodiment, and the processor 704 executes the instructions for implementing the functions of the layout calculation module 106, thereby executing the method steps executed by the layout calculation module 106 in the aforementioned embodiment.

[0192] The communication interface 708 uses a transceiver module such as, but not limited to, a network interface card or a transceiver to implement communication between the computing device 700 and other devices or communication networks.

[0193] In some possible implementations, the computing device may further include a display 709. The visualization module 202 may present a visualization interface, such as a visualization layout interface, to the user through the display 709, and receive a layout adjustment request triggered by the user through the visualization layout interface. Similarly, the visualization module 202 may also display the adjusted graph layout result (such as at least one of the intermediate result or the final result) to the user through the display 709. In specific implementation, the processor 704 executes instructions for implementing the functions of the visualization module 202, pulls up the UI main thread, and the UI main thread may output the rendered graph layout result to the display 709 for display.

[0194] The embodiment of the present application also provides a computer-readable storage medium. The computer-readable storage medium can be any available medium that can be stored by a computing device or a data storage device such as a data center that contains one or more available media. The available medium can be a magnetic medium (e.g., a floppy disk, a hard disk, a tape), an optical medium (e.g., a DVD), or a semiconductor medium (e.g., a solid-state hard disk). The computer-readable storage medium includes instructions that instruct the computing device to execute the above-mentioned method for executing the graph layout system applied to the graph layout system.

[0195] The embodiment of the present application also provides a computer program product including instructions. The computer program product may be software or a program product including instructions that can be run on a computing device or stored in any available medium. When the computer program product is run on at least one computing device, the at least one computing device executes the above-mentioned graph layout method.

[0196] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some of the technical features therein. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the protection scope of the technical solutions of the embodiments of the present invention.

Claims

1. A graph layout method, characterized in that: Applied to a graph layout system, the graph layout system includes a visualization module, a layout management module and a layout calculation module, the layout management module and the layout calculation module use shared memory to perform data interaction, and the method includes: The visualization module receives a layout adjustment request, the layout adjustment request includes adjusted graph layout parameters, and provides the adjusted graph layout parameters to the layout management module; The layout management module loads the adjusted graph layout parameters into the shared memory, the layout calculation module obtains the adjusted graph layout parameters from the shared memory, performs at least one iterative calculation according to the adjusted graph layout parameters, and updates the adjusted graph layout result in the shared memory, wherein the adjusted graph layout result includes at least one of an intermediate result or a final result; The visualization module displays the adjusted graph layout result.

2. The method according to claim 1, characterized in that Before the visualization module receives the layout adjustment request, the method further includes: The visualization module receives an access request, the access request being used to access a web page supporting graph visualization; The visualization module provides the graph layout parameters to the layout management module according to the access request; The layout management module loads the graph layout parameters into the shared memory, the layout calculation module obtains the graph layout parameters from the shared memory, performs at least one iterative calculation according to the graph layout parameters, and updates the graph layout results in the shared memory, wherein the graph layout results include intermediate results; The visualization module displays the graph layout result.

3. The method according to claim 1 or 2, characterized in that: The method further comprises: The visualization module receives a query request from a user; The visualization module queries the adjusted graph layout result in response to the query request, and displays the adjusted graph layout result.

4. The method according to claim 1 or 2, characterized in that: The visualization module displays the adjusted graph layout result, including: The visualization module queries the adjusted graph layout result in response to the scheduled task; The visualization module renders the adjusted graph layout result and displays the rendered graph layout result.

5. The method according to claim 4, characterized in that The method further comprises: The visualization module provides a layout identifier to the layout management module; The visualization module queries the adjusted graph layout result, including: The visualization module queries the adjusted graph layout result corresponding to the layout identifier according to the layout identifier.

6. The method according to any one of claims 1 to 5, characterized in that: The visualization module provides the adjusted graph layout parameters to the layout management module, including: The visualization module sends a graph layout adjustment message to the layout management module, where the graph layout adjustment message carries the adjusted graph layout parameters.

7. The method according to claim 6, characterized in that The method further comprises: The layout management module decomposes the iterative calculation task into multiple subtasks, and adds the multiple subtasks to the task queue, wherein the subtasks are used to instruct the layout calculation module to perform at least one iterative calculation; When receiving a message from the visualization module, the layout management module adds a message event corresponding to the message to the task queue, so as to process the message when the currently executed subtask is completed.

8. The method according to claim 7, characterized in that The method further comprises: The layout management module counts the time of a single iterative calculation, and determines the number of iterative calculations in the subtask according to the time of the single iterative calculation.

9. The method according to any one of claims 1 to 5, characterized in that: The visualization module and the layout management module use a shared memory to perform data interaction, and the visualization module provides the layout management module with adjusted graph layout parameters, including: The visualization module provides the adjusted graph layout parameters to the layout management module through the shared memory.

10. The method according to claim 9, characterized in that The layout calculation module performs at least one iterative calculation according to the adjusted graph layout parameters, and updates the adjusted graph layout result in the shared memory, including: After the layout management module adds a lock to the target parameter in the adjusted graph layout parameter, the layout calculation module performs iterative calculation according to the target parameter, and updates the adjusted graph layout result obtained after the iterative calculation in the shared memory.

11. The method according to any one of claims 1 to 10, characterized in that: The layout calculation module includes a layout calculation engine based on WebAssembly, WebGL or WebGPU.

12. A graph layout system, characterized in that: The graph layout system includes a visualization module, a layout management module and a layout calculation module, and the layout management module and the layout calculation module use shared memory to perform data interaction; The visualization module is used to receive a layout adjustment request, the layout adjustment request includes adjusted graph layout parameters, and provide the adjusted graph layout parameters to the layout management module; The layout management module is used to load the adjusted graph layout parameters into the shared memory; The layout calculation module is used to obtain the adjusted graph layout parameters from the shared memory, perform at least one iterative calculation according to the adjusted graph layout parameters, and update the adjusted graph layout result in the shared memory, wherein the adjusted graph layout result includes at least one of an intermediate result or a final result; The visualization module is also used to display the adjusted graph layout result.

13. The system according to claim 12, characterized in that The visualization module is also used for: receiving an access request for accessing a web page supporting graph visualization; providing graph layout parameters to the layout management module according to the access request; The layout management module is also used for: Loading the graph layout parameters into the shared memory; The layout calculation module is also used for: Acquire the graph layout parameters from the shared memory, perform at least one iterative calculation according to the graph layout parameters, and update the graph layout results in the shared memory, wherein the graph layout results include intermediate results; The visualization module is also used for: The graph layout result is displayed.

14. The system according to claim 12 or 13, characterized in that The visualization module is also used for: Receive user query requests; In response to the query request, the adjusted graph layout result is queried and the adjusted graph layout result is displayed.

15. The system according to claim 12 or 13, characterized in that The visualization module is specifically used for: In response to the scheduled task, querying the adjusted graph layout result; Render the adjusted graph layout result, and display the rendered graph layout result.

16. The system according to claim 15, characterized in that The visualization module is also used for: Providing a layout identifier to the layout management module; The visualization module is specifically used for: The adjusted graph layout result corresponding to the layout identifier is queried according to the layout identifier.

17. The system according to any one of claims 12 to 16, characterized in that: The visualization module is specifically used for: A graph layout adjustment message is sent to the layout management module, wherein the graph layout adjustment message carries the adjusted graph layout parameters.

18. The system according to claim 17, characterized in that The layout management module is also used for: Decomposing the iterative calculation task into a plurality of subtasks, and adding the plurality of subtasks to a task queue, wherein the subtasks are used to instruct the layout calculation module to perform at least one iterative calculation; When a message is received from the visualization module, a message event corresponding to the message is added to the task queue so that the message can be processed when the currently executed subtask is completed.

19. The system according to claim 18, characterized in that The layout management module is also used for: The time of a single iterative calculation is counted, and the number of iterative calculations in the subtask is determined according to the time of the single iterative calculation.

20. The system according to any one of claims 12 to 16, characterized in that The visualization module and the layout management module use shared memory to perform data interaction, and the visualization module is specifically used for: The adjusted graph layout parameters are provided to the layout management module through the shared memory.

21. The system according to claim 20, characterized in that The layout calculation module is specifically used for: After the layout management module adds a lock to the target parameter in the adjusted graph layout parameter, iterative calculation is performed according to the target parameter, and the adjusted graph layout result obtained after the iterative calculation is updated in the shared memory.

22. The system according to any one of claims 12 to 21, characterized in that The layout calculation module includes a layout calculation engine based on WebAssembly, WebGL or WebGPU.

23. A computing device, characterized in that The computing device includes at least one processor and at least one memory, wherein the at least one memory stores computer-readable instructions; the at least one processor executes the computer-readable instructions so that the computing device executes the graph layout method according to any one of claims 1 to 11.

24. A computer-readable storage medium, characterized in that: Comprising computer-readable instructions; the computer-readable instructions are used to implement the graph layout method described in any one of claims 1 to 11.

25. A computer program product, characterized in that Comprising computer-readable instructions; the computer-readable instructions are used to implement the graph layout method described in any one of claims 1 to 11.

Images