Report visualization design method and device, electronic equipment and storage medium

Abstract

The invention discloses a report visualization design method and device, electronic equipment and a storage medium, and the method comprises the steps: responding to a report environment configuration operation for a report visualization design terminal, and displaying a report type label interface in a graphical user interface; in response to a report type label dragging instruction for the report type label interface, displaying a report field interface corresponding to the report type label dragging instruction in the graphical user interface; in response to a report field selection instruction for the report field interface, displaying a report preview interface corresponding to the report field selection instruction in the graphical user interface; wherein the report preview interface comprises a plurality of visual billboard areas, and the visual billboard areas are used for displaying the target visual report. The method can solve the problems that report design is not visual and operation is tedious, the report design process is simplified, report design difficulty is reduced, report design efficiency is improved, and the method can be widely applied to the technical field of computers.

Description

Technical Field

[0001] This application relates to the field of computer technology, and in particular, to a method, device, electronic device, and storage medium for report visualization design. Background Art

[0002] Currently, with the acceleration of enterprise digital transformation, enterprises have accumulated a large amount of data in multiple systems such as production and operation. To effectively utilize this data, enterprises need to present this complex data in an intuitive and personalized manner to support the data-driven decision-making process. However, traditional data presentation methods often rely on code programming, which makes it difficult for non-technical personnel, especially business personnel, to independently complete report design. To solve this problem, a series of report visualization design tools have emerged on the market. These tools have, to a certain extent, lowered the threshold of report design, enabling business personnel to more easily participate in the data visualization process. However, these report visualization design tools still have some deficiencies. For example, the configuration process is relatively complex, and users need to conduct a large amount of research and experimentation to achieve a satisfactory report display effect; there is a lack of mature component templates, and users need to gradually build display elements from scratch, which not only increases the workload but also may limit the flexibility of report design.

[0003] In summary, the technical problems existing in the related art need to be improved. Summary of the Invention

[0004] The embodiments of this application aim to at least solve one of the technical problems in the related art to some extent. For this reason, the main purpose of the embodiments of this application is to propose a method, device, electronic device, and storage medium for report visualization design, which can solve the problems of non-intuitive report design and cumbersome operation, simplify the report design process, reduce the difficulty of report design, and improve the efficiency of report design.

[0005] To achieve the above object, on the one hand, the embodiments of this application propose a method for report visualization design, which provides a graphical user interface through a report visualization design terminal. The method includes the following steps:

[0006] In response to a report environment configuration operation on the report visualization design terminal, a report type label interface is displayed in the graphical user interface;

[0007] In response to a report type label dragging instruction on the report type label interface, a report field interface corresponding to the report type label dragging instruction is displayed in the graphical user interface;

[0008] In response to a report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein, the report preview interface includes a plurality of visual dashboard areas for displaying a target visual report.

[0009] To achieve the above object, on the other hand, an embodiment of the present application provides a report visualization design device. A graphical user interface is provided through a report visualization design terminal, and the device includes the following modules:

[0010] A report environment configuration operation module, configured to display a report type label interface in the graphical user interface in response to a report environment configuration operation for the report visualization design terminal;

[0011] A report type label dragging module, configured to display a report field interface corresponding to the report type label dragging instruction in the graphical user interface in response to a report type label dragging instruction for the report type label interface;

[0012] A report field selection module, configured to display a report preview interface corresponding to the report field selection instruction in the graphical user interface in response to a report field selection instruction for the report field interface; wherein, the report preview interface includes a plurality of visual dashboard areas for displaying a target visual report.

[0013] To achieve the above object, on the other hand, an embodiment of the present application provides an electronic device, which includes a memory and a processor. The memory stores a computer program, and when the processor executes the computer program, the foregoing method is implemented.

[0014] To achieve the above object, on the other hand, an embodiment of the present application provides a computer-readable storage medium, which stores a computer program, and when the computer program is executed by a processor, the foregoing method is implemented.

[0015] The embodiments of the present application at least include the following beneficial effects: The present application provides a method, device, electronic device and storage medium for report visualization design. This solution provides a graphical user interface through a report visualization design terminal. By responding to the report environment configuration operation for the report visualization design terminal, a report type label interface is displayed in the graphical user interface; in response to the report type label dragging instruction for the report type label interface, a report field interface corresponding to the report type label dragging instruction is displayed in the graphical user interface; in response to the report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein, the report preview interface includes several visualization dashboard areas, and the visualization dashboard areas are used to display the target visualization report. The embodiments of the present application intuitively design reports through interactive operations such as dragging and selecting on the graphical user interface, solve the problems of unintuitive report design and cumbersome operations, enable designers to intuitively configure the report environment, select report types and fields, etc., without writing complex codes or instructions, greatly simplify the report design process, reduce the complexity of report design, thereby improving the efficiency of report design. At the same time, the real-time preview function allows designers to immediately see the visual effects of the report during the design process, so as to quickly adjust and optimize the report design to meet user needs; moreover, the report visualization design terminal of the embodiments of the present application supports the selection of multiple report types and fields, and multiple types of reports can be displayed simultaneously in the report preview interface, enabling designers to flexibly configure and create various types of visualization reports according to different business requirements and display purposes, enhancing the user experience. BRIEF DESCRIPTION OF THE DRAWINGS

[0016] Figure 1 is a schematic diagram of an implementation environment provided by an embodiment of the present application;

[0017] Figure 2 is a flowchart of a method for report visualization design provided by an embodiment of the present application;

[0018] Figure 3 is a schematic diagram of a dashboard management interface provided by an embodiment of the present application;

[0019] Figure 4 is a schematic diagram of a report type label interface provided by an embodiment of the present application;

[0020] Figure 5 is a schematic diagram of an interface for dragging a report type label to a visualization dashboard area provided by an embodiment of the present application;

[0021] Figure 6 is a schematic diagram of a report field interface provided by an embodiment of the present application;

[0022] Figure 7It is a report preview interface provided by an embodiment of the present application;

[0023] Figure 8 It is a schematic diagram of an interface for adjusting the data display order in a visual report provided by an embodiment of the present application;

[0024] Figure 9 It is a schematic diagram of an interface when the design of a target visual report is completed provided by an embodiment of the present application;

[0025] Figure 10 It is a schematic diagram of a report visualization interface provided by an embodiment of the present application;

[0026] Figure 11 It is a schematic diagram of the working principle of report chart design and display provided by an embodiment of the present application;

[0027] Figure 12 It is a schematic diagram of the design idea of dynamic rendering of a dashboard provided by an embodiment of the present application;

