A method, system and device for realizing front-end embedded image display
By receiving user-side data access requests in the front-end embedded graph display module, generating task identifiers and view names, sending them to the graph database backend, obtaining point-edge data and visually displaying, the problems of cumbersome operations and limited functions when displaying different data tables of the database in the existing technology are solved, and data analysis efficiency and front-end display effect are improved.
Patent Information
- Application Number
- CN202210485094.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2022-05-06
- Publication Date
- 2025-05-23
- Estimated Expiration
- 2042-05-06
AI Technical Summary
In the prior art, when displaying different database data tables in web applications, different types of files need to be repeatedly written, which is complicated, complicated, and limited in functions, resulting in large workloads and low efficiency for programmers and data analysts.
By receiving data access requests from the user in the front-end embedded graph display module, generating task ID TaskID and view name graphName, sending it to the graph database background, obtaining point-edge data and visually displaying it.
It realizes embedded graph display on the current page, improves data analysis efficiency, reduces the workload of repeated code writing, and improves the front-end display effect.
Smart Images

Figure CN114896527B_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of visualization technology, and in particular to a method, system and device for realizing front-end embedded graph display. Background Art
[0002] In existing web applications, when displaying different data tables in the database on a web page, each table needs to be repeatedly written in different types of files, which is a complicated process, cumbersome operation, and limited functions. In fact, when the program displays different charts in the database, there are many repeated operations, such as adding, deleting, modifying, and checking data tables, and different data tables have different properties. There are a lot of duplicate codes in various types of files for different data tables. Repeatedly writing the above files for each different data table increases the workload of programmers and data analysts and reduces work efficiency. Summary of the invention
[0003] In view of this, the present invention provides a method, system and device for realizing front-end embedded graph display, which sends a request to the graph database backend by accessing the taskId and graphName of the URL, obtains the response, obtains the point and edge data and displays it to the user, realizes the embedded graph display page on the current page, enables the user end to better perform data analysis, and thus improves the front-end display effect.
[0004] The present application provides a system for realizing front-end embedded graph display, the system comprising an embedded graph display module connected to a user end and a graph database backend;
[0005] The embedded graph display module is embedded in the application program, and is used to receive a data access request from the user end, generate a task identifier TaskID and a view name graphName through the URL link of the data access request, and send them to the graph database backend; and obtain a response from the graph database backend, and feed back the vertex and edge data from the graph database backend to the user end for visual display;
[0006] The graph database backend is used to receive messages from the embedded graph display module, perform logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message and convert them into data of point-edge relationships; and return the converted point-edge data.
[0007] Preferably, the data access request includes: user feature information, click behavior, access IP address, channel ID and timestamp;
[0008] The application program includes: website, client, and web page program supporting parsing.
[0009] Preferably, the embedded image display module includes:
[0010] The application interface layer is used to receive control instructions from the user terminal and establish a connection with the user terminal, providing an interactive interface between the system and the user terminal;
[0011] The pre-processing layer is used to obtain the data access request transmitted from the application interface layer, respond to the control instruction of the user terminal to make the user terminal jump to the page corresponding to the access address, and obtain the URL link according to the characteristic information and click behavior of the user terminal;
[0012] The analysis layer is used to generate the task identifier TaskID and the view name graphName based on the URL link of the page corresponding to the access address, and send it to the graph database backend;
[0013] The interaction layer is used to respond to the point-edge data fed back by the graph database background, visualize the point-edge data on the front end, and submit the display results to the application interface layer.
[0014] Furthermore, the application interface layer includes: a login port corresponding to the characteristic information of the user terminal, and different login ports carry corresponding channel IDs.
[0015] Furthermore, the pretreatment layer comprises:
[0016] The first acquisition unit is used to acquire the access IP address according to the page content clicked by the user terminal;
[0017] A second acquisition unit is used to acquire characteristic information of a user terminal according to preset requirements; the characteristic information of the user terminal includes technical personnel, analysis personnel or business personnel;
[0018] The third acquisition unit is used to perform parameter splicing on the access IP address and the TaskID task identifier corresponding to the characteristic information according to a preset rule to generate a URL link.
[0019] Furthermore, the analysis layer includes: a first generation module, which is used to obtain the embedded Java application provided by the graph database background when the user end is a technician, call the API interface in the operating system, obtain the point edge data through underlying calculations, generate a TaskID task identifier, and splice the relevant parameters of the TaskID task identifier in sequence to form a final displayed URL link.
[0020] Further, the analysis layer further includes: a second generation module, which is used to, when the user terminal is an analyst or a business person, input a specified condition in a page of creating a task in the embedded graph display interface to generate a URL link for the final display;
[0021] The specified conditions include scripts that control the elements, styles, and / or data content of the graphics unit, the display position of the basic elements, and the preview effect.
[0022] Preferably, the graph database backend includes: an acquisition module, used to acquire a graph name graphName and a task identifier TaskID corresponding to the URL link;
[0023] The processing module is used to obtain the specified template type through the view name graphName, obtain the corresponding vertex-edge data through the task identifier TaskID, and write the vertex-edge data into the template of the corresponding type as response information.
[0024] A method for realizing front-end embedded graph display, the method comprising:
[0025] The embedded graph display module receives the data access request from the user, generates the task identifier TaskID and the view name graphName through the URL link of the data access request, and sends them to the graph database backend;
[0026] The graph database backend receives a message from the embedded graph display module, performs logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message to convert the data into point-edge relationship data, and returns the converted point-edge data;
[0027] The embedded graph display module obtains the response from the graph database background, and feeds back the point-edge data from the graph database background to the user end for visual display.
[0028] A device for implementing front-end embedded graphic display, comprising a processor, an input device, an output device and a memory, wherein the processor, input device, output device and memory are interconnected, wherein the memory is used to store a computer program, the computer program includes program instructions, and the processor is configured to call the program instructions to execute the method described above.
[0029] The beneficial effects of the present invention are embodied in:
[0030] The present invention provides an embedded graph display module and a graph database backend that establish a connection with a user terminal; the embedded graph display module is embedded in an application program, and is used to receive a data access request from the user terminal, generate a task identifier TaskID and a view name graphName through a URL link of the data access request, send the task identifier TaskID and a view name graphName to the graph database backend, and obtain a response from the graph database backend; the graph database backend receives a message from the embedded graph display module, performs logical processing based on the relevant parameters of the task identifier TaskID and the view name graphName contained in the message, converts the data into point-edge relationship data, and returns the data. The embedded graph display module feeds back the point-edge data to the user terminal for visual display. This improves the existing web application program, which requires repeated writing of different types of files when displaying different data charts in the database on a web page, resulting in cumbersome operations, limited functions, and other problems.
[0031] Embedded graph display is independent of general graph display function. The display web page is accessed through a fixed URL address. Data is obtained and the page is rendered through http access, which improves the flexibility of data access and the embedded graph display effect on the front end. It reduces the workload of data reading for technicians and analysts and effectively improves work efficiency. BRIEF DESCRIPTION OF THE DRAWINGS
[0032] In order to more clearly illustrate the specific embodiments of the present invention or the technical solutions in the prior art, the following is a brief introduction to the drawings required for the specific embodiments or the description of the prior art. In all the drawings, similar elements or parts are generally identified by similar reference numerals. In the drawings, the elements or parts are not necessarily drawn according to the actual scale.
[0033] Figure 1 A flow chart of a method for realizing front-end embedded image display provided by the present invention;
[0034] Figure 2 A flow chart from user access to final display page provided by the present invention;
[0035] Figure 3 A schematic diagram showing the embedded graph provided by the present invention;
[0036] Figure 4 A schematic diagram of the structure of a device for realizing front-end embedded image display provided by the present invention. DETAILED DESCRIPTION
[0037] The following embodiments of the technical solution of the present invention are described in detail in conjunction with the accompanying drawings. The following embodiments are only used to more clearly illustrate the technical solution of the present invention, and are therefore only used as examples, and cannot be used to limit the protection scope of the present invention.
[0038] It should be noted that, unless otherwise specified, the technical terms or scientific terms used in this application should have the common meanings understood by those skilled in the art to which the invention belongs.
[0039] Embodiment 1: A system for realizing front-end embedded image display is provided in a specific embodiment of the present invention, such as Figure 2 As shown, the system includes an embedded graph display module that establishes a connection with the user end and a graph database backend; in addition, it also includes a general graph display module. The embedded graph display and the general graph display module are two parallel services and are independent of each other. The embedded graph display can be used in different scenarios, such as a certain business line, a large-screen data display, etc. When the user accesses this module, the embedded graph display sends a request to the graph database backend through the taskId and graphName on the URL, obtains a response, obtains the point edge data, and generates an embedded graph on the front end to display it to the user.
[0040] Specifically, the embedded graph display module is embedded in an application, and the application can be a website, a client, or a program that supports parsing web pages. The web page of the embedded graph display module is accessed through a fixed URL address, and data is obtained and the page is rendered through http access. Therefore, the embedded graph display module is used to receive data access requests from the user end, wherein the data access request includes: user feature information, click behavior, access IP address, channel ID, and timestamp; generate a task identifier TaskID and a view name graphName through the URL link of the data access request, and send them to the graph database backend; and obtain a response from the graph database backend, and feed back the point and edge data from the graph database backend to the user end for visual display, such as Figure 3 This is a schematic diagram demo of using embedded graph display. For example, if the current page is a large data screen page, you can put the embedded graph display somewhere on this page for better analysis and viewing. The embedded graph display is accompanied by a detailed introduction to the specific function points for users to choose.
[0041] In addition, the graph database backend is used to receive messages from the embedded graph display module, perform logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message and convert them into data of point-edge relationships; and return the converted point-edge data.
[0042] The embedded image display module includes:
[0043] The application interface layer is used to receive control instructions from the user terminal and establish a connection with the user terminal, providing an interactive interface between the system and the user terminal;
[0044] The preprocessing layer is used to obtain the data access request transmitted from the application interface layer, respond to the control instruction of the user end to make the user end jump to the page corresponding to the access address, and obtain the URL link according to the characteristic information and click behavior of the user end;
[0045] The analysis layer is used to generate the task identifier TaskID and the view name graphName based on the URL link of the page corresponding to the access address, and send it to the graph database backend;
[0046] The interaction layer is used to respond to the point-edge data fed back by the graph database background, visualize the point-edge data on the front end, and submit the display results to the application interface layer.
[0047] The application interface layer includes: a login port corresponding to the characteristic information of the user end, and different login ports carry corresponding channel IDs.
[0048] The preprocessing layers include:
[0049] The first acquisition unit is used to acquire the access IP address according to the page content clicked by the user terminal;
[0050] A second acquisition unit is used to acquire characteristic information of a user terminal according to preset requirements; the characteristic information of the user terminal includes technical personnel, analysis personnel or business personnel;
[0051] The third acquisition unit is used to perform parameter splicing on the access IP address and the TaskID task identifier corresponding to the characteristic information according to a preset rule to generate a URL link.
[0052] The analysis layer includes: the first generation module, which is used to obtain the embedded Java application provided by the graph database background when the user is a technician, call the API interface in the operating system, obtain the point edge data through underlying calculations, generate the TaskID task identifier, and splice the relevant parameters of the TaskID task identifier in sequence to form the final displayed URL link.
[0053] The second generation module is used for, when the user end is an analyst or a business person, to input the specified conditions in the page of creating a task in the embedded graph display interface to generate a URL link for the final display;
[0054] The specified conditions include scripts that control the elements, styles, and / or data content of the graphics unit, the display position of the basic elements, and the preview effect.
[0055] The graph database backend includes: an acquisition module, used to acquire the graph name graphName and the task identifier TaskID corresponding to the URL link;
[0056] The processing module is used to obtain the specified template type through the view name graphName, obtain the corresponding vertex-edge data through the task identifier TaskID, and write the vertex-edge data into the template of the corresponding type as response information.
[0057] Embodiment 2: Based on the same technical concept, Embodiment 2 of the present invention also provides a method for realizing front-end embedded image display, such as Figure 1 As shown, the method includes:
[0058] S101: The embedded graph display module receives a data access request from the user, generates a task identifier TaskID and a view name graphName through a URL link of the data access request, and sends the generated task identifier TaskID and a view name graphName to the graph database backend;
[0059] S102: The graph database backend receives a message from the embedded graph display module, performs logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message, and converts the converted point-edge relationship data into data, and returns the converted point-edge data;
[0060] S103 The embedded graph display module obtains a response from the graph database backend, and feeds back the point-edge data from the graph database backend to the user end for visual display.
[0061] In addition, a device 205 for realizing front-end embedded image display is also provided in the specific implementation mode of the present invention. Figure 4 As shown, it includes a processor 201, an input device 202, an output device 203 and a memory 204, and the processor, input device, output device and memory are interconnected, wherein the memory is used to store a computer program, and the computer program includes program instructions, and the processor is configured to call the program instructions to execute a method for realizing front-end embedded graphic display as described in Example 2.
[0062] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein by equivalents. These modifications or replacements do not make the essence of the corresponding technical solutions deviate from the scope of the technical solutions of the embodiments of the present invention, and they should all be included in the scope of the claims and specification of the present invention.
Claims
1. A system for realizing front-end embedded graph display, It is characterized in that The system includes an embedded graph display module connected to a user terminal and a graph database backend; The embedded graph display module is embedded in the application program, and is used to receive a data access request from the user end, generate a task identifier TaskID and a view name graphName through the URL link of the data access request, and send them to the graph database backend; and obtain a response from the graph database backend, and feed back the vertex and edge data from the graph database backend to the user end for visual display; The graph database backend is used to receive messages from the embedded graph display module, and perform logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message to convert them into data of point-edge relationships; And return the converted point edge data; The embedded image display module includes: The application interface layer is used to receive control instructions from the user terminal and establish a connection with the user terminal, providing an interactive interface between the system and the user terminal; The pre-processing layer is used to obtain the data access request transmitted from the application interface layer, respond to the control instruction of the user terminal to make the user terminal jump to the page corresponding to the access address, and obtain the URL link according to the characteristic information and click behavior of the user terminal; The analysis layer is used to generate the task identifier TaskID and the view name graphName based on the URL link of the page corresponding to the access address, and send it to the graph database backend; The interaction layer is used to respond to the point-edge data fed back by the graph database background, visualize the point-edge data on the front end, and submit the display results to the application interface layer.
2. The system according to claim 1, It is characterized in that The data access request includes: user feature information, click behavior, access IP address, channel ID and timestamp; The application program includes: website, client, and web page program supporting parsing.
3. The system according to claim 1, It is characterized in that The application interface layer includes: a login port corresponding to the characteristic information of the user end, and different login ports carry corresponding channel IDs.
4. The system according to claim 3, It is characterized in that The pre-processing layer comprises: The first acquisition unit is used to acquire the access IP address according to the page content clicked by the user terminal; A second acquisition unit is used to acquire characteristic information of a user terminal according to preset requirements; the characteristic information of the user terminal includes technical personnel, analysis personnel or business personnel; The third acquisition unit is used to perform parameter splicing on the access IP address and the TaskID task identifier corresponding to the characteristic information according to a preset rule to generate a URL link.
5. The system according to claim 3, It is characterized in that The analysis layer includes: a first generation module, which is used to obtain the embedded Java application provided by the graph database background when the user end is a technician, call the API interface in the operating system, obtain the point edge data through underlying calculations, generate a TaskID task identifier, and splice the relevant parameters of the TaskID task identifier in sequence to form a final displayed URL link.
6. The system according to claim 1, It is characterized in that The analysis layer further includes: a second generation module, which is used to, when the user terminal is an analyst or a business person, input a specified condition in a page of creating a task in the embedded graph display interface to generate a URL link for the final display; The specified conditions include scripts that control the elements, styles, and / or data content of the graphics unit, the display position of the basic elements, and the preview effect.
7. The system according to claim 1, It is characterized in that The graph database backend includes: The acquisition module is used to obtain the graph name graphName and task identifier TaskID corresponding to the URL link; The processing module is used to obtain the specified template type through the view name graphName, obtain the corresponding vertex-edge data through the task identifier TaskID, and write the vertex-edge data into the template of the corresponding type as response information.
8. A method for realizing front-end embedded graph display, It is characterized in that The method comprises: The embedded graph display module receives the data access request from the user, generates the task identifier TaskID and the view name graphName through the URL link of the data access request, and sends them to the graph database backend; The graph database backend receives a message from the embedded graph display module, performs logical processing based on the task identifier TaskID and the view name graphName related parameters contained in the message to convert the data into point-edge relationship data, and returns the converted point-edge data; The embedded graph display module obtains the response from the graph database backend, and feeds back the vertex and edge data from the graph database backend to the user end for visual display; The embedded image display module includes: The application interface layer is used to receive control instructions from the user terminal and establish a connection with the user terminal, providing an interactive interface between the system and the user terminal; The pre-processing layer is used to obtain the data access request transmitted from the application interface layer, respond to the control instruction of the user terminal to make the user terminal jump to the page corresponding to the access address, and obtain the URL link according to the characteristic information and click behavior of the user terminal; The analysis layer is used to generate the task identifier TaskID and the view name graphName based on the URL link of the page corresponding to the access address, and send it to the graph database backend; The interaction layer is used to respond to the point-edge data fed back by the graph database background, visualize the point-edge data on the front end, and submit the display results to the application interface layer.
9. A device for realizing front-end embedded image display, It is characterized in that The method comprises a processor, an input device, an output device and a memory, wherein the processor, the input device, the output device and the memory are interconnected, wherein the memory is used to store a computer program, the computer program comprises program instructions, and the processor is configured to call the program instructions to execute the method as claimed in claim 8.
Citation Information
Patent Citations
Data imaging method, data imaging device and database server
CN104484353A