High-performance visual interface configuration service design method based on yaml format

Abstract

The invention discloses a high-performance visual interface configuration service design method based on a yaml format, a visual large-screen interface is provided through database configuration without code writing, and the method comprises the following steps: interface configuration rules: one configuration represents one interface; the data acquisition engine acquires original data according to configuration; the data processing engine processes the original data according to the configuration to generate target chart data; and performing visual display, wherein the web page end displays a corresponding chart according to an interface response result. According to the method, data acquisition and data processing are decoupled, and the data processing flow is completed by the back-end service, so that the network data transmission quantity is greatly reduced, the data processing tasks of the web front-end equipment are reduced, and the rendering speed of the visualized large-screen chart is improved.

Description

Technical Field

[0001] This invention belongs to the field of data visualization technology, and specifically relates to a design method for a high-performance visualization interface configuration service based on YAML format. Background Technology

[0002] In the context of big data, visualization, as an important way of using data, guides enterprises to make rapid decisions in production and operation. How to present data analysis results has become an indispensable part. In the context of big data, the effective, fast, complete and beautiful presentation of data is a crucial link.

[0003] However, in the traditional software industry, data visualization is either done using BI systems, which suffer from problems such as unattractive charts, slow loading of graphics due to front-end rendering, and large data transfer volumes; or it is done by developers through hard coding, resulting in long development cycles and inflexible changes.

[0004] In conclusion, improving interface response speed and chart rendering speed while ensuring rapid development and flexible requirement changes has become an urgent problem for those skilled in the art. Summary of the Invention

[0005] To address the shortcomings and deficiencies in the prior art, this invention provides a high-performance visualization interface configuration service design method based on YAML format. This method decouples data acquisition from data processing and allows the data processing flow to be completed by the backend service, thereby greatly reducing network data transmission volume, reducing data processing tasks on web front-end devices, and improving the rendering speed of large-screen charts.

[0006] To achieve the above objectives, this invention provides the following technical solution: a high-performance visual interface configuration service design method based on YAML format, which provides a visual dashboard interface through database configuration without writing code, including:

[0007] Interface configuration rules: one configuration represents one interface.

[0008] The data acquisition engine retrieves raw data based on the configuration.

[0009] The data processing engine processes the raw data according to the configuration and generates the target chart data;

[0010] Visualized display: The web page displays corresponding charts based on the API response results.

[0011] Preferably, the interface configuration rules are as follows:

[0012] An interface configuration includes the interface name, URI, target data source, and configuration rules in YAML format. The configuration rules include the chart title, chart number, chart type, data retrieval rules, and chart data processing rules.

[0013] Preferably, a configuration rule can contain multiple series of data, and multiple legend combinations for bar charts and line charts. Different data needs to be configured in the rule according to different chart types. For bar charts, x-axis name, x-axis data, y-axis name, y-axis unit, and y-axis data need to be configured. Pie charts do not require y-axis related configuration. Ordinary lists only need to be configured with source data, return data column, and table header.

[0014] Preferably, the data acquisition engine acquires raw data from multiple channels according to configuration rules, and the acquisition methods include:

[0015] SQL Data Retriever: Retrieves data from a specified database using configured SQL statements;

[0016] Link Data Acquirer: Directly specify the ID of another data acquirer to copy its data;

[0017] Ratio Data Getter: Specify two data getter IDs, each take one column of data, calculate the ratio, and then obtain the data;

[0018] Static data retriever: Directly write static data into the configuration file as the raw data.

[0019] Preferably, the data processing engine processes the raw data into the data format required by the chart according to the configuration rules. The data processors include:

[0020] Text template processor: populates the template text with query data;

[0021] List processor: Extracts data from a specified column based on configuration;

[0022] Column and line chart processor: Extracts x-axis and y-axis data and data units according to configuration;

[0023] Pie chart processor: Extracts pie chart legends and data values ​​according to configuration;

[0024] Map Heatsink: Extracts map coordinates or province / city names and regional heat values ​​based on configuration;

[0025] Map Flying Line Processor: Extracts the coordinates of the map's starting point, target point, and flying line data according to the configuration;

[0026] Sankey Graph Processor: Extracts data from each level and flow of the Sankey graph based on the configuration;

[0027] Preferably, the visualization is as follows:

[0028] The web application does not use pre-written chart types. Instead, it renders charts based on the results returned by the API. Data processing is done on the server side, avoiding slow graphics rendering caused by large amounts of raw data transmission and slow front-end data processing. The server can increase parallel processing capabilities through multi-replica deployment.

[0029] Preferably, a high-performance visualization interface configuration service design method based on YAML format includes the following steps: The interface configuration can be used simply by writing it into the service database, eliminating the need for code development and deployment. After receiving an interface request, the service finds the corresponding data interface in the database based on the URI and obtains the interface configuration. Then, the data acquisition processor obtains the raw data according to the interface configuration. This acquisition method can be querying the corresponding database, receiving data from other processors, or directly obtaining static data from the configuration. After obtaining the raw data, the result processor can process the data according to the configuration, constructing ordinary lists, template-filled text, bar charts, pie charts, maps, map flyline charts, and Sankey diagrams. The front-end dashboard obtains the results and displays them based on the returned results. The type of graph is determined by the interface configuration. Simultaneously, the interface only returns the processed data, reducing data transmission and front-end data processing volume. This achieves high-performance, diverse, and dynamic visualization needs that can be flexibly met without front-end or back-end coding, requiring only modification of the interface configuration in the database.

[0030] Compared with the prior art, the beneficial effects of the present invention are as follows: The present invention greatly reduces the amount of network data transmission and the data processing tasks of web front-end devices by decoupling data acquisition and data processing and having the data processing process completed by the back-end service, thereby improving the rendering speed of visualization large screen charts. Attached Figure Description

[0031] Figure 1 This is a schematic diagram illustrating the principle of the present invention;

[0032] Figure 2 This is a diagram showing the actual interaction between the various services of this invention. Detailed Implementation

[0033] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of the present invention, and not all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.

[0034] Example 1

[0035] like Figure 1 and2 As shown, a high-performance visual interface configuration service design method based on YAML format is presented, including: interface configuration rules, data acquisition engine, data processing engine, and visualization display.

[0036] 1. The interface configuration includes the interface name, URI, target data source, and configuration rules in YAML format. Configuration rules include chart title, chart number, chart type, data retrieval rules, and chart data processing rules. A single configuration rule can contain multiple data series, such as multiple legend combinations for bar charts or line charts. Different data needs to be configured in the rules depending on the chart type. For example, bar charts require x-axis name, x-axis data, y-axis name, y-axis unit, and y-axis data; pie charts do not require y-axis configuration; and regular lists only require configuring the source data, return data columns, and header.

[0037] 2. The data acquisition engine obtains raw data from multiple channels according to the configured rules. The acquisition methods include:

[0038] SQL Data Retriever: Retrieves data from a specified database using configured SQL statements;

[0039] Link Data Acquirer: Directly specify the ID of another data acquirer to copy its data;

[0040] Ratio Data Getter: Specify two data getter IDs, each take one column of data, calculate the ratio, and then obtain the data;

[0041] Static data retriever: Directly write static data into the configuration file as the raw data;

[0042] 3. The data processing engine processes the raw data into the required data format for the charts according to the configuration rules. Data processors include:

[0043] Text template processor: populates the template text with query data;

[0044] List processor: Extracts data from a specified column based on configuration;

[0045] Column and line chart processor: Extracts x-axis and y-axis data, data units, etc., according to configuration;

[0046] Pie chart processor: Extracts pie chart legends and data values ​​according to configuration;

[0047] Map Heatsink: Extracts map coordinates, province / city names, and regional heat values ​​based on configuration.

[0048] Map Flying Line Processor: Extracts the coordinates of the map's starting point, target point, and flying line data according to the configuration;

[0049] Sankey Graph Processor: Extracts data from each level and flow of the Sankey graph based on the configuration;

[0050] 4. The chart types on the web interface are not pre-written; instead, the charts are rendered based on the results returned by the API. Furthermore, since data processing is handled by the server, the slow rendering of charts caused by the large amounts of raw data transmission and slow front-end data processing, common problems in traditional BI systems, are avoided. The server can also increase its parallel processing capabilities through multi-replica deployment.

[0051] Example 2

