A method, system and medium for Web3D visualization of graph data

Abstract

The present application relates to a method, system and medium for Web3D visualization of graph data, wherein the method comprises: obtaining a preset number of visualization nodes and visualization edges from a preset graph database; calculating the pre-layout and in-and-out degree of graph data according to the visualization nodes and visualization edges, and performing force-directed graph configuration; judging whether the number of visualization nodes is greater than a preset threshold, if so, performing point fragment rendering on the visualization nodes and visualization edges, and if not, performing spherical polyhedron instantiation rendering on the visualization nodes and visualization edges. Through the present application, the problem of low efficiency in large-scale visualization of graph data is solved. Efficient visualization of large-scale graph data based on Web3D is achieved.

Description

Technical Field

[0001] The present application relates to the field of data visualization, and in particular to a method, system and medium for Web3D visualization of graph data. Background Art

[0002] In the current development of the Internet, graph databases are new database systems that efficiently process complex relational networks based on the ideas and algorithms of mathematical graph theory. Major Internet companies have stored massive graph data for analysis and search. In terms of data analysis methods, data visualization research based on Web 3D has been a hot topic in the field of business intelligence (BI) in recent years. Because graphics or images are vivid, intuitive, and rich in content, they are close to people's cognitive methods and have become an indispensable multimedia method for communication between decision makers and massive data.

[0003] From the current market situation, browser technology based on B / S is widely accepted, so most data visualization is integrated into the web system. In web visualization technology, compared with the increasingly mature 2D-based data visualization method, 3D has more available space and visualization display features. Especially in terms of graph data, 3D is easier to reflect the relationship between nodes under a large amount of data. Among them, in terms of force-directed graphs, 3D is easier to diverge than 2D, and the direct relationship line of the node is less likely to be blocked due to the relationship of one more dimension; in terms of performance, 3D has the advantage of GPU parallel computing compared to ordinary 2D canvas technology. At present, after canvas technology renders a certain content, the number of mobile frames will drop to about 10 frames (on MacBook m1 pro), while 3D is easier to render massive amounts of big data, and the performance is more than 10 times that of canvas. Therefore, if there is no corresponding method to convert various forms of data into graphic images, a large amount of information will be submerged in the ocean of data and cannot be recognized and used by people. How to develop efficient data visualization technology has become an urgent problem to be solved.

[0004] Currently, large-scale visualization of map data in related technologies suffers from low efficiency, and no effective solution has been proposed yet. Summary of the invention

[0005] The embodiments of the present application provide a method, system and medium for Web3D visualization of graph data, so as to at least solve the problem of low efficiency in large-scale visualization of graph data in the related art.

[0006] In a first aspect, an embodiment of the present application provides a method for Web3D visualization of graph data, the method comprising:

[0007] Obtain a preset number of visualization nodes and visualization edges from a preset graph database;

[0008] According to the visualization nodes and visualization edges, calculate the pre-layout and in-degree of the graph data, and perform force-directed graph configuration, wherein the in-degree is used to calculate the size of the node after rendering;

[0009] Determine whether the number of visualization nodes is greater than a preset threshold;

[0010] If yes, performing point fragment rendering on the visualization node and the visualization edge;

[0011] If not, spherical polyhedron instantiation rendering is performed on the visualization node and the visualization edge.

[0012] In some embodiments, obtaining a preset number of visualization nodes and visualization edges from a preset graph database includes:

[0013] Obtain a first preset number of first nodes from a preset graph database, and obtain a second preset number of visualized edges;

[0014] Traversing the first node, generating a node hash table with the node ID as the index;

[0015] Traversing the visualization edge to obtain a corresponding node, and according to the node and the node hash table, saving a second node that does not exist in the node hash table;

[0016] The first node and the second node are merged to obtain a visualized node.

[0017] In some embodiments, calculating the pre-layout and in-degree of graph data according to the visualization nodes and visualization edges includes:

[0018] Traversing the visualization nodes to obtain a first angle and a second angle, and calculating a pre-layout sphere radius according to the number of the visualization nodes;

[0019] In the traversal process, an adjacency list of each visualization node is generated, and the visualization edges are traversed according to the adjacency list to obtain the in-and-out degrees of the visualization nodes.