[0028] Figure 13 It is a schematic diagram of the report design idea provided by an embodiment of the present application;

[0029] Figure 14 It is a schematic diagram of the design idea of front-end data caching provided by an embodiment of the present application;

[0030] Figure 15 It is a schematic diagram of the structure of a report visualization design device provided by an embodiment of the present application;

[0031] Figure 16 It is a schematic diagram of the hardware structure of an electronic device provided by an embodiment of the present application. Detailed implementation manners

[0032] In order to make the purpose, technical solutions and advantages of the present application clearer, the present application will be further described in detail below with reference to 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 used to limit the present application. When the following description refers to the accompanying drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The implementation manners described in the following exemplary embodiments do not represent all implementation manners consistent with the embodiments of the present application. They are only examples of devices and methods consistent with some aspects of the embodiments of the present application detailed in the appended claims.

[0033] It can be understood that the terms "first", "second", etc. used in this application may be used herein to describe various concepts, but unless otherwise specified, these concepts are not limited by these terms. These terms are only used to distinguish one concept from another. For example, without departing from the scope of the embodiments of this application, the first information may also be referred to as the second information, and similarly, the second information may also be referred to as the first information. Depending on the context, words such as "if" and "when" as used herein may be interpreted as "when...", "while...", or "in response to determining".

[0034] The terms "at least one", "a plurality of", "each", "any one", etc. used in this application, at least one includes one, two or more than two, a plurality of includes two or more than two, each refers to each of the corresponding plurality, and any one refers to any one of the plurality.

[0035] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by those of ordinary skill in the technical field to which this application belongs. The terms used herein are only for the purpose of describing the embodiments of this application and are not intended to limit this application.

[0036] Currently, with the acceleration of the digital transformation of enterprises, enterprises have accumulated a large amount of data in multiple systems such as production and operation. In order to effectively utilize this data, enterprises need to present this complex data in an intuitive and personalized manner to support the data-driven decision-making process. However, traditional data presentation methods often rely on code programming, which makes it difficult for non-technical personnel, especially business personnel, to independently complete report design. To solve this problem, a series of report visualization design tools have emerged on the market. These tools have, to a certain extent, lowered the threshold of report design, enabling business personnel to more easily participate in the data visualization process. However, these report visualization design tools still have some deficiencies. For example, the configuration process is relatively complex, and users need to conduct a large amount of research and experimentation to achieve a satisfactory report display effect; there is a lack of mature component templates, and users need to gradually build display elements from scratch, which not only increases the workload but also may limit the flexibility of report design.

[0037] Exemplarily, traditional data presentation interfaces need to be implemented by code programming, resulting in the inability of business personnel to independently complete report design. To resolve such contradictions, many report visualization design tools have emerged in the market, such as: ECharts, Tableau, PowerBI, FineVis, D3.js, Highcharts, Grafana, etc., among which Tableau, PowerBI, and FineVis are commercial versions. Using commercial version technology can, to a certain extent, lower the project implementation threshold and facilitate the daily operation and maintenance of the system. However, there are also the following four major disadvantages: First, commercial report tools usually have comprehensive functions. To meet the needs of various different fields, the complexity of the actual configuration process will be increased to a certain extent. To obtain satisfactory results, a large amount of research and experimentation is required. Some operation experiences may not be fully supported. In the absence of dedicated support or a very detailed operation manual for guidance, the report design efficiency may be limited to a certain extent; Second, the procurement of commercial software usually does not include the source code. In today's increasingly strict information security requirements, if there are loopholes in the code, they cannot be repaired in a timely manner. In addition, new function expansion requires additional procurement, with high costs and long cycles; Third, commercial software usually has two sets of business logics for display on the PC (Personal Computer) side and the mobile side, which are deployed separately and independently, increasing the development cost; Fourth, commercial software usually does not provide mature component templates, and all display elements need to be gradually built from scratch.

[0038] In view of this, an embodiment of the present application provides a report visualization design method, device, electronic device, and storage medium. This solution provides a graphical user interface through a report visualization design terminal. By responding to a report environment configuration operation for the report visualization design terminal, a report type label interface is displayed in the graphical user interface; in response to a report type label dragging instruction for the report type label interface, a report field interface corresponding to the report type label dragging instruction is displayed in the graphical user interface; in response to a report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein, the report preview interface includes several visual dashboard areas, and the visual dashboard areas are used to display the target visual report. Through interactive operations such as dragging and selecting on the graphical user interface, the embodiment of the present application intuitively designs the report, solves the problems of non-intuitive report design and cumbersome operations, enables designers to intuitively configure the report environment, select report types and fields, etc., without writing complex codes or instructions, greatly simplifies the report design process, reduces the complexity of report design, and thus improves the efficiency of report design. At the same time, the real-time preview function allows designers to instantly see the visual effects of the report during the design process, so that they can quickly adjust and optimize the report design to meet user requirements; moreover, the report visualization design terminal of the embodiment of the present application supports the selection of multiple report types and fields, and multiple types of reports can be displayed simultaneously in the report preview interface, enabling designers to flexibly configure and create various types of visual reports according to different business requirements and display purposes, enhancing the user experience.

[0039] The report visualization design method provided by the embodiment of the present application relates to the field of computer technology. The report visualization design method provided by the embodiment of the present application can be applied to a terminal, can also be applied to a server, or can be software running on a terminal or a server. In some embodiments, the terminal can be a smart phone, a tablet computer, a laptop computer, a desktop computer, a smart speaker, a smart watch, a vehicle-mounted terminal, etc., but is not limited thereto; the server side can be configured as an independent physical server, can also be configured as a server cluster or a distributed system composed of multiple physical servers, or can be configured as a cloud server providing basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN (Content Delivery Network), and big data and artificial intelligence platforms. The server can also be a node server in a blockchain network; the software can be an application that implements the report visualization design method, etc., but is not limited to the above forms.

[0040] This application can be used in numerous general or specific computer system environments or configurations. For example: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronics, network PCs (Personal Computers), minicomputers, mainframe computers, distributed computing environments including any of the above systems or devices, and so on. This application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform specific tasks or implement specific abstract data types. This application can also be practiced in a distributed computing environment where tasks are executed by remote processing devices connected through a communication network. In a distributed computing environment, program modules can be located in local and remote computer storage media including storage devices.

[0041] Please refer to Figure 1 , Figure 1 which is a schematic diagram of an implementation environment provided by an embodiment of this application. As Figure 1 shown, this implementation environment includes at least one terminal 102 and a server 101. The terminal 102 and the server 101 can be network-connected by wireless or wired means to complete data transmission and exchange.