[0052] The specific steps of this method are as follows: The interface can be used simply by writing the interface configuration into the service database, without the need for code development or deployment. After receiving an interface request, the service finds the corresponding data interface in the database based on the URI and obtains the interface configuration. Then, it obtains the raw data according to the data acquisition processor configured in the interface configuration. The acquisition method can be querying the corresponding database, receiving from other processors, or directly obtaining static data from the configuration. After obtaining the raw data, it can be processed according to the configured result processor to construct ordinary lists, template-filled text, bar charts, pie charts, maps, map flyline charts, Sankey diagrams, etc. After the front-end dashboard obtains the results, it displays them according to the returned results. The type of graph is determined by the interface configuration. Simultaneously, the interface only returns processed data, greatly reducing the amount of data transmission and front-end data processing. This achieves high-performance, diverse, and ever-changing visualization needs without requiring coding on either the front-end or back-end; only the interface configuration in the database needs to be modified.

[0053] Finally, it should be noted that the above descriptions are merely preferred embodiments of the present invention and are not intended to limit the present invention. Although the present invention has been described in detail with reference to the foregoing embodiments, those skilled in the art can still modify the technical solutions described in the foregoing embodiments or make equivalent substitutions for some of the technical features. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of the present invention should be included within the protection scope of the present invention.

Claims

1. A method for designing a high-performance visual interface configuration service based on a yaml format, characterized in that: No need to write code to provide visual large screen interface through database configuration, including: Interface configuration rules, one configuration represents an interface; Data acquisition engine, according to the configuration to obtain the original data; Data processing engine, according to the configuration to process the original data, generate target chart data; Visual display, web page according to the interface response result display corresponding chart.

2. The design method of a high-performance visualization interface configuration service based on a yaml format according to claim 1, characterized in that: The interface configuration rules are as follows: A interface configuration contains interface name, URI, target data source and yaml format configuration rules, which contains chart title, chart number, chart type, data acquisition rule, chart data processing rule.

3. The method of claim 2, wherein the method is based on a yaml format high-performance visualization interface configuration service design. A configuration rule can contain multiple series data, multiple legend combination of column chart and point line chart, different data need to be configured according to different chart type in the rule, column chart needs to configure x axis name, x axis data, y axis name, y axis unit, y axis data, pie chart does not need y axis related configuration, and ordinary list only needs to configure source data, return data column and table header.

4. The design method of high-performance visual interface configuration service based on yaml format according to claim 1, characterized in that: The data acquisition engine acquires original data from multiple channels according to the configuration rules, and the acquisition methods are: SQL data acquisition: query the specified database to obtain data through the configured sql statement; Link data acquisition: directly specify the id of another data acquisition device to copy the data; Ratio data acquisition: specify two data acquisition device ids, take one column data for ratio calculation, and obtain the data; Static data acquisition: write static data in the configuration file as original data.

5. The design method of high-performance visual interface configuration service based on yaml format according to claim 1, characterized in that: The data processing engine processes the original data into the corresponding data format required by the chart according to the configuration rules, and the data processor has: Text template processor: fill the query data into the template text; List processor: extract specified column data according to configuration; Column and line chart processor: extract x axis, y axis data and data unit according to configuration; Pie chart processor: extract pie chart legend and data value according to configuration; Map heat processor: extract map coordinates or province and city names, and region heat value according to configuration; Map fly line chart processor: extract map starting point coordinates, target point coordinates and fly line data according to configuration; Sanji chart processor: extract sanji chart levels and flow data according to configuration.

6. The design method of a high-performance visualization interface configuration service based on a yaml format according to claim 1, characterized in that: The visual display is as follows: Web is not pre written chart type, but according to the interface return result to carry on the chart rendering, the data processing is completed by the server, avoids the large amount of original data transmission and the slow front end data processing caused by the slow graph rendering, the server can increase the parallel processing capacity through multiple copy deployment mode.

7. The design method of a high-performance visualization interface configuration service based on a yaml format according to claim 1, characterized in that: The specific steps are as follows: the interface configuration is written into a service database, and the interface can be used without code development and deployment. After the service receives an interface request, the corresponding data interface is found in the database according to the URI, and the interface configuration is obtained. Then, the original data is obtained according to the data acquisition processor of the interface configuration. The acquisition mode can be querying the corresponding database, receiving from other processors or directly acquiring static data from the configuration. After obtaining the original data, the data can be processed according to the configured result processor to form a normal list, a template filling text, column chart data, pie chart data, map data, map fly line chart data, and a Sanji chart data. After the front-end large screen obtains the result, the result is displayed according to the returned result. The type of the graph is determined by the interface configuration. At the same time, the interface only returns the processed data, thereby reducing the data transmission amount and the front-end data processing amount. The front-end and the back-end do not need to be coded, and only the interface configuration in the database needs to be modified to flexibly meet the high-performance, diversified and variable visualization requirements.

Images