[0020] In some embodiments, performing force-directed graph configuration includes:

[0021] Configure the default centripetal force, configure the multi-body force to -100, the maximum distance of the multi-body force to 500, the easing coefficient to 0.003, the minimum stop running easing coefficient to 0.2, and the starting coefficient to 0.4.

[0022] In some embodiments, performing point fragment rendering on the visualization node and the visualization edge includes:

[0023] Calculate the scaling ratio of the visualization node in the clipping space, thereby obtaining the corresponding node size, and then render the color of the visualization node in parallel through the fragment shader;

[0024] The coordinate data of the visualization edge is loaded into the memory for rendering at one time.

[0025] In some embodiments, performing spherical polyhedron instantiation rendering on the visualization node and the visualization edge includes:

[0026] Generate a 144-faceted polyhedron based on the visualization node, divide the polyhedron to generate a 4-dimensional matrix for each visualization node, and then render the visualization node according to the 4-dimensional matrix;

[0027] The coordinate data of the visualization edge is loaded into the memory for rendering at one time.

[0028] In some embodiments, after rendering the visualization nodes and visualization edges, the method further includes:

[0029] The node where the interaction location is calculated through the front-end algorithm.

[0030] In some embodiments, calculating the node where the interaction position is located by the front-end algorithm includes:

[0031] Traverse all nodes that have been rendered to obtain the model view coordinates of the nodes after rendering;

[0032] Obtaining the size coefficient of the node after rendering through the z value of the model view coordinate;

[0033] It is determined whether the distance between the center of the node and the interaction position is within the radius of the size coefficient constraint. If so, the node is the node where the interaction position is located.

[0034] In a second aspect, an embodiment of the present application provides a system for Web3D visualization of graph data, the system comprising a data acquisition module, a data configuration module and a data rendering module;

[0035] The data acquisition module obtains a preset number of visualization nodes and visualization edges from a preset graph database;

[0036] The data configuration module calculates the pre-layout and in-degree of the graph data according to the visualization nodes and visualization edges, and performs force-directed graph configuration, wherein the in-degree is used to calculate the size of the node after rendering;

[0037] The data rendering module determines whether the number of the visualization nodes is greater than a preset threshold;

[0038] If yes, the data rendering module performs point fragment rendering on the visualization node and the visualization edge;

[0039] If not, the data rendering module performs spherical polyhedron instantiation rendering on the visualization node and the visualization edge.

[0040] In a third aspect, an embodiment of the present application provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements the method for Web3D visualization of graph data as described in the first aspect above.

[0041] Compared with the related art, the method, system and medium for Web3D visualization of graph data provided by the embodiment of the present application obtain a preset number of visualization nodes and visualization edges from a preset graph database; calculate the pre-layout and in-and-out degree of graph data according to the visualization nodes and visualization edges, and perform force-directed graph configuration; determine whether the number of visualization nodes is greater than a preset threshold, if so, perform point fragment rendering on the visualization nodes and visualization edges, if not, perform spherical polyhedron instantiation rendering on the visualization nodes and visualization edges. The problem of low efficiency in large-scale visualization of graph data is solved, and efficient visualization of large-scale graph data based on Web3D is realized. BRIEF DESCRIPTION OF THE DRAWINGS

[0042] The drawings described herein are used to provide a further understanding of the present application and constitute a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:

[0043] Figure 1 is a flowchart of the steps of the Web3D visualization method of graph data according to an embodiment of the present application;

[0044] Figure 2 is a schematic diagram of high-performance mode rendering of graph data according to an embodiment of the present application;

[0045] Figure 3 is a schematic diagram of low-performance mode rendering of graph data according to an embodiment of the present application;

[0046] Figure 4 is a structural block diagram of a graph data Web3D visualization system according to an embodiment of the present application;

[0047] Figure 5 It is a schematic diagram of the internal structure of an electronic device according to an embodiment of the present application.

[0048] Description of the accompanying drawings: 41. Data acquisition module; 42. Data configuration module; 43. Data rendering module. DETAILED DESCRIPTION

[0049] In order to make the purpose, technical solutions and advantages of the present application clearer, the present application is described and illustrated below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not intended to limit the present application. Based on the embodiments provided in the present application, all other embodiments obtained by ordinary technicians in the field without making creative work are within the scope of protection of the present application.

