CN115203619A - Web-based three-dimensional graph data layout method and system - Google Patents
Web-based three-dimensional graph data layout method and system Download PDFInfo
- Publication number
- CN115203619A CN115203619A CN202211114172.2A CN202211114172A CN115203619A CN 115203619 A CN115203619 A CN 115203619A CN 202211114172 A CN202211114172 A CN 202211114172A CN 115203619 A CN115203619 A CN 115203619A
- Authority
- CN
- China
- Prior art keywords
- node
- octree
- web
- graph data
- algorithm
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/25—Integrating or interfacing systems involving database management systems
- G06F16/252—Integrating or interfacing systems involving database management systems between a Database Management System and a front-end application
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/901—Indexing; Data structures therefor; Storage structures
- G06F16/9027—Trees
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Abstract
The application relates to a three-dimensional graph data layout method and a three-dimensional graph data layout system based on Web, wherein the three-dimensional graph data layout method based on Web comprises the following steps: a connection graph database, which is used for acquiring and constructing graph data from the graph database according to query statements and transmitting the graph data to an initialization function of the WebAssembly wasm; the web worker receives an algorithm operation event, continuously calls a single-step operation function of the WebAssembly wasm to execute the force guidance algorithm on the graph data, and transmits an algorithm result to a web front end to execute rendering until the operation state value of the algorithm operation event reaches a preset threshold value; by the method and the device, the problem of low layout efficiency when the three-dimensional graph data layout is carried out at the web end in the related art is solved.
Description
Technical Field
The application relates to the technical field of data visualization, in particular to a three-dimensional graph data layout method and system based on Web.
Background
The Force-Directed Graph (Force-Directed Graph) can configure nodes in a three-dimensional space, calculate the motion tracks of the nodes and connecting lines according to the action of Force, continuously reduce the energy of the nodes and the connecting lines, and finally reach a stable state with low energy. The Graph database (Graph database) does not refer to a database for storing pictures, but stores and queries data based on a data structure such as a Graph, and is a data management system which takes a point and edge-based storage unit as a design principle for efficiently storing and querying Graph data. In order to better display large-scale graph data, a three-dimensional technology is required, and a limited area is completed to contain more node information. The force-oriented spatial layout is mainly used for visualizing graph data in a three-dimensional space rapidly under a web environment, and a user can conveniently mine data hidden in a relationship.
In the conventional web three-dimensional force guide graph, d3-force-3d and d3-force-3d which are commonly used at present realize a velocity Verlet numerical integrator, are used for simulating physical motion of particles, and can simulate random motion of the physical particles according to the relationship between nodes and edges without excessive intervention. However, the algorithm has less optimization and poor running performance at the web end, thereby resulting in low layout efficiency when the three-dimensional graph data layout is performed at the web end.
Aiming at the problem that layout efficiency is low when three-dimensional graph data layout is carried out at a web end in the related art, an effective solution is not provided.
Disclosure of Invention
The embodiment of the application provides a three-dimensional graph data layout method and system based on Web, which are used for at least solving the problem of low layout efficiency when the three-dimensional graph data layout is carried out at a Web end in the related art.
In a first aspect, an embodiment of the present application provides a three-dimensional graph data layout method based on Web, which is applied to a browser;
the browser generates a web worker and transmits a WebAssembly wasm file into the web worker, wherein a force oriented algorithm is compiled in the WebAssembly wasm file, and the method comprises the following steps:
the method comprises the steps that a connection graph database is used for obtaining and constructing graph data from the graph database according to query statements, and the graph data are transmitted to an initialization function of the WebAssembly wasm;
and the web worker receives an algorithm operation event, continuously calls a single-step operation function of the WebAssembly wasm to execute the force guidance algorithm on the graph data, and transmits the algorithm result to the web front end to execute rendering until the operation state value of the algorithm operation event reaches a preset threshold value.
In some of these embodiments, the process of executing the force directing algorithm includes constructing an octree, the process of constructing an octree including:
and constructing a node memory pool of the octree, and uniformly managing generation and destruction of all nodes.
In some embodiments, after constructing the node memory pool of the octree, the constructing the octree includes traversing all nodes, and in the traversing process:
if the node has a corresponding tree node for insertion, inserting the node into the minimum-size octree of the descendant of the head node; if no corresponding tree node is available for insertion, reading or generating a new tree node from the node memory pool, and reducing the size of the octree by one time; and recursively inserting the nodes, and accumulating the coordinate values of all the sub-nodes under the current node during each insertion.
In some embodiments, after traversing all the nodes, the constructing the octree comprises: executing a depth-first search (DFS), and removing nodes with the number of descendants being zero; the center of gravity of each octree node is generated.
In some embodiments, after constructing the octree, the process of executing the force directing algorithm further comprises:
determining whether the node degree of the node is greater than a preset degree value or not according to the octree, and determining whether the distance from the node to the corresponding tree node in the octree is greater than a preset length value or not;
if yes, calculating the stress of the node according to a first stress formula of the node so as to enable the node to be close to the core area, and filtering remote point operation; otherwise, the stress of the node is calculated according to the second stress formula.
In a second aspect, an embodiment of the present application provides a three-dimensional graph data layout system based on Web, where the system includes a browser, a Web worker, a WebAssembly wasm file, and a Web front end;
the method comprises the steps that a web worker is generated by the browser, a WebAssembly wasm file is transmitted into the web worker, and a force oriented algorithm is compiled in the WebAssembly wasm file;
the browser connection graph database acquires and constructs graph data from the graph database according to query statements, and transmits the graph data to an initialization function of the WebAssembly wasm;
and the web worker receives an algorithm operation event, continuously calls a single-step operation function of the WebAssembly wasm to execute the force guidance algorithm on the graph data, and transmits the algorithm result to the web front end to execute rendering until the operation state value of the algorithm operation event reaches a preset threshold value.
In some embodiments, the step of the web worker calling the single step operation function of the WebAssembly wasm to execute the force directing algorithm on the graph data includes constructing an octree, the step of constructing the octree including:
and constructing a node memory pool of the octree, and uniformly managing generation and destruction of all nodes.
In some of these embodiments, after constructing the octree, the process of executing the force directing algorithm further comprises:
determining whether the node degree of the node is greater than a preset degree value or not according to the octree, and determining whether the distance from the node to the corresponding tree node in the octree is greater than a preset length value or not;
if yes, calculating the stress of the node according to a first stress formula of the node so as to enable the node to be close to the core area, and filtering remote point operation; otherwise, the stress of the node is calculated according to a second stress formula.
In a third aspect, an embodiment of the present application provides an electronic apparatus, which includes a memory and a processor, where the memory stores a computer program, and the processor is configured to execute the computer program to perform the method for laying out three-dimensional Web-based graph data.
In a fourth aspect, an embodiment of the present application provides a storage medium, in which a computer program is stored, where the computer program is configured to execute the method for laying out three-dimensional graph data based on Web when running.
Compared with the problem that layout efficiency is low when three-dimensional graph data layout is carried out at a web end in the related art, firstly, graph data are obtained and constructed from a graph database according to query statements through a connection graph database, and the graph data are transmitted to an initialization function of the WebAssembly wasm; the web worker receives an algorithm operation event, continuously calls a single-step operation function of the WebAssembly wap to execute the force guiding algorithm on the graph data, and transmits an algorithm result to a web front end to execute rendering until the operation state value of the algorithm operation event reaches a preset threshold value, so that the algorithm is not limited by the calculation limit of a web end JavaScript environment, the operation efficiency is improved, and the problem of low layout efficiency when the three-dimensional graph data layout is carried out at a web end in the related technology is solved;
secondly, the deployed WebAssembly is reasonably utilized, and the generation and destruction of all nodes in the WebAssembly are uniformly managed, so that the automatic Garbage Collection (GC for short) of the memory nodes is reduced, the occupied performance of a CPU (Central processing Unit) is avoided when the GC is balanced, the construction process of the octree is faster, and the problem of low layout efficiency when the three-dimensional graph data layout is carried out at a web end in the related technology is further solved;
thirdly, the process of accumulating the coordinate values of the child nodes and determining the gravity center of the octree nodes is put into the process of constructing the octree, so that backtracking operation in the process of calculating the gravity center of the octree is reduced, the number of logic iterations is reduced, useless nodes (the number of descendants is zero) are eliminated, the calculation amount is obviously reduced, the layout efficiency in the process of carrying out three-dimensional graph data layout at a web end is improved, and the problem of lower layout efficiency in the process of carrying out three-dimensional graph data layout at the web end in the related art is further solved;
in addition, the LinLog model of the points with large degrees is optimized, the node degrees are larger than the preset degree value, the distance from the node to the corresponding tree node in the octree is larger than the preset length value, and the calculation repulsion force is distinguished from the common node, so that the points with large degrees are less influenced by the stress of the remote nodes, the large nodes are prevented from deviating from the core area, the large nodes are concentrated as much as possible, the visual layout effect of the three-dimensional graph data is improved, and the super points which are often more concerned by a user are positioned in the center area of the whole visual graph.
Drawings
The accompanying drawings, which are included to provide a further understanding of the application and are incorporated in and constitute a part of this application, illustrate embodiment(s) of the application and together with the description serve to explain the application and not to limit the application. In the drawings:
FIG. 1 is a schematic diagram of a Web-based three-dimensional graph data layout method according to an embodiment of the present application;
FIG. 2 is a schematic diagram of a process for performing a single-step operation according to an embodiment of the present application;
FIG. 3 is a schematic diagram of an implementation of the force steering algorithm according to an embodiment of the present application;
fig. 4 is a schematic diagram of an internal structure of an electronic device according to an embodiment of the present application.
Detailed Description
In order to make the objects, technical solutions and advantages of the present application more apparent, the present application will be described and illustrated below with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative of the present application and are not intended to limit the present application. All other embodiments obtained by a person of ordinary skill in the art based on the embodiments provided in the present application without any inventive step are within the scope of protection of the present application.
It is obvious that the drawings in the following description are only examples or embodiments of the application, and that it is also possible for a person skilled in the art to apply the application to other similar contexts on the basis of these drawings without inventive effort. Moreover, it should be appreciated that such a development effort might be complex and tedious, but would nevertheless be a routine undertaking of design, fabrication, and manufacture for those of ordinary skill having the benefit of this disclosure, given the benefit of this disclosure, without departing from the scope of this disclosure.
Reference in the specification to "an embodiment" means that a particular feature, structure, or characteristic described in connection with the embodiment can be included in at least one embodiment of the specification. The appearances of the phrase in various places in the specification are not necessarily all referring to the same embodiment, nor are separate or alternative embodiments mutually exclusive of other embodiments. Those of ordinary skill in the art will explicitly and implicitly appreciate that the embodiments described herein may be combined with other embodiments without conflict.
Unless defined otherwise, technical or scientific terms referred to herein shall have the ordinary meaning as understood by those of ordinary skill in the art to which this application belongs. The use of the terms "a" and "an" and "the" and similar referents in the context of describing the invention (including a single reference) are to be construed in a non-limiting sense as indicating either the singular or the plural. The use of the terms "including," "comprising," "having," and any variations thereof herein, is meant to cover a non-exclusive inclusion; for example, a process, method, system, article, or apparatus that comprises a list of steps or modules (elements) is not limited to only those steps or elements but may include other steps or elements not expressly listed or inherent to such process, method, article, or apparatus. Reference to "connected," "coupled," and the like in this application is not intended to be limited to physical or mechanical connections, but rather can include electrical connections, whether direct or indirect. The term "plurality" as used herein means two or more. "and/or" describes an association relationship of associated objects, meaning that three relationships may exist, for example, "A and/or B" may mean: a exists alone, A and B exist simultaneously, and B exists alone. The character "/" generally indicates that the former and latter associated objects are in an "or" relationship. Reference herein to the terms "first," "second," "third," and the like, are merely to distinguish similar objects and do not denote a particular ordering for the objects.
The application provides a three-dimensional graph data layout method based on Web, which is applied to a browser, and before the three-dimensional graph data layout method based on the Web is executed, the following preparation work needs to be executed: generating a web worker (hereinafter referred to as the worker), and transmitting a WebAssembly wave file for compiling a force-oriented algorithm into the worker; for example, initializing the worker, enabling the worker to have the capability of sending and receiving data, acquiring a compiled WebAssembly wap file through a fetch remote file or a memory file, and caching the WebAssembly wap file in a memory; and transmitting a wasm file in the memory into the worker, and initializing a wasm instance in the worker.
Fig. 1 is a schematic diagram of a Web-based three-dimensional graph data layout method according to an embodiment of the present application, and as shown in fig. 1, the flow includes the following steps:
step S101, connecting a graph database, acquiring and constructing graph data from the graph database according to query statements, and transmitting the graph data to an initialization function of the WebAssembly wasm;
for example, a Nebula Graph is connected, a certain amount of edge data and point data are obtained through query statements, two end points on an edge and points are subjected to de-coincidence to obtain a Node array, then a Link array is obtained through edge data construction, and the data format is converted into { nodes [ ] and links [ ] in. ] }; transmitting the constructed graph data into a worker, transmitting the graph data into an initialization function of wsm in the worker, generating an initialization memory space, and simultaneously reading initialization nodes data and links data in the wsm;
step S102, the web worker receives an algorithm running event, continuously calls a single step operation function of the WebAssembly wasm to execute the force guiding algorithm on the graph data, and transmits the algorithm result to the web front end to execute rendering until the running state value of the algorithm running event reaches a preset threshold value;
for example, fig. 2 is a schematic diagram of an execution process of a single-step operation according to an embodiment of the present application, and as shown in fig. 2, when a worker receives an event of an algorithm operation, a single-step operation function in wasm is called, in the function of the single-step operation, a result of a force derivative function operation completion is processed, and a WebAssembly algorithm reduces a result data structure into a one-dimensional array and transmits the one-dimensional array to a front-end rendering; and circularly executing the single step operation steps until reaching an algorithm set threshold value and then stopping.
Through the steps S101 to S102, compared with the problem of low layout efficiency when three-dimensional graph data layout is performed at a web end in the related art, in the embodiment of the present application, graph data is obtained and constructed from the graph database according to a query statement by connecting the graph database, and the graph data is transmitted to the initialization function of the web worker, and the transmission to the web worker is equivalent to putting into a background for running, and does not occupy a thread of a current browser; and the self-decoding can be directly generated by using the WebAssembly for the browser to run, compared with a virtual machine, the running speed is higher, the web worker receives an algorithm running event, a single-step operation function of the WebAssembly wap is continuously called to execute the force guiding algorithm on the graph data, and the algorithm result is transmitted to the web front end to execute rendering until the running state value of the algorithm running event reaches a preset threshold value, so that the computation limit of a web end JavaScript environment in the prior art is not limited, the running efficiency is improved, and the problem of lower layout efficiency when the three-dimensional graph data layout is carried out at the web end in the related art is solved.
The method mainly aims to calculate the x, y and z coordinates of each Node, so that the x, y and z values of Node objects in a Node array of a result can be put into a one-dimensional digital array according to the index sequence of nodes, and then a js function is called reversely to inform data to a worker; and after receiving the data, returning the data to the front-end rendering by sending a message.
In some embodiments, fig. 3 is a schematic diagram of performing the force directing algorithm according to an embodiment of the present application, and as shown in fig. 3, the process includes:
step S301, constructing an octree for auxiliary calculation;
for example, traversing all nodes to obtain the maximum coordinate value to obtain the radius size of the octree to be calculated; constructing a node memory pool of the octree, uniformly managing generation and destruction of all nodes, multiplexing the octree node memory pool when an instance exceeds the memory pool, and generating a head node;
traversing all the nodes, inserting the nodes into the minimum-size octree of the head node descendant according to the coordinates, if no tree node for insertion exists, reading or generating a new tree node from the node memory pool, and reducing the size of the octree by one time; then recursively inserting the affected nodes and the nodes to be inserted; accumulating the coordinate values of all the subnodes under the node during each insertion and counting;
after traversing all the nodes, performing Depth-First-Search (DFS for short) once, eliminating useless nodes (the number of descendants is zero), and simultaneously generating the gravity center of each octree node, namely dividing the coordinate value of the node by the number of the descendants of the node;
through the step S301, compared with technologies such as d3-force-3d in the prior art, optimization of the prior art at the web end is less, a lot of invalid cycles are generated, and the operation performance is poor, for example, memory occupation of octree generation in the prior art is too large, extra calculation is needed for gravity center solution, readability is poor, and therefore layout efficiency is low when three-dimensional graph data layout is performed at the web end.
In addition, the algorithm of the octree in the conventional technology does not uniformly manage generation and destruction of all nodes, and the js technology used in the conventional technology when three-dimensional graph data layout is performed on a web side does not support uniform management of generation and destruction of all nodes.
The application provides pseudo code for constructing the octree, and the runtime environment library comprises: nebula Graph 3.1.0, chrome 102, golang 1.17;
the identification definition includes: node: { id: string, x: number, y: number, z: number }; link: { src: string, dst: string, id: string }; octree eNode: octree nodes; octreeNodePool: a pool of node instances of the octree;
the related logic of the pseudocode setIntoTree is as follows:
step S302, according to the octree, calculating the stress value and the coordinate value of the node;
for example, set the octree eNode of size 512, traverse each node, and start traversing from the head node of the octree; judging whether the head node distance of the current octree meets the requirement of a formula, if so, performing force operation, and then obtaining stress information of the nodes and storing the stress information into node data; if not, recursing the octree node downwards, and performing next iteration until the octree node meeting the condition is obtained or no node is obtained; in the traversing process, the memory pool is recycled from the unified OctreeNodePool memory pool, and due to the structural characteristics of the octree, points with 8^512 power of magnitude can exist when the traversing depth reaches 512, and the actual operation cannot be reached, so that the recycling safety can be ensured;
traversing all the Links in the connection relation, carrying out stress operation on the points at the two ends of the link, and adding the stress operation result to the points at the two ends; traversing all points, multiplying all the stress data on the points by the current single-step operation coefficient, and finally accumulating the stress data to the coordinate values of the nodes to obtain an operation result;
the node stress formula is shown as formula 1, the LinLog model is optimized for points with large degrees in the embodiment of the application, when the node degree of a node is larger than a preset degree value and the distance between the node and a corresponding tree node in an octree is larger than a preset length value (n.degree is larger than maxStree, l is larger than l _ max), a first formula (nonlinearity) in the formula 1 is followed, otherwise, a second formula (linearity) in the formula 1 is followed, so that the points with large degrees are less influenced by the stress of remote nodes, the large nodes are prevented from deviating from a core area, the large nodes are concentrated as much as possible, and the remote point operation is filtered according to the distance between the center of gravity and the point.
Wherein n is a node, F (n) is a repulsive force received by the node n, tree is an octree, t is a tree node in the octree, dis (n, t) is a distance from n to t, size is a cube size of the current octree node t, theta is an octree calculation accuracy constant, whether to continue the deep recursion can be adjusted, vector n represents a vector difference between two points, k is a constant coefficient of stress magnitude, l is a distance from n to t, l _ max is a maximum distance threshold constant, t.number is a total number of nodes of the octree node, n.hierarchy is a degree of the current node, maxStree is a node maximum degree threshold, and k, theta, maxStree and l _ max are configuration constants, and can be configured according to system effects;
the force formula of the node on the edge is shown as formula 2, and the node is attractive when the distance of the edge is larger and repulsive when the distance of the edge is smaller;
Wherein n is a node, F (n) is the stress of the node on the edge, link is a connecting line between the nodes, links is a connecting line set, a vector n represents the vector difference between two points, k is a stress magnitude constant coefficient, l is the current connecting line distance, and l _ max is the maximum connecting line distance constant.
The embodiment of the present application also provides a performance comparison between the embodiment of the present application and the prior art. Table 1 is a comparison table of single step operation time according to the embodiment of the present application and single step operation time according to d3-force-3 d:
TABLE 1
| d3-force-3d | This application | |
| 2w point, 2000 edge | 113ms | 60ms |
| Point 10w, edge 10w | >3s | 1s |
From table 1, it can be seen that the layout efficiency is significantly higher due to the optimized octree generation logic and the clipped octree, and the larger the data amount is, the better the optimization effect is.
In combination with the three-dimensional graph data layout method based on the Web in the foregoing embodiment, the embodiment of the present application may provide a storage medium to implement. The storage medium has a computer program stored thereon; the computer program, when executed by a processor, implements any of the Web-based three-dimensional graph data layout methods in the above embodiments.
In one embodiment, a computer device is provided, which may be a terminal. The computer device includes a processor, a memory, a network interface, a display screen, and an input device connected by a system bus. Wherein the processor of the computer device is configured to provide computing and control capabilities. The memory of the computer device comprises a nonvolatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operation of an operating system and computer programs in the non-volatile storage medium. The network interface of the computer device is used for communicating with an external terminal through a network connection. The computer program is executed by a processor to implement a Web-based three-dimensional graph data layout method. The display screen of the computer equipment can be a liquid crystal display screen or an electronic ink display screen, and the input device of the computer equipment can be a touch layer covered on the display screen, a key, a track ball or a touch pad arranged on the shell of the computer equipment, an external keyboard, a touch pad or a mouse and the like.
In one embodiment, fig. 4 is a schematic diagram of an internal structure of an electronic device according to an embodiment of the present application, and as shown in fig. 4, there is provided an electronic device, which may be a server, and its internal structure diagram may be as shown in fig. 4. The electronic device includes a processor, a network interface, an internal memory, and a non-volatile memory, which stores an operating system, a computer program, and a database, connected by an internal bus. The processor is used for providing calculation and control capability, the network interface is used for communicating with an external terminal through network connection, the internal memory is used for providing an environment for an operating system and the running of a computer program, the computer program is executed by the processor to realize a Web-based three-dimensional graph data layout method, and the database is used for storing data.
It will be appreciated by those skilled in the art that the structure shown in fig. 4 is a block diagram of only a portion of the structure associated with the present application, and does not constitute a limitation on the electronic device to which the present application applies, and that a particular electronic device may include more or fewer components than shown in the drawings, or may combine certain components, or have a different arrangement of components.
It will be understood by those skilled in the art that all or part of the processes of the methods of the embodiments described above can be implemented by hardware instructions of a computer program, which can be stored in a non-volatile computer-readable storage medium, and when executed, can include the processes of the embodiments of the methods described above. Any reference to memory, storage, database, or other medium used in the embodiments provided herein may include non-volatile and/or volatile memory, among others. Non-volatile memory can include read-only memory (ROM), programmable ROM (PROM), electrically Programmable ROM (EPROM), electrically Erasable Programmable ROM (EEPROM), or flash memory. Volatile memory can include Random Access Memory (RAM) or external cache memory. By way of illustration and not limitation, RAM is available in a variety of forms such as Static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double Data Rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous Link DRAM (SLDRAM), rambus (Rambus) direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM).
It will be understood by those skilled in the art that for simplicity of description, not all possible combinations of the various features of the embodiments described above have been described, but such combinations should be considered within the scope of the present disclosure as long as there is no conflict between such features.
The above-mentioned embodiments only express several embodiments of the present application, and the description thereof is specific and detailed, but not to be understood as limiting the scope of the invention. It should be noted that, for a person skilled in the art, several variations and modifications can be made without departing from the concept of the present application, and these are all within the scope of protection of the present application. Therefore, the protection scope of the present patent application shall be subject to the appended claims.
Claims (10)
1. A three-dimensional graph data layout method based on Web is characterized by being applied to a browser, generating a Web worker by the browser, and transmitting a WebAssembly wasm file into the Web worker, wherein a force-oriented algorithm is compiled in the WebAssembly wasm file, and the method comprises the following steps:
the connection graph database is used for acquiring and constructing graph data from the graph database according to query statements, and transmitting the graph data to an initialization function of the WebAssembly wasm;
and the web worker receives an algorithm running event, continuously calls a single step operation function of the WebAssembly wasm to execute the force guide algorithm on the graph data, and transmits an algorithm result to a web front end to execute rendering until the running state value of the algorithm running event reaches a preset threshold value.
2. The method of claim 1, wherein the process of executing the force directing algorithm comprises constructing an octree, the process of constructing an octree comprising:
and constructing a node memory pool of the octree, and uniformly managing generation and destruction of all nodes.
3. The method according to claim 2, wherein after constructing the memory pool of nodes of the octree, the constructing the octree comprises traversing all nodes, and during the traversing:
if the node has a corresponding tree node for insertion, inserting the node into the minimum-size octree of the descendant of the head node; if no corresponding tree node is available for insertion, reading or generating a new tree node from the node memory pool, and reducing the size of the octree by one time; and recursively inserting the nodes, and accumulating the coordinate values of all sub-nodes under the current node during each insertion.
4. The method of claim 3, wherein after traversing all nodes, the constructing the octree comprises: executing a depth-first search (DFS), and removing nodes with the number of descendants being zero; the center of gravity of each octree node is generated.
5. The method of claim 2, wherein after the constructing the octree, the process of executing the force directing algorithm further comprises:
determining whether the node degree of the node is greater than a preset degree value or not according to the octree, and determining whether the distance from the node to the corresponding tree node in the octree is greater than a preset length value or not;
if yes, calculating the stress of the node according to a first stress formula of the node so as to enable the node to be close to a core area, and filtering remote point operation; otherwise, the stress of the node is calculated according to a second stress formula.
6. A three-dimensional graph data layout system based on Web is characterized by comprising a browser, a Web worker, a WebAssembly wasm file and a Web front end;
the method comprises the steps that a web worker is generated by the browser, a WebAssembly wasm file is transmitted into the web worker, and a force oriented algorithm is compiled in the WebAssembly wasm file;
the browser link graph database acquires and constructs graph data from the graph database according to query statements, and transmits the graph data to an initialization function of the WebAssembly wasm;
and the web worker receives an algorithm running event, continuously calls a single step operation function of the WebAssembly wasm to execute the force guide algorithm on the graph data, and transmits an algorithm result to a web front end to execute rendering until the running state value of the algorithm running event reaches a preset threshold value.
7. The system of claim 6, wherein the web worker invokes a single step operation function of the WebAssembly wasm to perform the force directing algorithm on the graph data comprises constructing an octree, the constructing an octree comprising:
and constructing a node memory pool of the octree, and uniformly managing generation and destruction of all nodes.
8. The system of claim 7, wherein after the constructing the octree, the process of executing the force directing algorithm further comprises:
determining whether the node degree of the node is greater than a preset degree value or not according to the octree, and determining whether the distance from the node to the corresponding tree node in the octree is greater than a preset length value or not;
if yes, calculating the stress of the node according to a first stress formula of the node so as to enable the node to be close to a core area, and filtering remote point operation; otherwise, the stress of the node is calculated according to a second stress formula.
9. An electronic device comprising a memory and a processor, wherein the memory stores a computer program, and the processor is configured to execute the computer program to perform the method of laying out the Web-based three-dimensional graph data according to any one of claims 1 to 5.
10. A storage medium having stored therein a computer program, wherein the computer program is arranged to execute the method of laying out three-dimensional Web-based drawing data according to any one of claims 1 to 5 when running.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202211114172.2A CN115203619B (en) | 2022-09-14 | 2022-09-14 | Web-based three-dimensional graph data layout method and system |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202211114172.2A CN115203619B (en) | 2022-09-14 | 2022-09-14 | Web-based three-dimensional graph data layout method and system |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN115203619A true CN115203619A (en) | 2022-10-18 |
| CN115203619B CN115203619B (en) | 2022-12-27 |
Family
ID=83572341
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202211114172.2A Active CN115203619B (en) | 2022-09-14 | 2022-09-14 | Web-based three-dimensional graph data layout method and system |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN115203619B (en) |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20080238919A1 (en) * | 2007-03-27 | 2008-10-02 | Utah State University | System and method for rendering of texel imagery |
| US20130346949A1 (en) * | 2012-06-22 | 2013-12-26 | Microsoft Corporation | Adaptive rendering based on runtime capability check |
| CN106846425A (en) * | 2017-01-11 | 2017-06-13 | 东南大学 | A kind of dispersion point cloud compression method based on Octree |
| CN109631818A (en) * | 2018-12-21 | 2019-04-16 | 沈阳云奕科技有限公司 | For the headroom analysis method and device of transmission line of electricity, storage medium |
| CN110070613A (en) * | 2019-04-26 | 2019-07-30 | 东北大学 | Large-scale three dimensional scene web page display method based on model compression and asynchronous load |
| CN111797960A (en) * | 2020-07-13 | 2020-10-20 | 汪金玲 | Multithreading two-dimensional code generation algorithm based on Web Workers |
| CN113468448A (en) * | 2020-03-31 | 2021-10-01 | 腾讯科技（深圳）有限公司 | Page rendering method and device |
| CN114564630A (en) * | 2022-02-08 | 2022-05-31 | 杭州欧若数网科技有限公司 | Method, system and medium for visualizing graph data Web3D |
-
2022
- 2022-09-14 CN CN202211114172.2A patent/CN115203619B/en active Active
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20080238919A1 (en) * | 2007-03-27 | 2008-10-02 | Utah State University | System and method for rendering of texel imagery |
| US20130346949A1 (en) * | 2012-06-22 | 2013-12-26 | Microsoft Corporation | Adaptive rendering based on runtime capability check |
| CN106846425A (en) * | 2017-01-11 | 2017-06-13 | 东南大学 | A kind of dispersion point cloud compression method based on Octree |
| CN109631818A (en) * | 2018-12-21 | 2019-04-16 | 沈阳云奕科技有限公司 | For the headroom analysis method and device of transmission line of electricity, storage medium |
| CN110070613A (en) * | 2019-04-26 | 2019-07-30 | 东北大学 | Large-scale three dimensional scene web page display method based on model compression and asynchronous load |
| CN113468448A (en) * | 2020-03-31 | 2021-10-01 | 腾讯科技（深圳）有限公司 | Page rendering method and device |
| CN111797960A (en) * | 2020-07-13 | 2020-10-20 | 汪金玲 | Multithreading two-dimensional code generation algorithm based on Web Workers |
| CN114564630A (en) * | 2022-02-08 | 2022-05-31 | 杭州欧若数网科技有限公司 | Method, system and medium for visualizing graph data Web3D |
Non-Patent Citations (3)
| Title |
|---|
| 汪玲玲等: "基于插件式3D WebGIS的八叉树空间索引研究", 《东华理工大学学报(自然科学版)》 * |
| 程致远等: "面向大规模图数据的并行图布局算法", 《大数据》 * |
| 高瞻等: "渲染器与Web服务器耦合实现远程体渲染的交互优化", 《中国图象图形学报》 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN115203619B (en) | 2022-12-27 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN108268433B (en) | Title abstracting method and device based on webpage article | |
| US20120110437A1 (en) | Style and layout caching of web content | |
| US9734149B2 (en) | Clustering repetitive structure of asynchronous web application content | |
| US20120079374A1 (en) | Rendering web page text in a non-native font | |
| US9229697B2 (en) | Speculative object shapes | |
| US20060288311A1 (en) | Method, apparatus, and program product for visualizing tree structured information | |
| CN103164191B (en) | Web page element dragging method and device | |
| US20190303266A1 (en) | String transformation based trace classification and analysis | |
| US20230229704A1 (en) | Graph processing method and apparatus | |
| CN109614097A (en) | Generation method, device and the server of platform code | |
| Wang et al. | Mining maximal sub-prevalent co-location patterns | |
| CN114491172B (en) | Rapid retrieval method, device and equipment for tree structure nodes and storage medium | |
| JP2011215823A (en) | Method for determining boundary position in fluid simulation | |
| Zhang et al. | Flow chart generation-based source code similarity detection using process mining | |
| JP7389246B2 (en) | Dependency graph generation method, device, device, storage medium, and program product | |
| CN115203619B (en) | Web-based three-dimensional graph data layout method and system | |
| CN105589918B (en) | A kind of method and device for extracting page info | |
| CN111338629B (en) | Data processing method and device for building tree graph | |
| JP5612556B2 (en) | Applying a passfill algorithm when laying out text around objects | |
| Rodgers et al. | Embedding wellformed Euler diagrams | |
| CN110058849A (en) | Generation method, device, computer equipment and the storage medium of flow chart | |
| CN115563355A (en) | Nebula Graph database query method, system, electronic device and medium | |
| CN113592166A (en) | Method, apparatus, storage medium, and program product for graph retrieval | |
| Korst et al. | A visualization of family relations inspired by the london metro map | |
| CN114218210A (en) | Data processing method and device and electronic equipment |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |