WO2023035559A1

WO2023035559A1 - Method and apparatus for implementing relationship graph, electronic device and storage medium

Info

Publication number: WO2023035559A1
Application number: PCT/CN2022/078544
Authority: WO
Inventors: 张立志; 万月亮; 冯宇波
Original assignee: 北京锐安科技有限公司
Priority date: 2021-09-07
Filing date: 2022-03-01
Publication date: 2023-03-16
Also published as: CN113722550A

Abstract

Disclosed herein are a method and apparatus for implementing a relationship graph, an electronic device, and a storage medium. The method for implementing a relationship graph comprises: receiving, by means of a graphic visualization engine, a relationship graph query request sent by a current user, the relationship graph query request carrying an identifier of a target user; on the basis of the identifier of the target user, obtaining, in a pre-constructed database, a relationship graph corresponding to the target user; and displaying, in the graphic visualization engine, the relationship graph of the target user to the current user.

Description

Realization method, device, electronic equipment and storage medium of relationship graph

This application claims the priority of the Chinese patent application with application number 202111042806.3 submitted to the China Patent Office on September 07, 2021, the entire content of which is incorporated herein by reference.

technical field

The present application relates to the technical field of relational graphs, for example, to a method, device, electronic device, and storage medium for realizing a relational graph.

Background technique

With the continuous development of network technology and computer technology, Internet applications and other network applications have become the main tools for people's life, work, and study, such as obtaining information, online entertainment, online learning, online transactions, online shopping, etc. At the same time, people will also perform related network operations when using these applications. For example, after a user inputs a search request in a search engine, the search engine can return the search result corresponding to the search request to the user. In order to make it easier for the user to obtain more relevant information and improve the user experience, the user also hopes to be able to provide the user with auxiliary information related to the network operation, such as recommendation information, relationship information, etc., after performing relevant network operations. At this time, how to generate auxiliary information related to network operations plays a very critical role.

When the auxiliary information is a person's social relationship information, graphics are often used to display the auxiliary information. The echart visualization component is generally used in graphic display, which has the following disadvantages: 1. Poor support for customization and unable to display more beautiful graphics. 2. It cannot support too many nodes. When the number of nodes exceeds 1000, the page loading is very slow, and it may take several minutes or even longer.

Contents of the invention

The present application provides a method, device, electronic device, and storage medium for realizing a relationship graph, which can provide users with a more beautiful and interactive relationship graph; moreover, the page loading performance is higher, and a relationship graph with more nodes can be supported.

This application provides a method for implementing a relationship graph, including:

Receive a relationship map query request sent by the current user through the graphic visualization engine; wherein, the relationship map query request carries the identity of the target user;

Obtaining a relationship graph corresponding to the target user in a pre-built database based on the target user's identification;

In the graphic visualization engine, the target user's relationship graph is displayed to the current user.

The present application also provides a device for implementing a relationship graph, including: a receiving module, an acquiring module, and a display module; wherein,

The receiving module is configured to receive a relationship map query request sent by a current user through a graphic visualization engine; wherein, the relationship map query request carries an identifier of a target user;

The acquiring module is configured to acquire a relationship map corresponding to the target user in a pre-built database based on the target user's identifier;

The display module is configured to display the relationship graph of the target user to the current user in the graphic visualization engine.

The present application also provides an electronic device, comprising:

one or more processors;

memory configured to store one or more programs;

When the one or more programs are executed by the one or more processors, the one or more processors are made to implement the above method for realizing the relationship graph.

The present application also provides a storage medium, on which a computer program is stored, and when the program is executed by a processor, the above method for realizing the relationship graph is realized.

Description of drawings

FIG. 1 is a schematic flowchart of a method for implementing a relationship map provided in an embodiment of the present application;

FIG. 2 is a schematic flow diagram of another implementation method of a relationship map provided by an embodiment of the present application;

FIG. 3 is a schematic structural diagram of a relationship graph provided in an embodiment of the present application;

FIG. 4 is a schematic flowchart of another implementation method of a relationship graph provided in an embodiment of the present application;

FIG. 5 is a schematic structural diagram of a device for implementing a relationship graph provided in an embodiment of the present application;

FIG. 6 is a schematic structural diagram of an electronic device provided by an embodiment of the present application.

Detailed ways

The application will be described below in conjunction with the accompanying drawings and embodiments. The specific embodiments described herein are for illustration of the application only. For ease of description, only parts relevant to the present application are shown in the drawings.

Embodiment one

Fig. 1 is a schematic flowchart of a method for implementing a relationship graph provided in an embodiment of the present application. The method can be executed by a device or an electronic device for realizing a relationship graph, and the device or electronic device can be implemented by software and/or hardware. , the device or electronic device can be integrated in any smart device with network communication function. As shown in Figure 1, the implementation method of the relationship graph may include:

S101. Receive a relationship graph query request sent by a current user through a graph visualization engine; wherein, the relationship graph query request carries an identifier of a target user.

The electronic device may receive a relationship map query request sent by the current user through the graphic visualization engine; wherein, the relationship map query request carries an identifier of a target user. The electronic device may display an input box in the graphic visualization engine; the current user may input a query request for a relationship map for the target user in the input box; the graphic visualization engine may be a G6 graphic visualization engine. The current user and the target user in this embodiment of the present application may be the same user, or may be two different users.

S102. Obtain a relationship graph corresponding to the target user in a pre-built database based on the identification of the target user.

The electronic device may acquire a relationship graph corresponding to the target user from a pre-built database based on the identification of the target user. For example, before the electronic device receives the query request of the relationship map sent by the current user through the graphic visualization engine, it can first construct the JSON data corresponding to the target user based on the predetermined JavaScript Object Notation (JavaScript Object Notation, JSON) data structure; wherein, the JSON data It includes: nodes and relationship lines; the nodes include: character nodes and relationship type nodes; and then storing JSON data corresponding to target users in the database; wherein, the database is a distributed document storage database. Distributed document storage database, referred to as MongoDB, is written in C++ language and aims to provide scalable high-performance data storage solutions for WEB applications. MongoDB is a high-performance, open-source, schema-free document database, which is one of the more popular non-relational structured query language (Not Only Structured Query Language, NoSql) databases. It can be used as an alternative to traditional relational databases or key/value stores in many scenarios.

S103. Display the relationship graph of the target user to the current user in the graphic visualization engine.

The electronic device can display the relationship graph of the target user to the current user in the graphic visualization engine. The electronic device can first define at least one division (DIVision, DIV) tag in the Body tag of the page of the hypertext markup language (HyperText Markup Language, HTML) of the graphic visualization engine as a container in the relationship map corresponding to the target user; and then based on The at least one DIV tag displays the relationship map of the target user to the current user.

The implementation method of the relationship graph proposed in the embodiment of the present application first receives the query request of the relationship graph sent by the current user through the graphic visualization engine; then obtains the relationship graph corresponding to the target user in the pre-built database based on the identity of the target user; In the visualization engine, the target user's relationship graph is displayed to the current user. That is to say, in the technical solution of the present application, the graph visualization engine can receive the query request for the relationship graph sent by the current user; and the graph visualization engine can display the target user's relationship graph to the current user. However, in related technologies, it is common to use the echart visual component to display graphics. This component has poor support for customization and cannot display more beautiful graphics; moreover, it cannot support the situation of too many nodes. Therefore, compared with related technologies, the implementation method of the relationship graph proposed in the embodiment of the present application can provide users with a more beautiful and interactive relationship graph; moreover, the page loading performance is higher, and it can support a relationship graph with more nodes ; Moreover, the technical solutions of the embodiments of the present application are simple and convenient to implement, easy to popularize, and have a wider scope of application.

Embodiment two

FIG. 2 is a schematic flowchart of another method for implementing a relationship graph provided by an embodiment of the present application. The description will be made based on the above technical solutions, and may be combined with the above optional implementation manners. As shown in Figure 2, the implementation method of the relationship map may include:

S201. Construct JSON data corresponding to the target user based on a predetermined JSON data structure; wherein, the JSON data includes: nodes and relationship lines; the nodes include: character nodes and relationship type nodes.

The electronic device can construct JSON data corresponding to the target user based on a predetermined JSON data structure; wherein, the JSON data includes: nodes and relationship lines; the nodes include: character nodes and relationship type nodes. In the example of JSON data, nodes represent the nodes in the relationship graph, and the data structure is JSON Array. Nodes are divided into two types: character nodes and relationship type nodes. edges represent the relationship lines in the relationship graph, and the data structure is JSON Array. The meaning of the nodes attribute and edges attribute can be annotated and defined in the example of JSON data.

S202. Store JSON data corresponding to the target user in a database; wherein, the database is a distributed document storage database.

The electronic device may store JSON data corresponding to the target user in a database; wherein, the database is a distributed document storage database. Because the data required by the relationship graph is JSON data, the MongoDB database is selected for storage. MongoDB is a document-oriented database that stores data as a document with a data structure of JSON, so it can support JSON data well. When adding attributes in JSON, there is no need to modify the table structure to add columns like relational databases. At the same time, MongoDB supports rich query methods. The query commands use JSON-style tags, which can easily query the JSON objects in the document.

S203. Receive, through the graph visualization engine, a relationship graph query request sent by the current user; wherein, the relationship graph query request carries an identifier of the target user.

S204. Obtain a relationship graph corresponding to the target user in a pre-built database based on the target user's identifier.

S205. Display the target user's relationship graph to the current user in the graphic visualization engine.

The electronic device can first import the JS file of G6 in the head tag of the HMTL page; then define a DIV as the container of the relational graphics in the Body tag of the HTML page, and define the unique identifier of the DIV; and then in the javascript of the page , call the function canvasRelation(id,data) to draw graphics, among the two parameters of this function, id represents the unique identifier of DIV, and data is JSON data.

FIG. 3 is a schematic structural diagram of a relationship graph provided in an embodiment of the present application. As shown in Figure 3, the relationship graph can include seven nodes; among them, there are five character nodes, namely: Zhang San, Li Si, Zhang Xiaohua, Wang Wu and Zhao Liu; there are two relationship type nodes, respectively : kinship and friendship. From the relationship map, we can know that Zhang San and Li Si are relatives; Zhang San and Zhang Xiaohua are relatives; Zhang San and Wang Wu are friends; Zhang San and Zhao Liu are friends. For example, Zhang San and Li Si are brothers; Zhang San and Zhang Xiaohua are husband and wife; Zhang San and Wang Wu are QQ friends; Zhang San and Zhao Liu are WeChat friends. Nodes of relationship type can be displayed with corresponding icons, for example, a node having a kinship relationship with Zhang San can be displayed with a kinship icon; a node with a friend relationship with Zhang San can be displayed with a friend relationship icon.

The implementation method of the relationship graph proposed in the embodiment of the present application first receives the query request of the relationship graph sent by the current user through the graphic visualization engine; then obtains the relationship graph corresponding to the target user in the pre-built database based on the identity of the target user; In the visualization engine, the target user's relationship graph is displayed to the current user. That is to say, in the technical solution of the present application, the graph visualization engine can receive the query request of the relationship map sent by the current user; and the graph visualization engine can display the target user's relationship map to the current user. However, in related technologies, it is common to use the echart visual component to display graphics. This component has poor support for customization and cannot display more beautiful graphics; moreover, it cannot support the situation of too many nodes. Therefore, compared with related technologies, the implementation method of the relationship graph proposed in the embodiment of the present application can provide users with a more beautiful and interactive relationship graph; moreover, the page loading performance is higher, and it can support a relationship graph with more nodes ; Moreover, the technical solutions of the embodiments of the present application are simple and convenient to implement, easy to popularize, and have a wider scope of application.

Embodiment three

FIG. 4 is a schematic flow chart of another method for implementing a relationship graph provided by an embodiment of the present application. The description will be made based on the above technical solutions, and may be combined with the above optional implementation manners. As shown in Figure 4, the implementation method of the relationship map may include:

S401. Receive a relationship graph query request sent by a current user through a graph visualization engine; wherein, the relationship graph query request carries an identifier of a target user.

S402. Obtain a relationship graph corresponding to the target user in a pre-built database based on the target user's identifier.

S403. In the Body tag of the hypertext markup language page of the graphic visualization engine, define at least one DIV tag as a container in the relationship map corresponding to the target user.