[0050] Obviously, the drawings described below are only some examples or embodiments of the present application. For ordinary technicians in this field, the present application can also be applied to other similar scenarios based on these drawings without creative work. In addition, it can also be understood that although the efforts made in this development process may be complicated and lengthy, for ordinary technicians in this field related to the content disclosed in this application, some changes in design, manufacturing or production based on the technical content disclosed in this application are just conventional technical means, and should not be understood as insufficient content disclosed in this application.

[0051] Reference to "embodiments" in this application means that a particular feature, structure, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those of ordinary skill in the art that the embodiments described in this application may be combined with other embodiments without conflict.

[0052] Unless otherwise defined, the technical terms or scientific terms involved in this application should be understood by people with ordinary skills in the technical field to which this application belongs. The words "one", "a", "a", "the" and the like involved in this application do not indicate a quantitative limitation, and may represent the singular or plural. The terms "include", "comprise", "have" and any of their variations involved in this application are intended to cover non-exclusive inclusions; for example, a process, method, system, product or device that includes a series of steps or modules (units) is not limited to the listed steps or units, but may also include steps or units that are not listed, or may also include other steps or units inherent to these processes, methods, products or devices. The words "connect", "connected", "coupled" and the like involved in this application are not limited to physical or mechanical connections, but may include electrical connections, whether direct or indirect. The "multiple" involved in this application refers to two or more. "And / or" describes the association relationship of associated objects, indicating that there may be three relationships, for example, "A and / or B" can represent: A exists alone, A and B exist at the same time, and B exists alone. The character " / " generally indicates that the objects before and after are in an "or" relationship. The terms "first", "second", "third", etc. involved in this application are only used to distinguish similar objects and do not represent a specific ordering of the objects.

[0053] In a method, system and medium for Web3D visualization of graph data provided by the present application, the preset graph database may be a distributed graph database that stores nodes and edges in a key-value manner and performs “edge cutting” storage, such as NebulaGraph. Taking Nebula Graph as an example:

[0054] Nebula Graph - an open source distributed graph database.

[0055] Specifically, Nebula Graph mainly consists of three modules: Query Server (computing module), StorageServer (storage module) and Meta Server (metadata management module). The three modules communicate through RPC. The architecture of Storage Server (storage module) is divided from the functional perspective. From bottom to top, it can be divided into three layers, namely kv layer (key-value library), raft layer and api layer; RPC communication refers to remote procedure call, which can usually be considered as calling a method in a remote computer process, which can be simply understood as a network communication.

[0056] Graph: The smallest logical unit of a network, which can fully describe the entities in the network, the relationships between entities, the attributes attached to the entities, and the attributes attached to the relationships between entities;

[0057] Vertex: A general term for an entity, where a vertex includes a starting point (Vertex_key_src) and an end point (Vertex_key_dst);

[0058] Edge: A general term for the relationship between entities, where an edge includes an outgoing edge (Edge_key_src_dst) and an incoming edge (Edge_key_dst_src);

[0059] Property: A property attached to a vertex or edge, whose data type can be INT, BOOL, STRING, or DOUBLE.

[0060] Graph space (Space): It can be understood as the storage unit of the relationship network. In Nebula Graph, the graph space is a logical storage unit of a graph.

[0061] Partition: A physical storage partition of Nebula Graph. A graph space contains multiple graph partitions. Each graph partition has multiple replicas (followers) and is distributed on different nodes. The consistency of the graph partitions is ensured by the Raft distributed protocol.

[0062] Graph Schema: It is a general term for models in a graph, which defines the logical structure of an entity or relational data storage. For example, if a person is an entity, the relevant attributes of a person can be defined as a graph model, which includes attributes such as name, age, gender, etc.

[0063] Tag Schema: It is a subclass of the graph model and is mainly used to define the attributes of an entity. The tag schema has a globally unique ID called Tag ID.

[0064] Edge Schema: It is another subclass of the graph model, which is mainly used to define the attributes of the relationship between entities. For example, the relationship between the entity "person" can be defined as an edge model, and its attributes include: relationship (relatives, friends, colleagues, classmates), contact time, common hobbies, etc. The edge model also has a globally unique ID, called edge type (EdgeType).