[0042] The server 101 can be an independent physical server, or a server cluster or distributed system composed of multiple physical servers. It can also be a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN (Content Delivery Network), and big data and artificial intelligence platforms.

[0043] In addition, the server 101 can also be a node server in a blockchain network. Among them, blockchain is a new application mode of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, and encryption algorithms.

[0044] The terminal 102 can be a smartphone, a tablet computer, a laptop computer, a desktop computer, a smart speaker, a smart watch, etc. Among them, the terminal 102 can also be an in-vehicle terminal of various device types exemplified above, but is not limited thereto. The terminal 102 and the server 101 can be directly or indirectly connected through wired or wireless communication means, and the embodiments of this application do not limit this here.

[0045] Exemplarily, based on Figure 1In the implementation environment shown, an embodiment of the present application provides a method for visual design of reports. Taking the application of this method for visual design of reports in the terminal 102 as an example for illustration, it can be understood that this method can also be applied to the server 101. That is to say, in this implementation scenario, the method for visual design of reports provided by the embodiment of the present application can be packaged into a program product and installed in the terminal 102. Then, when the relevant program product is run on the terminal 102, the corresponding functions and method steps of the present application can be realized through touch and other operation instructions.

[0046] Please refer to Figure 2 , Figure 2 which is an optional flowchart of the method for visual design of reports provided by the embodiment of the present application. Figure 2 The method in Figure 2 provides a graphical user interface through a report visual design terminal, and the method in

[0047] may include but is not limited to steps S201 to S203.

[0048] In the embodiment of the present application, the report visual design terminal can be used as the Figure 1 terminal 102 described in

[0049] To solve the technical problems existing in relevant commercial report design tools, the report configuration platform developed in the embodiment of the present application selects ECharts as the report chart display tool, realizes the separation of report design and report operation, and in report design, it is decomposed into several components in a modular manner, and each component solves a specific report design scenario (such as drag-and-drop operation components for pie charts, tables, maps, etc.). In actual applications, enterprises with software code development capabilities can select all or part of the components to quickly build a visualization platform with independent intellectual property rights.

[0050] Optionally, there are five common types of reports: tables, bar charts, pie charts, line charts, and maps. The report visualization tool provides a convenient interactive operation method for designing reports, and at the same time can reduce the operation difficulty in the report design process (such as data grouping, data column statistics, data filtering, data sorting, layout design, style design, etc.), thereby accelerating the development and online launch of reports.

[0051] In some embodiments, step S201 may include: in response to a terminal configuration type selection instruction for the report visualization design terminal, displaying a kanban management interface corresponding to the terminal configuration type selection instruction in the graphical user interface; and in response to a report environment configuration operation for the kanban management interface, displaying a report type label interface in the graphical user interface.

[0052] Please refer to Figure 3 , Figure 3 which is a schematic diagram of a kanban management interface provided by an embodiment of the present application. As Figure 3 shown, Figure 3 it is mainly the kanban management interface of the report visualization design terminal. As can be seen from Figure 3 , there are various terminal configuration types set in the sidebar of the workbench of the report visualization design platform. That is, the terminal configuration type refers to the function type on the workbench displayed on the report visualization design terminal. The function types on the workbench may include, but are not limited to, Figure 3 the visualization management shown in

[0053] Exemplarily, first, it is necessary to configure the report visualization design tool provided by the embodiment of the present application on the report visualization design terminal; then, open the report visualization design tool on the report visualization design terminal. As Figure 3 shown, in step S201, first perform a selection operation on the terminal configuration type of the report visualization design terminal, that is, select Figure 3In the kanban management module, enter the kanban management interface; then, perform the report environment configuration operation on the kanban management interface. Specifically: First, click the new kanban button on the kanban management interface to edit a new report. After clicking the new kanban button on the kanban management interface, an edit box corresponding to the kanban name will pop up on the kanban management interface. The user can edit the kanban name in the edit box. Exemplarily, the kanban name can be set to an insurance report. After editing and saving the new kanban name, click the kanban drag and drop configuration button in the operation configuration on the right side of the insurance report to enter the report type label interface. Please refer to Figure 4 , Figure 4 which is a schematic diagram of a report type label interface provided by an embodiment of the present application. As Figure 4 shown, Figure 4 it shows the report type label interface.

[0054] Step S202, in response to a report type label drag instruction for the report type label interface, display a report field interface corresponding to the report type label drag instruction in the graphical user interface;

[0055] In some embodiments, step S202 may include: in response to a report type label selection instruction for the report type label interface, select a report type label to be edited; in response to a report type label drag instruction for the report type label interface, display the selected report type label to be edited in the report type label interface; in response to a report type label edit instruction for the report type label to be edited, display a report field interface corresponding to the report type label drag instruction in the graphical user interface.

[0056] Among them, for the operation method of querying and selecting from the report (type) label library, in addition to classification query, special attention should be paid to the query operation method for responding to fuzzy input to find the label that the user needs from many report labels. Exemplarily, fuzzy query can support multiple algorithms, such as the fuzzy word segmentation algorithm of Jieba, the Levenshtein Distance, etc.

[0057] As Figure 4 shown, the report type label interface includes a report type label area and a visualization kanban area. Among them, the report type label area includes multiple report type labels, and the report type labels can include but are not limited to table, bar chart, pie chart, line chart, and map types; the visualization kanban area can include multiple areas, such as Figure 4The visual dashboard areas 1 to 6 in []. Among them, multiple types of visual reports corresponding to report type labels can be displayed simultaneously in the visual dashboard area. Exemplarily, the bar chart type report can be displayed in the visual dashboard area 1, the table type report can be displayed in the visual dashboard area 2, and the same applies to other visual dashboard areas. This is not elaborated in this embodiment of the present application. Moreover, multiple report type labels can be configured simultaneously in the same visual dashboard area. Exemplarily, assuming that the table type report has been configured in the visual dashboard area 2, the map type report can also be configured in the visual dashboard area 2 simultaneously, and in the subsequent index library preview interface, the user can switch to the required report type display in the visual dashboard area 2 by himself / herself (for example, if the table type report is defaultly displayed in the visual dashboard area 2, the user can switch it to the map type report that has been configured in the visual dashboard area 2 by himself / herself).