The electronic device may define at least one DIV tag in the Body tag of the hypertext markup language page of the graphic visualization engine as a container in the relationship map corresponding to the target user. DIV is a positioning technology in cascading style sheets, and its full name is DIVision, which is division. This can sometimes be called a layer. DIV is also called divisibility in programming, that is, an integer that only has a quotient. The DIV element is an element used to provide structure and background to block-level content within an HTML document.

S404. Display the relationship map of the target user to the current user based on the at least one DIV tag.

The electronic device can display the target user's relationship graph to the current user based on the at least one DIV tag; wherein, each DIV corresponds to an identifier (Identifier, ID) as a unique identifier of the DIV. For example, the electronic device can define a DIV tag for the input box, and a DIV tag for the display area below the input box, the former DIV tag is used to display the input box, and the latter DIV tag is used to display the relationship map.

S405. Receive, on the hypertext markup language page, a click event of the current user on the relationship graph corresponding to the target user; wherein the click event includes at least one of the following: a node click event, a node swipe event, a node swipe away, Expanding line click event, expanding line crossing event, expanding line crossing away, canvas clicking event.

The electronic device may receive a click event of the current user on the relationship map corresponding to the target user on the hypertext markup language page; wherein the click event includes at least one of the following: node click event, node swipe event, node swipe away , Expanding line click event, expanding line crossing event, expanding line crossing away, canvas clicking event. In addition, the embodiment of the present application may also support other events to make graphic interaction more friendly.

S406. In response to the click event, display the graphical interface corresponding to the click event to the current user.

The electronic device can display the corresponding graphical interface to the current user in response to the click event. For example, in response to a node click event, the electronic device can display the graphical interface corresponding to the node click event to the current user; it can also respond to the node swipe event, and display the graphical interface corresponding to the node swipe event to the current user; and so on . The embodiment of the present application can make the graphics more beautiful through custom attribute values, and define events such as click, swipe, and swipe away at the same time, making the interaction of the graphics more friendly. For example, you can click on a node to view personnel details. In addition, the page loading performance in the embodiment of the present application is relatively high. After testing, more than 1,000 nodes can all be loaded and displayed in less than one minute.

Embodiment Four

FIG. 5 is a schematic structural diagram of an apparatus for implementing a relationship graph provided in Embodiment 4 of the present application. As shown in Figure 5, the implementation device 500 of the relationship graph includes: a receiving module 501, an acquiring module 502 and a display module 503; wherein,

The receiving module 501 is configured to receive a relationship graph query request sent by the current user through a graphic visualization engine; wherein, the relationship graph query request carries an identifier of the target user; the acquisition module 502 is configured to be based on the target user Obtain the relationship graph corresponding to the target user in the pre-built database; the presentation module 503 is configured to display the target user's relationship graph to the current user in the graphic visualization engine.

The implementation device 500 of the relationship graph further includes: a storage module (not shown in the figure), configured to construct JSON data corresponding to the target user based on a predetermined JSON data structure; wherein, the JSON data includes: nodes and Relationship lines; the nodes include: character nodes and relationship type nodes; JSON data corresponding to the target user is stored in the database; wherein, the database is a distributed document storage database.

The display module 503 is configured to define at least one DIV tag in the Body tag of the hypertext markup language page of the graphic visualization engine as a container in the relationship map corresponding to the target user; based on the at least one DIV The tag displays the target user's relationship graph to the current user.

The presentation module 503 is further configured to receive a click event of the current user on the relationship map corresponding to the target user on the hypertext markup language page; wherein the click event includes at least one of the following: Node click event, node swipe event, node swipe away, line expansion click event, line expansion swipe event, line expansion swipe away, canvas click event; in response to the click event, the corresponding graphical interface will be displayed to the Current user.

The device for implementing the above relationship graph can execute the method provided by any embodiment of the present application, and has the corresponding functional modules and effects for executing the method. For technical details not exhaustively described in this embodiment, refer to the implementation method of the relationship graph provided in any embodiment of the present application.

Embodiment five