[0065] It should be noted that in Nebula Graph, the starting point (Vertex_key_src) and the outgoing edge (Edge_key_src_dst) are stored in the same graph partition (partition src ), the incoming edge (Edge_key_dst_src) and the endpoint (Vertex_key_dst) are also stored in the same graph partition (partition dst ).

[0066] Then, the query of the outgoing edge (src->dst) only needs to access the partition src Vertex_key_src, Edge_key_src_dst in the partition do not need to be accessed dst . For inbound queries (dst<-src), only partition access is required. dst Vertex_key_dst, Edge_key_dst_src in the partition do not need to be accessed src .

[0067] Redundant design of the above edges<Edge_key_src_dst,Edge_key_dst_src> This means that you only need to know one of the vertices or edges to find the other party in the same partiton. Therefore, storing one more copy of data can reduce one RPC in the corresponding query operation.

[0068] The present application embodiment provides a method for Web3D visualization of graph data. Figure 1 is a flowchart of the steps of the Web3D visualization method of graph data according to an embodiment of the present application, such as Figure 1 As shown, the method comprises the following steps:

[0069] Step S102: Obtain a preset number of visualization nodes and visualization edges from a preset graph database.

[0070] It should be noted that since the graph database stores an indefinite amount of massive data, it is necessary to sample a portion of the data as randomly as possible while ensuring network latency experience and client performance.

[0071] Specifically, MATCH(v)RETURN v limit n is used to obtain n first nodes from the graph database; MATCH()-[e]-()RETURN e limit m is used to obtain m visualization edges from the graph database.

[0072] Traverse the first node to generate a node hash table with the node ID as the index.

[0073] Traverse the visualization edge to get the corresponding node, search the node hash table according to the node's srcID and dstID, and save the second node that does not exist in the node hash table.

[0074] The specific attribute value of the second node is obtained through the fetch statement, and the first node and the second node are merged to obtain a visual node.

[0075] Step S104, calculate the pre-layout and in-degree of the graph data according to the visualized nodes and the visualized edges, and perform force-directed graph configuration, wherein the in-degree is used to calculate the size of the node after rendering.

[0076] Specifically, traverse the visualization nodes and randomly generate the first angle thelta and the second angle delta through Math.random()*Math.PI*2.

[0077] According to the number of visualization nodes, the radius of the pre-layout sphere is calculated by dividing the number of nodes by 2. Furthermore, based on the spherical coordinates, a point inside the sphere can be randomly generated by the spherical radius and two angles, and the spherical coordinates of the point are saved as node coordinates.

[0078] In the above node traversal process, an adjacency list of each visualized node is generated, and the visualized edges are traversed according to the adjacency list to obtain the in-degree and out-degree of the visualized node. Furthermore, the maximum value of the in-degree is taken, and the in-degree is normalized to 1 to 3 times the default size of the node using the maximum value, thereby generating the radius and in-degree table of the node.

[0079] Configure the default centripetal force, configure the multi-body force to -100, the maximum distance of the multi-body force to 500, configure the decay coefficient to 0.003, configure the minimum stop running decay coefficient to 0.2, and the starting coefficient to 0.4.

[0080] It should be noted that in data visualization, graphs are often used to express the information contained in the data. The graph layout algorithm can present scattered information (information is mostly carried by the relationship between points and lines) in a clear way and meet the corresponding aesthetic standards. In the graph layout algorithm model based on particle physics theory, nodes are often simulated as atoms, and the velocity and acceleration of the nodes are obtained through the gravity and repulsion between atoms, and their moving direction and distance are calculated, and finally a stable equilibrium state is reached to complete the layout. The above-mentioned force-directed graph configuration (d3-force-3d) is used to ensure that the force simulation can be stopped as soon as possible during rendering and a better layout can be obtained at the same time. Reduce CPU pressure.

[0081] Step S106, determining whether the number of visualized nodes is greater than a preset threshold.

[0082] It should be noted that this method uses three.js as the basic rendering engine library. The operation effect is guaranteed by the automatic switching mode between high performance and low performance. The high performance mode uses point fragment rendering, and the low performance mode uses spherical polyhedron instantiation rendering and adds Ponte lighting. The switching strategy is: when the number of nodes is greater than the preset threshold, such as when the number of nodes is more than 1w, the high performance mode is used, otherwise the low performance mode is used.