[0058] Specifically, as Figure 4 shown, in step S202, first, select the target report type label in the report type label area. Exemplarily, if the selected one is the table type label. Then, use a drag-and-drop tool such as a mouse to drag the table type label to the visual dashboard area. Exemplarily, drag the table type label to the visual dashboard area 2. Next, please refer to Figure 5 , Figure 5 is a schematic diagram of an interface for dragging a report type label to the visual dashboard area provided by this embodiment of the present application. As Figure 5 shown, assuming that the table type label is dragged to the visual dashboard area 2, a table control will be displayed in the visual dashboard area 2 (such as the table example button, delete button, and edit button in Figure 5 ). Further, click the edit button in the visual dashboard area 2 to enter the report field interface corresponding to the report type label drag instruction. Please refer to Figure 6 , Figure 6 is a schematic diagram of a report field interface provided by this embodiment of the present application. As Figure 6As shown in the figure, the report field interface includes function modules such as selecting metric names and searching for metric names. Moreover, the report field interface can be roughly divided into a metric data type and its list area and a selectable metric data area. Exemplarily, assuming that an insurance report needs to be edited, the content in the metric data type and its list area can include data lists such as agency income, savings deposits, and agency insurance of the product category. The selectable metric data area is the specific content corresponding to the list data selected in the metric data type and its list area. Exemplarily, assuming that the data of the agency insurance type is selected from the metric data type and its list area, all the data included in the agency insurance will be displayed in the selectable metric data area. For example, the specific content of the agency insurance can include, but is not limited to, new single premium - daily increase, new single premium - daily increase year-on-year amount, etc. Finally, the data selected in the selectable metric data area will be displayed in the report field interface (such as Figure 6 "selected metric data" in

[0059] Step S203, in response to a report field selection instruction for the report field interface, display a report preview interface corresponding to the report field selection instruction in the graphical user interface; wherein, the report preview interface includes a plurality of visual dashboard areas, and the visual dashboard areas are used to display a target visual report.

[0060] In some embodiments, step S203 may include: in response to a report field selection instruction for the report field interface, select target report display data; in response to a report field interface closing instruction for the report field interface, display a report preview interface corresponding to the report field selection instruction in the graphical user interface; wherein, the selected target report display data is displayed in the report preview interface, and the target report display data is presented through a target visual report.

[0061] Exemplarily, in step S203, as Figure 6 shown, first select type data from the metric data type and its list area. The type data selected in the metric data type and its list area will display all the data it contains in the selectable metric data area; then, select the corresponding target report display data in the selectable metric data area; next, close the report field interface to enter the report preview interface corresponding to the report field selection instruction. Please refer to Figure 7 , Figure 7 is a report preview interface provided by an embodiment of the present application. As Figure 7 shown, the report preview interface includes at least one of the following: a report data configuration area and a report data preview area. Among them, the report data configuration area is the selected report field. Exemplarily, as Figure 7report fields 001 to 008 therein; the report data preview area is for displaying report data of the selected report fields and the report type labels corresponding to the report fields, such as Figure 7 the report data preview area of Figure 7 displays the tabular report corresponding to report fields 001 to 008 and the corresponding target report display data, where Figure 7 Aaa, Bbb, Ccc, Ddd, Eee, Fff, Ggg, and Hhh in it represent the target report display data.

[0062] In some embodiments, it may further include: in response to a report data selection instruction for the report data configuration area, selecting a report field whose data display order is to be adjusted from the target report display data; in response to a report field order dragging instruction, displaying the selected report field whose data display order is to be adjusted in the report data preview area and adjusting it to the target data display order to update the data display order of the target report display data in the target visual report.

[0063] Exemplarily, assume that it is required to Figure 7 swap the positions (orders) of the target report display data Aaa corresponding to report field 001 and the target report display data Bbb corresponding to report field 002 in Figure 7 , then a dragging tool such as a mouse can be used to drag Figure 7 the selected report fields 001 and 002 in the report data configuration area, and use the drag-and-drop method to swap their positions and orders. Please refer to Figure 8 for Figure 8 which is a schematic diagram of an interface for adjusting the data display order in a visual report provided by an embodiment of the present application. As Figure 8 shown, when the position orders of the selected report fields 001 and 002 in the report data configuration area are swapped, after clicking the save and update button, the Figure 8 tabular data in the report data preview area on the right can be obtained. From Figure 8 and Figure 7 by comparison, it can be seen that report field 001 and its corresponding data Aaa have been swapped with report field 002 and its corresponding data Bbb; finally, save the report data with the updated display order, and then it can be switched back to the report preview interface. Please refer to Figure 9 for Figure 9 which is a schematic diagram of an interface when the target visual report design provided by an embodiment of the present application is completed. As Figure 9 shown, Figure 9 the visual dashboard area in Figure 9 displays the tabular data with the swapped data display order.

[0064] In some embodiments, after step S203, it may further include: in response to a report interface switching instruction, displaying a report visualization interface corresponding to the report preview interface in the graphical user interface; in response to a data query instruction for the report visualization interface, displaying a target visualization report in the report visualization interface.

[0065] Optionally, the report visualization interface includes a visualization display area corresponding to the visualization dashboard area in the report preview interface, and the number of visualization display areas is the same as the number of visualization dashboard areas.

[0066] In a specific implementation, exemplarily, as Figure 9 shown, after saving all data in the report preview interface, close the report preview interface until the dashboard management interface is closed; then switch to the report visualization interface, please refer to Figure 10 , Figure 10 is a schematic diagram of a report visualization interface provided by an embodiment of the present application. As Figure 10 shown, the schematic diagram of the report visualization interface is the interface entered by clicking the indicator library preview button on the workbench. As Figure 10 shown, the report visualization interface is the interface for displaying the final target visualization report. The report visualization interface includes a queryable data type area and a visualization display area. The query function of the queryable data type area may include, but is not limited to, report query, visualization dashboard query, and other data report data queries. As Figure 10 shown, when a report query is selected, exemplarily, assuming it is a table type label, then the report data consistent with the visualization dashboard area in the Figure 9 report preview interface can be displayed in the visualization display area.

[0067] In some embodiments, it may further include: when several report type labels are included in a visualization display area, in response to a report type label selection instruction, selecting a target report type label; in response to a report type label switching instruction, displaying a target visualization report corresponding to the selected target report type label in the visualization display area where the report type label switching instruction is executed.

[0068] In practical applications, exemplarily, as Figure 10 shown, assuming that during report design, a table type label and a map type label are configured on the visualization dashboard area 2 in the report preview interface, then there will be a table type report and a map type report corresponding on the report visualization interface. Assuming that the table type report is set first and the map type report is set later in chronological order, then the visualization display area on the report visualization interface will first default to display the table type report with an earlier design time. If it is necessary to display the map type report in the visualization display area 2 on the report visualization interface, then you can click asFigure 10 The corresponding map example button in the visualization display area 2 can be switched to the map type report and Figure 10 displayed in the visualization display area 2.

[0069] It should be noted that the above example is only the design process of a simple table label type report. It can be understood that the design processes of reports corresponding to other report type labels are similar to the design process of the table label type report shown above, and the embodiments of the present application will not elaborate herein.

[0070] Steps S201 to S203 illustrated in the embodiments of the present application provide a graphical user interface through a report visualization design terminal. By responding to a report environment configuration operation for the report visualization design terminal, a report type label interface is displayed in the graphical user interface; in response to a report type label drag instruction for the report type label interface, a report field interface corresponding to the report type label drag instruction is displayed in the graphical user interface; in response to a report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein, the report preview interface includes several visualization dashboard areas, and the visualization dashboard areas are used to display the target visualization report. The embodiments of the present application intuitively design reports through interactive operations such as dragging and selecting on the graphical user interface, solve the problems of non-intuitive report design and cumbersome operations, enable designers to intuitively configure the report environment, select report types and fields, etc., without writing complex codes or instructions, greatly simplify the report design process, reduce the complexity of report design, thereby improving the efficiency of report design. At the same time, the real-time preview function allows designers to instantly see the visual effects of the report during the design process, so as to quickly adjust and optimize the report design to meet user needs; moreover, the report visualization design terminal of the embodiments of the present application supports the selection of multiple report types and fields, and multiple types of reports can be displayed simultaneously in the report preview interface, enabling designers to flexibly configure and create various types of visualization reports according to different business requirements and display purposes, enhancing the user experience.

[0071] In steps S201 to S203 shown in the embodiments of the present application, they are the method steps of report design operation, that is, the relevant content described by taking the application of the report visualization design method to the terminal 102 as an example. In addition, in the embodiments of the present application, the visual report further includes a report design stage. A report visualization design method provided in the embodiments of the present application is implemented based on a drag (and pull) report visualization design tool for Echarts chart rendering. The drag report visualization design tool provided in the embodiments of the present application is a software code based on the Echarts basic module, which can provide a drag operation method, intuitively display the results of chart design, and visually complete the report design. It can be understood that in the embodiments of the present application, the visual report is divided into two states: report design (report development stage) and report operation (report visualization design stage). The report design state means that the designer selects one or more types of reports as templates according to the report requirements, and completes template verification, debugging, and publishing according to the sample data; the report operation state means that the user calls the report template and updates the data within the scope of usage permissions, either in real time or at regular intervals, into the report template to achieve dynamic presentation of data in the template format.

[0072] To explain the principle of the technical solution of the present invention in detail, the overall process of the present invention will be described below in conjunction with some specific embodiments. It is easy to understand that the following is an explanation of the technical principle of the present invention and should not be regarded as a limitation of the present invention.

[0073] A report visualization design method provided in the embodiments of the present application is implemented based on a drag (and pull) report visualization design tool for Echarts chart rendering. The drag report visualization design tool provided in the embodiments of the present application is a software code based on the Echarts basic module, which can provide a drag operation method, intuitively display the results of chart design, and visually complete the report design. At the same time, the front-end code has been encapsulated into a js library, which can be easily introduced into the project code. Echarts is an open-source visualization tool with various chart types to choose from. It requires code development capabilities for chart editing and data loading, and lacks ease of use. The visualization design tool provided in the embodiments of the present application has made supporting function designs around Echarts and is introduced into the self-built system in the form of components, reducing the difficulty of developing report functions (such as cockpit functions, command and dispatch functions, large-screen monitoring functions), and enabling the construction focus of the self-built system to be concentrated on data collection and processing of notification indicators.

[0074] A report visualization design method provided in the embodiments of the present application is applicable to chart design for various dashboard applications such as cockpit systems, command and dispatch monitoring, etc. Please refer to Figure 11 , Figure 11 which is a schematic diagram of the working principle of report chart design and display provided in the embodiments of the present application. AsFigure 11 As shown in Figure 11 , the report design process can be divided into two parts: the design by designers and the use by dashboard users. The key focus of designers is to sort out data, provide accurate report data that meets requirements, and focus on the preparation of data required for reports, establishing the relationship between the data source and the report entity table. Specifically: 1) Define report fields, write SQL statements for report field data, and save them as report configuration information; 2) Create a report entity table, loop through and run the SQL statements in the report configuration information to generate report data. While dashboard users mainly focus on the specific design of reports, which can specifically include: 1) Select an appropriate report type; 2) Drag and drop to complete the dashboard layout of the report; 3) Select report data fields; 4) Drag and drop to complete the report interface design; 5) Save the dashboard report template. Here, the dashboard refers to the report interface that users see and can consist of one report or multiple reports.