FIG. 6 is a schematic structural diagram of an electronic device provided by an embodiment of the present application. FIG. 6 shows a block diagram of an exemplary electronic device suitable for implementing embodiments of the present application. The electronic device 12 shown in FIG. 6 is only an example, and should not limit the functions and scope of use of the embodiment of the present application.

As shown in FIG. 6, electronic device 12 takes the form of a general-purpose computing device. Components of electronic device 12 may include, but are not limited to, one or more processors or processing units 16, system memory 28, bus 18 connecting various system components including system memory 28 and processing unit 16.

Bus 18 represents one or more of several types of bus structures, including a memory bus or memory controller, a peripheral bus, an accelerated graphics port, a processor, or a local bus using any of a variety of bus structures. For example, these architectures include but are not limited to Industry Standard Architecture (Industry Standard Architecture, ISA) bus, Micro Channel Architecture (Micro Channel Architecture, MAC) bus, Enhanced ISA bus, Video Electronics Standards Association (Video Electronics Standards Association, VESA) local bus and peripheral component interconnect (Peripheral Component Interconnect, PCI) bus.

Electronic device 12 includes a variety of computer system readable media. These media can be any available media that can be accessed by electronic device 12 and include both volatile and nonvolatile media, removable and non-removable media.

System memory 28 may include computer system readable media in the form of volatile memory, such as Random Access Memory (RAM) 30 and/or cache memory 32 . Electronic device 12 may include other removable/non-removable, volatile/nonvolatile computer system storage media. By way of example only, storage system 34 may be configured to read and write to non-removable, non-volatile magnetic media (not shown in FIG. 6, commonly referred to as a "hard drive"). Although not shown in FIG. 6, a disk drive for reading and writing to a removable nonvolatile disk (such as a "floppy disk") may be provided, as well as a removable nonvolatile disk (such as a Compact Disc- Read Only Memory, CD-ROM), Digital Video Disc (Digital Video Disc-Read Only Memory, DVD-ROM) or other optical media) CD-ROM drive. In these cases, each drive may be connected to bus 18 via one or more data media interfaces. The system memory 28 may include at least one program product having a set (eg, at least one) of program modules configured to perform the functions of the embodiments of the present application.

Program/utility 40 may be stored, for example, in system memory 28 as a set (at least one) of program modules 42 including, but not limited to, an operating system, one or more application programs, other program modules, and program data, each or a combination of these examples may include implementations of the network environment. The program modules 42 generally perform the functions and/or methods of the embodiments described herein.

The electronic device 12 may also communicate with one or more external devices 14 (e.g., a keyboard, pointing device, display 24, etc.), may also communicate with one or more devices that enable a user to interact with the electronic device 12, and/or communicate with Any device (eg, network card, modem, etc.) that enables the electronic device 12 to communicate with one or more other computing devices. This communication can be performed through an input/output (Input/Output, I/O) interface 22 . Moreover, the electronic device 12 can also communicate with one or more networks (such as a local area network (Local Area Network, LAN), a wide area network (Wide Area Network, WAN) and/or a public network, such as the Internet) through the network adapter 20. As shown, network adapter 20 communicates with other modules of electronic device 12 via bus 18 . It should be appreciated that although not shown in FIG. 6 , other hardware and/or software modules may be used in conjunction with electronic device 12, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, disk arrays (Redundant Arrays of Independent Disks, RAID) systems, tape drives, and data backup storage systems.

The processing unit 16 executes various functional applications and data processing by running the programs stored in the system memory 28 , for example, realizing the implementation method of the relationship graph provided in the embodiment of the present application.

Embodiment six

Embodiment 6 of the present application provides a computer storage medium.

The computer-readable storage medium in the embodiments of the present application may use any combination of one or more computer-readable media. The computer readable medium may be a computer readable signal medium or a computer readable storage medium. A computer readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. Examples (non-exhaustive list) of computer readable storage media include: electrical connection with one or more conductors, portable computer disk, hard disk, RAM, ROM, Erasable Programmable Read-Only Memory (Erasable Programmable Read-Only Memory) Memory, EPROM or flash memory), optical fiber, CD-ROM, optical storage device, magnetic storage device, or any suitable combination of the above. In this document, a computer-readable storage medium may be any tangible medium that contains or stores a program that can be used by or in conjunction with an instruction execution system, apparatus, or device.