[0083] Step S108: If yes, point fragment rendering is performed on the visualization nodes and visualization edges.

[0084] Specifically, Figure 2 This is a schematic diagram of the high-performance mode rendering of graph data according to the embodiment of the present application. Write an independent shader for the point fragment, use the browser height as the benchmark, and use the formula height / Math.tan(fov / 2 / 180*Math.PI) to generate the scaling ratio of the visualization node in the clip space, and then obtain the corresponding node size gl_PointSize*=(scale / -mvPosition.z), and then use the parallel rendering capability of the GPU to render the colors of the visualization nodes in parallel through the fragment shader. In addition, edge jaggedness can be avoided by smoothstep(0.,0.1,(0.5-distance)).

[0085] Use Line_Segments to load the coordinate data of the visualization edge into memory for one-time rendering.

[0086] Step S110: If not, perform spherical polyhedron instantiation rendering on the visualization nodes and visualization edges.

[0087] Specifically, Figure 3 This is a schematic diagram of the low-performance mode rendering of graph data according to an embodiment of the present application. Based on the visualization node, the sphereGeometry of three.js is used to generate a 144-faceted polyhedron, and then the drawInstanceMesh feature of webGL2.0 is used to divide the polyhedron to generate a 4-dimensional matrix for each sphere (visualization node), and then the 4-dimensional matrix is ​​passed into the buffer data of the webgl context rendering pipeline for rendering the visualization node.

[0088] Use Line_Segments to load the coordinate data of the visualization edge into memory for one-time rendering.

[0089] Through steps S102 to S110 in the embodiment of the present application, the problem of low efficiency in large-scale visualization of graph data is solved, and efficient visualization of large-scale graph data based on Web3D is achieved.

[0090] In some embodiments, after rendering the visualization nodes and visualization edges, the method further includes:

[0091] The node where the interaction location is calculated through the front-end algorithm.

[0092] Specifically, all nodes that have been rendered are traversed, and the model view coordinates of the node after rendering are obtained by multiplying the camera's projection matrix and the coordinates; based on the z value of the model view coordinates, the size coefficient of the node after rendering is obtained by (node.radius as number)*scale / -mvPosition.z, where scale is obtained according to the scaling value in step S108; it is determined whether the distance between the center of the node and the interaction position is within the radius constrained by the size coefficient, and if so, the node is the node where the interaction position is located.

[0093] Optionally, before obtaining the size coefficient of the node according to the z value of the view coordinates, it can be determined whether a node has been selected and is closer to the screen than the currently traversed node. If so, the currently traversed node is not the node where the interaction position is located; if not, the above-mentioned "obtaining the size coefficient of the node according to the z value of the view coordinates" and subsequent steps are executed.

[0094] It should be noted that the interaction position can be the position pointed by the mouse, or the position contained in the interaction data input by other input devices. This solution uses the z value of the view space to filter out the nodes that need to calculate the intersection. Compared with the traditional ray detection method, it can quickly respond to the point selected by the user at a scale of 1 million nodes.

[0095] It should be noted that the steps shown in the above process or the flowchart in the accompanying drawings can be executed in a computer system such as a set of computer executable instructions, and although a logical order is shown in the flowchart, in some cases, the steps shown or described can be executed in an order different from that shown here.

[0096] The present application embodiment provides a system for Web3D visualization of graph data. Figure 4 is a structural block diagram of a graph data Web3D visualization system according to an embodiment of the present application, such as Figure 4 As shown, the system includes a data acquisition module 41, a data configuration module 42 and a data rendering module 43;

[0097] The data acquisition module 41 obtains a preset number of visualization nodes and visualization edges from a preset graph database;

[0098] The data configuration module 42 calculates the pre-layout and in-degree of the graph data according to the visualization nodes and visualization edges, and performs force-directed graph configuration, wherein the in-degree is used to calculate the size of the node after rendering;

[0099] The data rendering module 43 determines whether the number of visualization nodes is greater than a preset threshold;

[0100] If yes, the data rendering module 43 performs point fragment rendering on the visualization nodes and visualization edges;

[0101] If not, the data rendering module 43 performs spherical polyhedron instantiation rendering on the visualization nodes and visualization edges.