[0075] Among them, the drag-and-drop report visualization design tool provided in the embodiments of this application has three prominent focuses, namely (1) the dashboard automatically adapts to the screen size and the charts are dynamically rendered; (2) the intuitive operation method of drag-and-drop is used to complete the dashboard layout design and report layout design; (3) the use of caching to achieve dynamic high-speed loading of report parameters:

[0076] (1) The first prominent focus is that the dashboard can automatically adapt to the screen size, dynamically load each sub-report of the dashboard to achieve dynamic rendering of charts. Specifically, a report is the smallest unit in which business data is presented in the form of a chart. In the embodiments of this application, based on the Echart chart library framework, through the dynamic loading of the option parameters of Echart, various display styles such as bar (bar chart), scatter (scatter plot), map (map), guage (dashboard) are used to display report data; in the embodiments of this application, assuming that report data is to be displayed on a large-screen dashboard, it is displayed vertically in three columns of charts (each chart is a graphical representation of a sub-report); if the screen size is small (such as using a mobile device), then not all information can be displayed, and the dashboard can be minimized to 1 column for display (1 chart per row).

[0077] (2) The second prominent focus is to complete the dashboard layout design, report layout design, etc. through the intuitive operation method of drag-and-drop. Specifically, the dashboard refers to the interface displayed on a large screen, which consists of a group of related charts and presents data in each dimension of the same theme; the drag-and-drop report visualization design tool provided in the embodiments of this application uses the drag-and-drop method to intuitively perform report editing such as the dashboard display area, report type, data source binding, and data display style. The query of the report field library introduces the Jieba fuzzy word segmentation algorithm and the edit distance algorithm, which can support the fuzzy query of report fields.