A computer readable signal medium may include a data signal carrying computer readable program code in baseband or as part of a carrier wave. Such propagated data signals may take many forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the foregoing. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in conjunction with an instruction execution system, apparatus, or device. .

Program code embodied on a computer readable medium may be transmitted by any appropriate medium, including but not limited to wireless, wire, optical cable, radio frequency (Radio Frequency, RF), etc., or any suitable combination of the above.

Computer program code for performing the operations of the present application may be written in one or more programming languages or combinations thereof, including object-oriented programming languages—such as Java, Smalltalk, C++, and conventional Procedural Programming Language - such as "C" or a similar programming language. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. Where a remote computer is involved, the remote computer can be connected to the user computer through any kind of network, including a LAN or WAN, or it can be connected to an external computer (eg via the Internet using an Internet Service Provider).

Claims

A method for implementing a relationship graph, comprising:

Receive a relationship map query request sent by the current user through the graphic visualization engine; wherein, the relationship map query request carries the identity of the target user;

Obtaining a relationship graph corresponding to the target user in a pre-built database based on the target user's identification;

In the graphical visualization engine, the target user's relationship map is displayed to the current user.
The method according to claim 1, before receiving the query request of the relationship map sent by the current user through the graphic visualization engine, further comprising:

The JavaScript object numbered notation data corresponding to the target user is constructed based on a predetermined JavaScript object numbered notation data structure; wherein, the JavaScript object numbered notation data includes: nodes and relationship lines; the nodes include: character nodes and relationship type nodes;

The JavaScript object numbered musical notation data corresponding to the target user is stored in the database; wherein, the database is a distributed document storage database.
The method according to claim 1, wherein the displaying the relationship map of the target user to the current user in the graphic visualization engine comprises:

In the Body tag of the hypertext markup language page of the graphic visualization engine, at least one division DIV tag is defined as a container in the relationship map corresponding to the target user;

Displaying the relationship map of the target user to the current user based on the at least one DIV tag.
The method according to claim 3, further comprising:

On the page of the hypertext markup language, a click event of the current user on the relationship map corresponding to the target user is received; wherein the click event includes at least one of the following: a node click event, a node swipe event, Node swipe away, line expansion click event, line expansion swipe event, line expansion swipe away, canvas click event;

In response to the click event, display the graphical interface corresponding to the click event to the current user.
A device for implementing a relationship graph, including: a receiving module, an acquiring module, and a display module; wherein,

The receiving module is configured to receive a relationship map query request sent by a current user through a graphic visualization engine; wherein, the relationship map query request carries an identifier of a target user;

The acquiring module is configured to acquire a relationship map corresponding to the target user in a pre-built database based on the target user's identifier;

The display module is configured to display the relationship graph of the target user to the current user in the graphic visualization engine.
The device according to claim 5, wherein the device further comprises: a storage module configured to construct JavaScript object numbered notation data corresponding to the target user based on a predetermined JavaScript object numbered notation data structure; wherein the JavaScript object numbered notation The data includes: nodes and relationship lines; the nodes include: character nodes and relationship type nodes; JavaScript object numbered musical notation data corresponding to the target user is stored in the database; wherein, the database is a distributed document storage database.
The device according to claim 5, wherein the display module is configured to define at least one divided DIV tag as the relationship corresponding to the target user in the Body tag of the hypertext markup language page of the graphic visualization engine A container in the map; displaying the target user's relationship map to the current user based on the at least one DIV tag.
The device according to claim 7, wherein the display module is further configured to receive a click event of the current user on the relationship map corresponding to the target user on the hypertext markup language page; wherein, The click event includes at least one of the following: node click event, node swipe event, node swipe away, line expansion click event, line expansion swipe event, line expansion swipe away, canvas click event; in response to the click The event displays the graphical interface corresponding to the click event to the current user.
An electronic device comprising:

at least one processor;

a memory configured to store at least one program;

When the at least one program is executed by the at least one processor, the at least one processor is made to implement the method for implementing the relationship graph according to any one of claims 1 to 4.
A storage medium storing a computer program, wherein when the program is executed by a processor, the realization method of the relationship graph according to any one of claims 1 to 4 is realized.