[0102] Through the data acquisition module 41, data configuration module 42 and data rendering module 43 in the embodiment of the present application, the problem of low efficiency in large-scale visualization of graph data is solved, and efficient visualization of large-scale graph data based on Web3D is achieved.

[0103] It should be noted that the above modules can be functional modules or program modules, and can be implemented by software or hardware. For modules implemented by hardware, the above modules can be located in the same processor; or the above modules can be located in different processors in any combination.

[0104] This embodiment further provides an electronic device, including a memory and a processor, wherein the memory stores a computer program, and the processor is configured to run the computer program to execute the steps in any one of the above method embodiments.

[0105] Optionally, the electronic device may further include a transmission device and an input / output device, wherein the transmission device is connected to the processor, and the input / output device is connected to the processor.

[0106] It should be noted that the specific examples in this embodiment can refer to the examples described in the above embodiments and optional implementation modes, and this embodiment will not be described in detail here.

[0107] In addition, in combination with the method for Web3D visualization of graph data in the above embodiments, the present application embodiment may provide a storage medium for implementation. The storage medium stores a computer program; when the computer program is executed by a processor, any of the methods for Web3D visualization of graph data in the above embodiments is implemented.

[0108] 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 via a system bus. The processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile 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 the operating system and the computer program in the non-volatile storage medium. The network interface of the computer device is used to communicate with an external terminal via a network connection. When the computer program is executed by the processor, a method for Web3D visualization of graph data is implemented. The display screen of the computer device may be a liquid crystal display screen or an electronic ink display screen, and the input device of the computer device may be a touch layer covered on the display screen, or a key, trackball or touchpad provided on the housing of the computer device, or an external keyboard, touchpad or mouse, etc.

[0109] In one embodiment, Figure 5 is a schematic diagram of the internal structure of an electronic device according to an embodiment of the present application, such as Figure 5 As shown, an electronic device is provided, which may be a server, and its internal structure diagram may be as shown in Figure 5 As shown. The electronic device includes a processor, a network interface, an internal memory and a non-volatile memory connected through an internal bus, wherein the non-volatile memory stores an operating system, a computer program and a database. The processor is used to provide computing and control capabilities, the network interface is used to communicate with an external terminal through a network connection, the internal memory is used to provide an environment for the operation of the operating system and the computer program, the computer program is executed by the processor to implement a method for Web3D visualization of graph data, and the database is used to store data.

[0110] Those skilled in the art will understand that Figure 5 The structure shown in the figure is merely a block diagram of a partial structure related to the scheme of the present application, and does not constitute a limitation on the electronic device to which the scheme of the present application is applied. The specific electronic device may include more or fewer components than shown in the figure, or combine certain components, or have a different arrangement of components.

[0111] Those skilled in the art can understand that all or part of the processes in the above-mentioned embodiment methods can be completed by instructing the relevant hardware through a computer program, and the computer program can be stored in a non-volatile computer-readable storage medium. When the computer program is executed, it can include the processes of the embodiments of the above-mentioned methods. Among them, any reference to memory, storage, database or other media used in the embodiments provided in this application can include non-volatile and / or volatile memory. Non-volatile memory may include read-only memory (ROM), programmable ROM (PROM), electrically programmable ROM (EPROM), electrically erasable programmable ROM (EEPROM) or flash memory. Volatile memory may include random access memory (RAM) or external cache memory. As an illustration and not limitation, RAM is available in many forms, such as static RAM (SRAM), dynamic RAM (DRAM), synchronous DRAM (SDRAM), double data rate SDRAM (DDRSDRAM), enhanced SDRAM (ESDRAM), synchronous link (Synchlink) DRAM (SLDRAM), memory bus (Rambus) direct RAM (RDRAM), direct memory bus dynamic RAM (DRDRAM), and memory bus dynamic RAM (RDRAM).

[0112] Those skilled in the art should understand that the technical features of the above-described embodiments may be arbitrarily combined. To make the description concise, not all possible combinations of the technical features in the above-described embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0113] The above-mentioned embodiments only express several implementation methods of the present application, and the descriptions thereof are relatively specific and detailed, but they cannot be understood as limiting the scope of the invention patent. It should be pointed out that, for a person of ordinary skill in the art, several variations and improvements can be made without departing from the concept of the present application, and these all belong to the protection scope of the present application. Therefore, the protection scope of the patent of the present application shall be subject to the attached claims.