[0078] (3)Highlight the key point three: use caching to achieve dynamic high-speed loading of report parameters. The front end is JAVAscript code running in the browser, which meets the human-computer interaction needs of the dashboard layout design and dashboard application display; the back-end dashboard server maintains the dashboard configuration information in real time, accesses the data source according to the report parameters, and realizes the dynamic loading of report numbers. The front-back end separation technology meets the requirements of data security and access performance. There is a data buffer in the front end. When the report is dynamically refreshed, the keyword data matching algorithm preferentially uses the data in the buffer, effectively improving the report update speed.

[0079] In the specific implementation, the specific implementation contents of the above three key points are as follows:

[0080] (1) The design idea of dynamic rendering of the dashboard automatically adapts to the screen size and dynamically loads each report. Please refer to Figure 12 , Figure 12 which is a schematic diagram of the design idea of dynamic rendering of a dashboard provided by an embodiment of the present application. As shown in Figure 12 , the steps of dynamically loading the report include the following steps S10 to S50:

[0081] Step S10, read the dashboard configuration information from the back end. The dashboard configuration information includes, but is not limited to, data such as each report ID, report type, style, width, height, whether to adapt, whether to cache, left position, top position, etc., which describes the layout of each sub-report in the dashboard.

[0082] Step S20, check the device model and screen size, and automatically adapt to the screen size. If the width of the screen size is satisfied, the layout of each report is completed in the left-middle-right 3-column format shown in Figure 12 (such as the drawing area 1-left, drawing area 1-middle, drawing area 1-right in Figure 12 ), and the display width of each report is scaled proportionally according to the total screen size; if the screen size is small (such as a mobile phone screen) and the dashboard configuration parameter is the adaptive mode, each report is arranged and displayed in a 1-column or 2-column (the left column is the summary report) manner according to the report type.

[0083] Step S30, the self-loading of each report in the dashboard, interacts with the dashboard server asynchronously, and obtains the report configuration data and report data respectively. The report configuration data such as report name, field name, key field, basic style, header style, theme style, chart style, whether to display drill-down and other report structure parameters. For the specific data of each field corresponding to the report, the dashboard server generates a query condition containing the key field and obtains the report data that meets the query condition from the data source.

[0084] Step S40: Combine the report configuration information and report data into option parameters and pass them into the EChart component in the report drawing area of the DOM memory to complete the chart rendering in the corresponding report drawing area.

[0085] Step S50: Implement data caching and usage. In Steps S10 and S30, when obtaining data from the dashboard server, it is cached synchronously on the front end. The cached data is divided into three types: dashboard configuration data, report configuration data, and report data. When the dashboard template is set to enable caching, before Steps S10 and S30 initiate a call to the backend dashboard server, first determine whether the local cached data can be used as a substitute. If it can be substituted, then use the cached data. By using local cached data, not only can the traffic caused by repeated network downloads be reduced, but also the dashboard loading speed can be significantly improved.

[0086] (2) Complete the dashboard layout design and report layout design in a drag-and-drop operation manner. The dashboard layout design is to divide the drawing area and clarify the position distribution of each sub-report in the dashboard; the report layout design is to clarify the chart type (report type) displayed in the report, associate the required report data fields and display styles, and achieve an intuitive display of the data. In the embodiment of the present application, the dashboard layout design and report design are intuitively and simply implemented in a drag-and-drop operation manner. Please refer to Figure 13 , Figure 13 which is a schematic diagram of the report design idea provided by the embodiment of the present application. As Figure 13 shown, the report design idea includes the following Steps S60 to S110:

[0087] Step S60: Select the report type label to be placed in the dashboard area. The report type is a chart type supported by ECchart, such as various types including tables, pie charts, bar charts, maps, etc.

[0088] Step S70: Dashboard layout. In a drag-and-drop operation manner, drag the report type label selected in Step S60 to a certain area of the dashboard. The drag-and-drop operation manner can simply, intuitively, and accurately express the design intention of the report designer. The front-end program can comprehensively calculate the corresponding dashboard parameters and report parameters based on the operation object, operation action, and operation position information.

[0089] Step S80: Pop up a report field selection window and display the available data fields in a list. The operation method for field selection is that the designer clicks with the mouse to complete the selection of report fields. The selected report field labels are highlighted. Click multiple times until the selection of report fields is completed. Among them, the interface displays the entire list of report field labels, presented in a regular layout. These fields are subdivided by time dimension into granularities such as daily, weekly, monthly, quarterly, semi-annual, and annual. The dashboard system usually involves numerous report fields. To facilitate selection, a combined operation method of classification query and fuzzy query is provided. Fuzzy query is used to find a list of fields that match the text input by the user from the report field library. Fuzzy query supports multiple algorithms, including but not limited to the fuzzy word segmentation algorithm of Jieba and the Levenshtein Distance. The Levenshtein Distance algorithm refers to the minimum number of edit operations required to convert one string into another between two strings. Among them, the smaller the edit distance, the greater the similarity between the two strings.

[0090] Step S90: Pop up a report interface design window and perform visual report interface design. The report fields selected in Step S80 are displayed in a list in the window (as Figure 7 shown), and operations such as adjusting the order, deleting, and sorting of reports (such as Figure 7 and Figure 8 where the report fields 001 and 002 and the corresponding data order are adjusted) are realized by dragging and dropping the mouse.

[0091] Step S100: Refresh the report drawing area to visually display the graphic display effect of the operations in Step S90. The specific action is to call the backend dashboard server, obtain the report data, generate the dynamic parameters of the report, and then pass them into EChart. The EChart component is dynamically loaded into the DOM memory to complete the graphic rendering.

[0092] Step S110: If the dashboard design is completed, perform the operation of saving the dashboard report parameters; if the dashboard design is not completed, return to Step S60 to design a new report. After the operation of saving the dashboard report parameters, a network call is initiated to save all parameter information on the server for subsequent use.

[0093] (3) Design concept of data caching. The dashboard web page needs to be refreshed regularly or triggered manually. If data is obtained from the dashboard server every time it is refreshed, affected by network environment jitter, the refresh speed will inevitably be affected. Therefore, this application embodiment needs to introduce data asynchronous loading and data caching technologies. Please refer to Figure 14 , Figure 14 which is a schematic diagram of the front-end data caching design concept provided by this application embodiment, as Figure 14As shown in the figure, the design idea of the front-end data cache includes the following steps S120 to S160:

[0094] Step S120, the front-end initiates a data acquisition instruction. Among them, the data acquired by the front-end can include, but is not limited to: dashboard parameters, report parameters, and report data.

[0095] Step S130, use keywords to retrieve variables in the DOM memory. The variables are in json format and store information such as dashboard parameters, report parameters, and report data.

[0096] Steps S140 and S150: Assume that in step S130, it is found that there is a cached json structure variable in the DOM memory, then directly read the parameters (dashboard parameters, report parameters, and report data) from the variable. Assume that in step S130, it is not found that there is a cached json structure variable in the DOM memory, then initiate a back-end network point call, obtain parameter information (dashboard parameters, report parameters, and report data) through the dashboard server, and save the parameter information (dashboard parameters, report parameters, and report data) returned by the back-end call in the variable for subsequent use.

[0097] Step S160, return the final parameters.

[0098] The data cache method designed in the embodiment of the present application cleverly utilizes the memory of the front-end running environment, avoiding data duplication downloads to the greatest extent; in the specific implementation, an asynchronous call method is adopted to complete data loading, reducing the impact of network data transmission on report refreshing.

[0099] It should be noted that this embodiment only briefly illustrates the general process of the report visualization design method. For the detailed description of each step, reference can be made to the relevant content in the foregoing embodiments, which will not be elaborated here. It can be understood that the present invention places no restrictions on this.

[0100] In summary, the report visualization design method provided by the embodiment of the present application has the following technical effects and technical advantages:

[0101] First, technical effects:

[0102] (1) The application of the report visualization design method provided by the embodiment of the present application is based on Echarts. The Echarts chart rendering framework ensures the running stability of the chart rendering function and reduces the software development difficulty of the report design and report display functions. On the other hand, this design idea can successfully separate the report design tool from the report running tool, effectively reducing the technical obstacles in the development of the report design tool.

[0103] (2) The visualization design tool provided by the embodiments of this application innovates in the visual operation of report design. By introducing a drag-and-drop interaction operation method, it solves the problems of unintuitive report design and cumbersome operations. Users do not need to understand front-end development skills, and at the same time, the usability of the Echarts chart tool is improved. Secondly, the front-end toolkit of the embodiments of this application is pure js front-end code, which can be easily integrated into the existing system, that is, the front-end code can be integrated as a component into the front-end code of the target system to meet the report design and large-screen display requirements of the target business scenario, providing more autonomy for report visualization development and enabling independent control in the extraction, processing, and processing of notification data information.

[0104] (3) Aiming at the disadvantages of the large system and complex functions of related commercial version visualization design tools, which are difficult to expand and transform, the drag-and-drop report visualization design tool based on Echarts chart rendering provided by the embodiments of this application can greatly reduce the threshold of data visualization applications such as enterprise self-built large-screen cockpit systems, command and dispatch systems, and large-screen monitoring systems, which is conducive to the incubation and innovative research of more data intelligence applications.

[0105] II. Technical advantages:

[0106] (1) Developing a drag-and-drop report visualization design tool based on Echarts charts can ensure the stability of report graphic rendering;

[0107] (2) The front-end code is a js library that runs in the browser, has low requirements for the running environment, and is easy to apply;

[0108] (3) Developing a drag-and-drop report visualization design tool based on Echarts charts as a drag-and-drop design component reduces the difficulty of self-built command and dispatch systems, cockpit systems and other intelligent applications. Compared with purchased commercial systems, it can improve data security and flexibly expand functions.

[0109] The embodiments of this application develop a report configuration platform based on the Echarts basic module. With an intuitive drag-and-drop operation method, the chart design results are dynamically displayed, and through a visual operation method, report templates and dashboard templates in a dedicated format are generated. After the embodiments of this application are introduced into the target system project in a modular manner, the target system only needs to consider the data collection and processing of notification indicators, thereby reducing the difficulty of developing report functions (such as cockpit functions, command and dispatch functions, and large-screen monitoring functions).

[0110] Please refer to Figure 15 , the embodiments of this application also provide a report visualization design device 1500. By providing a graphical user interface through a report visualization design terminal, the above report visualization design method can be implemented. The device 1500 includes the following modules:

[0111] A report environment configuration operation module 1501, which is configured to display a report type label interface in the graphical user interface in response to a report environment configuration operation for the report visualization design terminal.

[0112] A report type label dragging module 1502, which is configured to display a report field interface corresponding to the report type label dragging instruction in the graphical user interface in response to a report type label dragging instruction for the report type label interface.

[0113] A report field selection module 1503, which is configured to display a report preview interface corresponding to the report field selection instruction in the graphical user interface in response to a report field selection instruction for the report field interface; wherein, the report preview interface includes a plurality of visualization dashboard areas, and the visualization dashboard areas are used to display a target visualization report.

[0114] It can be understood that the content in the above method embodiments is applicable to the device embodiments of the present application. The functions specifically implemented by the device embodiments of the present application are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those of the above method embodiments.

[0115] An embodiment of the present application further provides an electronic device, which includes a memory and a processor. The memory stores a computer program, and when the processor executes the computer program, the above-mentioned report visualization design method is implemented. The electronic device can be any intelligent terminal including a tablet computer, an in-vehicle computer, etc.

[0116] It can be understood that the content in the above method embodiments is applicable to the device embodiments of the present application. The functions specifically implemented by the device embodiments of the present application are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those of the above method embodiments.

[0117] Please refer to Figure 16 , Figure 16 , which schematically shows the hardware structure of an electronic device in another embodiment. The electronic device includes:

[0118] A processor 1601, which can be implemented by using a general-purpose CPU (Central Processing Unit), a microprocessor, an application-specific integrated circuit (ASIC), or one or more integrated circuits, etc., and is configured to execute relevant programs to implement the technical solutions provided by the embodiments of the present application;

[0119] The memory 1602 can be implemented in the form of a read-only memory (ROM), a static storage device, a dynamic storage device, or a random access memory (RAM), etc. The memory 1602 can store an operating system and other application programs. When implementing the technical solutions provided in the embodiments of this specification through software or firmware, the relevant program codes are stored in the memory 1602 and are called by the processor 1601 to execute the report visualization design method of the embodiments of this application;

[0120] The input / output interface 1603 is used to implement information input and output;

[0121] The communication interface 1604 is used to implement communication and interaction between this device and other devices. Communication can be achieved through wired means (such as USB, network cable, etc.) or through wireless means (such as mobile network, WIFI, Bluetooth, etc.);

[0122] The bus 1605 transmits information between various components of the device (such as the processor 1601, the memory 1602, the input / output interface 1603, and the communication interface 1604);

[0123] Among them, the processor 1601, the memory 1602, the input / output interface 1603, and the communication interface 1604 achieve communication connections with each other inside the device through the bus 1605.