Claims

1. A method for Web3D visualization of graph data, characterized in that: The method comprises: Obtain a preset number of visualization nodes and visualization edges from a preset graph database; Traversing the visualization nodes, and randomly generating a first angle and a second angle by Math.random()*Math.PI*2, and calculating the radius of the pre-layout sphere by dividing the number of visualization nodes by 2 according to the number of nodes; According to the visualization nodes and visualization edges, the in-degree of the graph data is calculated, and a force-directed graph configuration is performed, wherein the in-degree is used to calculate the size of the node after rendering; Determine whether the number of visualization nodes is greater than a preset threshold; If yes, the scaling ratio of the visualization node in the clipping space is calculated to obtain the corresponding node size, and then the color of the visualization node is rendered in parallel through the fragment shader; the coordinate data of the visualization edge is loaded into the memory for rendering at one time; If not, a 144-faceted polyhedron is generated based on the visualization node, the polyhedron is divided to generate a 4-dimensional matrix for each visualization node, and then the visualization node is rendered according to the 4-dimensional matrix; the coordinate data of the visualization edge is loaded into the memory for one-time rendering.

2. The method according to claim 1, characterized in that Get a preset number of visualization nodes and visualization edges from a preset graph database including: Obtain a first preset number of first nodes from a preset graph database, and obtain a second preset number of visualized edges; Traversing the first node, generating a node hash table with the node ID as the index; Traversing the visualization edge to obtain a corresponding node, and according to the node and the node hash table, saving a second node that does not exist in the node hash table; The first node and the second node are merged to obtain a visualized node.

3. The method according to claim 1, characterized in that Calculating the in-and-out degree of the graph data according to the visualization nodes and visualization edges includes: During the traversal process, an adjacency list of each visualization node is generated, and the visualization edges are traversed according to the adjacency list to obtain the in-and-out degrees of the visualization nodes.

4. The method according to claim 1, characterized in that: And perform force directed graph configuration including: Configure the default centripetal force, configure the multi-body force to -100, the maximum distance of the multi-body force to 500, the easing coefficient to 0.003, the minimum stop running easing coefficient to 0.2, and the starting coefficient to 0.

4.

5. The method according to claim 1, characterized in that: After rendering the visualization nodes and visualization edges, the method further includes: The node where the interaction location is calculated through the front-end algorithm.

6. The method according to claim 5, characterized in that The nodes where the interaction position is calculated by the front-end algorithm include: Traverse all nodes that have been rendered to obtain the model view coordinates of the nodes after rendering; Obtaining the size coefficient of the node after rendering through the z value of the model view coordinate; It is determined whether the distance between the center of the node and the interaction position is within the radius of the size coefficient constraint. If so, the node is the node where the interaction position is located.

7. A system for Web3D visualization of graph data, characterized in that: The system includes a data acquisition module, a data configuration module and a data rendering module; The data acquisition module obtains a preset number of visualization nodes and visualization edges from a preset graph database; Traversing the visualization nodes, and randomly generating a first angle and a second angle by Math.random()*Math.PI*2, and calculating the radius of the pre-layout sphere by dividing the number of visualization nodes by 2 according to the number of nodes; The data configuration module calculates the in-degree of the graph data according to the visualization nodes and visualization edges, and performs force-directed graph configuration, wherein the in-degree is used to calculate the size of the node after rendering; The data rendering module determines whether the number of the visualization nodes is greater than a preset threshold; If yes, the scaling ratio of the visualization node in the clipping space is calculated to obtain the corresponding node size, and then the color of the visualization node is rendered in parallel through the fragment shader; the coordinate data of the visualization edge is loaded into the memory for rendering at one time; If not, a 144-faceted polyhedron is generated based on the visualization node, the polyhedron is divided to generate a 4-dimensional matrix for each visualization node, and then the visualization node is rendered according to the 4-dimensional matrix; the coordinate data of the visualization edge is loaded into the memory for one-time rendering.

8. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method for Web3D visualization of graph data as described in any one of claims 1 to 6 is implemented.

Images