[0124] The embodiments of this application also provide a computer-readable storage medium. The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, it implements the above-mentioned report visualization design method.

[0125] It can be understood that the content in the above method embodiments is applicable to the embodiments of this storage medium. The functions specifically implemented by the embodiments of this storage medium are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those of the above method embodiments.

[0126] As a non-transitory computer-readable storage medium, the memory can be used to store non-transitory software programs and non-transitory computer-executable programs. In addition, the memory can include high-speed random access memory, and can also include non-transitory memory, such as at least one magnetic disk storage device, a flash memory device, or other non-transitory solid-state storage devices. In some embodiments, the memory optionally includes a memory remotely set relative to the processor, and these remote memories can be connected to the processor through a network. Examples of the above network include but are not limited to the Internet, an enterprise intranet, a local area network, a mobile communication network, and combinations thereof.

[0127] The report visualization design method, report visualization design device, electronic device, and storage medium provided by the embodiments of the present application provide a graphical user interface through a report visualization design terminal. By responding to a report environment configuration operation for the report visualization design terminal, a report type label interface is displayed in the graphical user interface; in response to a report type label dragging instruction for the report type label interface, a report field interface corresponding to the report type label dragging instruction is displayed in the graphical user interface; in response to a report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein, the report preview interface includes several visualization dashboard areas, and the visualization dashboard areas are used to display the target visualization report. The embodiments of the present application intuitively design reports through interactive operations such as dragging and selecting on the graphical user interface, solve the problems of unintuitive report design and cumbersome operations, enable designers to intuitively configure the report environment, select report types and fields, etc., without writing complex codes or instructions, greatly simplify the report design process, reduce the complexity of report design, thereby improving the efficiency of report design. At the same time, the real-time preview function allows designers to instantly see the visual effects of the report during the design process, so as to be able to quickly adjust and optimize the report design to meet user needs; moreover, the report visualization design terminal of the embodiments of the present application supports the selection of multiple report types and fields, and multiple types of reports can be displayed simultaneously in the report preview interface, enabling designers to flexibly configure and create various types of visualization reports according to different business requirements and display purposes, enhancing the user experience.

[0128] The preferred embodiments of the embodiments of the present application have been described above with reference to the accompanying drawings, and thus do not limit the scope of rights of the embodiments of the present application. Any modifications, equivalent replacements, and improvements made by those skilled in the art without departing from the scope and essence of the embodiments of the present application shall be within the scope of rights of the embodiments of the present application.

Claims

1. A report visualization design method, characterized in that: Providing a graphical user interface through a report visualization design terminal, the method comprises the following steps: In response to a report environment configuration operation for the report visualization design terminal, displaying a report type label interface in the graphical user interface; In response to a report type label dragging instruction for the report type label interface, displaying a report field interface corresponding to the report type label dragging instruction in the graphical user interface; In response to a report field selection instruction for the report field interface, a report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein the report preview interface includes a plurality of visualization dashboard areas, and the visualization dashboard areas are used to display target visualization reports.

2. The method according to claim 1, characterized in that The step of displaying a report type label interface in the graphical user interface in response to the report environment configuration operation for the report visualization design terminal includes: In response to a terminal configuration type selection instruction for the report visualization design terminal, displaying a kanban management interface corresponding to the terminal configuration type selection instruction in the graphical user interface; In response to a report environment configuration operation on the kanban management interface, the report type label interface is displayed in the graphical user interface.

3. The method according to claim 1, characterized in that The step of responding to a report type label dragging instruction for the report type label interface and displaying a report field interface corresponding to the report type label dragging instruction in the graphical user interface includes: In response to a report type label selection instruction for the report type label interface, selecting a report type label to be edited; In response to a report type tag dragging instruction on the report type tag interface, displaying the selected report type tag to be edited in the report type tag interface; In response to a report type label editing instruction for the report type label to be edited, the report field interface corresponding to the report type label dragging instruction is displayed in the graphical user interface.

4. The method according to claim 1, characterized in that: The step of responding to a report field selection instruction for the report field interface and displaying a report preview interface corresponding to the report field selection instruction in the graphical user interface comprises: In response to a report field selection instruction for the report field interface, selecting target report display data; In response to a report field interface closing instruction for the report field interface, the report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface; wherein the report preview interface displays the selected target report display data, and the target report display data is displayed through the target visualization report.

5. The method according to claim 4, characterized in that The report preview interface includes at least one of the following: a report data configuration area and a report data preview area, and the method further includes: In response to a report data selection instruction for the report data configuration area, selecting a report field whose data display order is to be adjusted from the target report display data; In response to the report field order dragging instruction, the report fields whose data display order is to be adjusted and selected in the report data preview area are adjusted to the target data display order to update the data display order of the target report display data in the target visual report.

6. The method according to claim 1, characterized in that After the report preview interface corresponding to the report field selection instruction is displayed in the graphical user interface in response to the report field selection instruction for the report field interface, the method further includes: In response to a report interface switching instruction, displaying a report visualization interface corresponding to the report preview interface in the graphical user interface; In response to a data query instruction for the report visualization interface, the target visualization report is displayed in the report visualization interface.

7. The method according to claim 6, characterized in that The report visualization interface includes visualization display areas corresponding to the visualization kanban areas in the report preview interface, the number of the visualization display areas is consistent with the number of the visualization kanban areas, and the method further includes: When a plurality of report type tags are included in one of the visualization display areas, in response to a report type tag selection instruction, a target report type tag is selected; In response to the report type label switching instruction, a target visual report corresponding to the selected target report type label is displayed in the visual display area where the report type label switching instruction is executed.

8. A report visualization design device, characterized in that: A graphical user interface is provided through a report visualization design terminal, and the device includes the following modules: A report environment configuration operation module, used to display a report type label interface in the graphical user interface in response to a report environment configuration operation for the report visualization design terminal; A report type label drag module, configured to respond to a report type label drag instruction for the report type label interface and display a report field interface corresponding to the report type label drag instruction in the graphical user interface; A report field selection module is used to respond to a report field selection instruction for the report field interface and display a report preview interface corresponding to the report field selection instruction in the graphical user interface; wherein the report preview interface includes a plurality of visualization dashboard areas, and the visualization dashboard areas are used to display the target visualization report.

9. An electronic device, characterized in that: The electronic device comprises a memory and a processor, the memory stores a computer program, and the processor implements the method according to any one of claims 1 to 7 when executing the computer program.

10. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the method according to any one of claims 1 to 7 is implemented.

Images