Large screen page processing method, device, equipment and storage medium

Abstract

The present application provides a method, device, equipment and storage medium for processing a large-screen page, and relates to the field of data visualization. The method for processing a large-screen page can be applied to a large-screen end, and the method includes: receiving a configuration file of the large-screen page, the configuration file includes data request mode parameters of multiple components in the large-screen page, the data request mode parameters are used to indicate the request method for obtaining the rendering data of the component, and the data request mode parameters of different components may be the same or different; according to the data request mode parameters of each component in the configuration file, the rendering data of each component in the large-screen page is obtained from the server, and the large-screen page is rendered based on the rendering data of multiple components. Based on the different configurations of the data request acquisition parameters for different components in the configuration file, the number of interactions between the large-screen end and the server can be reduced to a certain extent, the occupation of network resources can be reduced, and the efficiency of data acquisition on the large-screen end can be improved.

Description

Technical Field

[0001] The present application relates to the field of data visualization, and in particular to a large-screen page processing method, device, equipment and storage medium. Background Art

[0002] In recent years, large-scale visualization screens have become increasingly popular. They have been widely used in various industries due to their beautiful, cool, intuitive and convenient data display methods. Various types of real-time monitoring screens, cockpits, smart service platforms, etc. have emerged in an endless stream.

[0003] The large screen page displays a lot of information, such as background, charts, animations, etc. At present, the existing large screen data update usually requires the large screen end to periodically send data update requests to the server end to obtain the updated data on the large screen page. Due to the large amount of data on the large screen page, the data interaction between the large screen end and the server end will occupy a lot of network resources. Summary of the invention

[0004] The embodiments of the present application provide a large-screen page processing method, device, equipment and storage medium to save network resources and improve data acquisition efficiency.

[0005] A first aspect of an embodiment of the present application provides a large-screen page processing method, which is applied to a large-screen terminal, and the method includes:

[0006] Receive a configuration file of a large-screen page, the configuration file including configuration parameters of multiple components in the large-screen page, the configuration parameters of each component including a data request mode parameter of the component, the data request mode parameter being used to indicate a request method for obtaining rendering data of the component;

[0007] Obtaining rendering data of each component in the large screen page from the server according to the data request mode parameters of each component in the configuration file;

[0008] The large-screen page is rendered based on the rendering data of the multiple components.

[0009] In an optional embodiment of the first aspect of the present application, if the data request mode parameter of the first component is a full-duplex communication protocol WebSocket parameter based on the transmission control protocol TCP, the first component is any one of the multiple components;

[0010] The obtaining, from the server, rendering data of each component in the large screen page according to the data request mode parameter of each component in the configuration file includes:

[0011] Sending a connection request to the server according to a data request mode parameter of the first component in the configuration file, wherein the connection request is used to request to establish a WebSocket connection with the server;

[0012] After the WebSocket connection is established, rendering data of the first component is obtained from the server.

[0013] In an optional embodiment of the first aspect of the present application, the method further includes:

[0014] A trigger instruction is sent to the server, where the trigger instruction is used to instruct the server to start a data change monitoring task, where the data change monitoring task is used to monitor whether the first component has data updated.

[0015] In an optional embodiment of the first aspect of the present application, if the data of the first component is updated, obtaining rendering data of the first component from the server after establishing the WebSocket connection includes:

[0016] receiving a data update message from the server, wherein the data update message includes an identifier of the first component, an update location of data in the first component, and updated data;

[0017] Re-render the first component in the large-screen page according to the updated position of the data in the first component and the updated data.

[0018] In an optional embodiment of the first aspect of the present application, if the data request mode parameter of the second component is a Hypertext Transfer Protocol HTTP parameter, the second component is any one of the multiple components;

[0019] The obtaining, from the server, rendering data of each component in the large screen page according to the data request mode parameter of each component in the configuration file includes:

[0020] Sending a data acquisition request to the server according to a data request mode parameter of the second component in the configuration file, wherein the data acquisition request is used to request rendering data of the second component;

[0021] A data acquisition response is received from the server, wherein the data acquisition response includes rendering data of the second component.

[0022] In an optional embodiment of the first aspect of the present application, the configuration file also includes configuration parameters of dependencies between components in the large-screen page, and the dependencies include nested relationships and / or event linkage relationships between components.

[0023] In an optional embodiment of the first aspect of the present application, if the configuration file includes configuration parameters of an event linkage relationship between the third component and the fourth component in the large screen page;

[0024] The method also includes: when updated data of the third component is obtained from the server, the third component and the fourth component in the large-screen page are re-rendered according to configuration parameters of the event linkage relationship between the third component and the fourth component in the configuration file.

[0025] In an optional embodiment of the first aspect of the present application, the configuration parameters of each component further include processing configuration parameters of rendering data of the component, and the processing configuration parameters include data source configuration, data set configuration, data indicator dimension configuration, and chart display data configuration;

[0026] The obtaining rendering data of each component in the large-screen page from the server includes:

[0027] Rendering data that meets the processing configuration requirements of each component in the large-screen page is obtained from the server.

[0028] In an optional embodiment of the first aspect of the present application, the type of the component includes at least one of the following: a background component, a container component, a chart component, a data component, and an animation component.

[0029] A second aspect of an embodiment of the present application provides a large-screen page processing device, including:

[0030] A receiving module, used to receive a configuration file of a large-screen page, wherein the configuration file includes configuration parameters of multiple components in the large-screen page, and the configuration parameters of each component include a data request mode parameter of the component, and the data request mode parameter is used to indicate a request method for obtaining rendering data of the component;

[0031] An acquisition module, used to acquire rendering data of each component in the large screen page from a server according to a data request mode parameter of each component in the configuration file;

[0032] A processing module is used to render the large-screen page based on the rendering data of the multiple components.

[0033] A third aspect of an embodiment of the present application provides an electronic device, including:

[0034] Memory;

[0035] Processor; and

[0036] Computer programs;

[0037] The computer program is stored in the memory and is configured to be executed by the processor to implement the method as described in any one of the first aspects.

[0038] A fourth aspect of an embodiment of the present application provides a computer-readable storage medium having a computer program stored thereon, wherein the computer program is executed by a processor to implement a method as described in any one of the first aspects.

[0039] A fifth aspect of an embodiment of the present application provides a computer program product, including a computer program, which implements any method in the first aspect when executed by a processor.

[0040] The embodiments of the present application provide a method, device, equipment and storage medium for processing a large-screen page. The method can be applied to a large-screen terminal, including: receiving a configuration file of the large-screen page, the configuration file includes data request mode parameters of multiple components in the large-screen page, the data request mode parameters are used to indicate the request method for obtaining the rendering data of the components, and the data request mode parameters of different components may be the same or different; according to the data request mode parameters of each component in the configuration file, the rendering data of each component in the large-screen page is obtained from the server, and the large-screen page is rendered based on the rendering data of multiple components. Based on the different configurations of the data request acquisition parameters for different components in the configuration file, the number of interactions between the large-screen terminal and the server can be reduced to a certain extent, the occupation of network resources can be reduced, and the efficiency of data acquisition on the large-screen terminal can be improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0041] In order to more clearly illustrate the embodiments of the present application or the technical solutions in the prior art, a brief introduction will be given below to the drawings required for use in the embodiments or the description of the prior art. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0042] Figure 1 A schematic diagram of a scenario of a method for processing a large-screen page provided in an embodiment of the present application;

[0043] Figure 2 A schematic diagram of components of a large-screen page provided in an embodiment of the present application;

[0044] Figure 3 A schematic diagram of the assembly of components of a large-screen page provided in an embodiment of the present application;

[0045] Figure 4 A schematic diagram of the configuration of the large screen page provided in the embodiment of the present application;

[0046] Figure 5Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 1 ;

[0047] Figure 6 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 2 ;

[0048] Figure 7 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 3 ;

[0049] Figure 8 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 4 ;

[0050] Fig. 9 A schematic diagram of the structure of a large-screen page processing device provided in an embodiment of the present application Figure 1 ;

[0051] Fig.10 A schematic diagram of the structure of a large-screen page processing device provided in an embodiment of the present application Figure 2 ;

[0052] Fig.11 A hardware structure diagram of an electronic device provided in an embodiment of the present application.

[0053] The above drawings have shown clear embodiments of the present application, which will be described in more detail later. These drawings and text descriptions are not intended to limit the scope of the present application in any way, but to illustrate the concept of the present application to those skilled in the art by referring to specific embodiments. DETAILED DESCRIPTION

[0054] In order to make the purpose, technical solution and advantages of the embodiments of the present application clearer, the technical solution in the embodiments of the present application will be clearly and completely described below in conjunction with the drawings in the embodiments of the present application. Obviously, the described embodiments are part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.

[0055] The terms "first", "second", etc. in the specification, claims, and the above-mentioned drawings of the embodiments of the present application are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the terms used in this way can be interchangeable where appropriate, so that the embodiments of the present application described herein can be implemented in an order other than that illustrated or described herein.

[0056] It should be understood that the terms "including" and "having" and any variations thereof used herein are intended to cover non-exclusive inclusions. For example, a process, method, system, product or apparatus comprising a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to these processes, methods, products or apparatuses.

[0057] In the description of the embodiments of the present application, the term "corresponding" may indicate a direct or indirect correspondence between two items, or an association relationship between the two items, or a relationship between indication and being indicated, configuration and being configured, and the like.

[0058] In response to the current problems with large-screen page data updates, the embodiment of the present application proposes a method for processing large-screen pages, and its main inventive ideas are as follows: Taking into account the different data update frequencies of different components in the large-screen page, the data request methods (or data acquisition methods) of different components can be configured separately. By configuring the data request of multiple components in the large-screen page, the large-screen end can interact with the server end according to the data request configuration of each component, using the corresponding data request mode, which can reduce the number of interactions between the large-screen end and the server end to a certain extent, reduce the occupation of network resources, and improve the efficiency of data acquisition on the large-screen end.

[0059] Before introducing the large-screen page processing method of the embodiment of the present application, the application scenario of the method is briefly introduced first.

[0060] Figure 1 A schematic diagram of a scenario of a large screen page processing method provided in an embodiment of the present application. Figure 1 As shown, the scenario includes a large screen terminal (referred to as the large screen terminal) 11 and a large screen server (referred to as the server) 12, and the large screen terminal 11 is connected to the server 12. As an example, the large screen terminal 11 sends a data acquisition request to the server 12, and the server 12 responds to the data acquisition request, acquires the large screen data and processes the data, and sends a data acquisition response to the large screen terminal 11.

[0061] Among them, the display page of the large screen terminal 11 can display multiple components, such as Figure 1 Among the components 0 to 5 shown, component 0 is a background component, and components 1 to 5 can be any of the following components: a container component, a chart component, a data component, an animation component, and components 1 to 5 can display different data contents respectively.

[0062] As an example, the large screen terminal 11 can Figure 1 The data acquisition process shown obtains rendering data of different components in the large-screen page from the server 12 .

[0063] The storage space of the server 12 stores a component library and a database. The component library includes various types of optional components. The database stores various types of data, and the data is filled into various components. The server 12 responds and executes backend services according to the configuration of the developer, and is specifically responsible for configuration analysis, data processing execution, data conversion processing, data change monitoring, asynchronous task management, etc.

[0064] In the large-screen development stage, developers can access the server 12 through the large-screen terminal 11 to customize the large-screen page. The development process of the large-screen page generally includes the following steps:

[0065] Step 1: Add dependencies between components, where the dependencies include nested relationships and / or event linkage relationships between components.

[0066] Step 2: Add an assembler and introduce the required background components, chart components, data components, animation components, etc. into the assembler.

[0067] Step 3: Set the main style and attribute parameters of each component.

[0068] Step 4: Perform data request configuration, data processing configuration, etc. Among them, data request configuration includes the configuration of the data request mode of each component in the large screen page, and data processing configuration includes the configuration of the data source, data set, data indicator dimension, and chart display data of the large screen page.

[0069] Step 5: After completing the above configuration, test and adjust the large-screen page to finally complete the large-screen development.

[0070] Figure 2 A schematic diagram of the components of a large-screen page provided in an embodiment of the present application. Figure 3 This is a schematic diagram of the assembly of components of a large screen page provided in an embodiment of the present application. Figure 2 , 3 As shown in the figure, the large-screen page is abstracted into five categories of components and implemented through the combination of component assemblers.

[0071] The following is a detailed description of each component and its configuration:

[0072] (1) Background component is the background display component of the entire large-screen page. The configuration of the background component includes three parts: basic properties, style themes, and component slots. Among them, the basic property configuration includes the adaptation of device size (can support multiple devices), transparency, etc., and the style theme configuration includes preset theme configuration and custom theme configuration. The component slot configuration includes the configuration of the integration of other component capabilities. For example, by integrating animation components, various animation effects such as background rotation, background scaling, and background translation can be achieved.

[0073] (2) Container components are container components for components such as chart components and custom components, and are mainly used for the planar and vertical layout of actual effective content on the large screen. The configuration of container components includes the configuration of three parts: basic properties, style themes, and component slots. Among them, the basic property configuration includes the configuration of the position information of the container component relative to the screen, the configuration of the layout method of the embedded components inside the container component, the configuration of the depth sorting of the container component, etc. The style theme configuration includes the configuration of various borders and filling styles of the large screen page. The component slot configuration includes the configuration of the content chart component inside the container component, as well as the configuration of the animation component embedded in the container component itself, which can achieve various animation control effects for the container as a whole.

[0074] (3) Chart components are components that realize data content display in various ways. The configuration of chart components includes three parts: chart type, style theme, and component slot. Among them, chart type configuration supports various types of charts such as curve charts, line charts, bar charts, pie charts, comparison charts, water drop charts, maps, and the earth. Style theme configuration provides chart styles with preset large-screen themes. Component slot configuration supports embedded array components and animation components, etc., which can realize the background data acquisition of charts and the dynamic effect conversion of charts.

[0075] (4) Data component: a component used to implement data acquisition. Its configuration includes data source configuration, data conversion configuration, and refresh configuration. The data source configuration supports various data source channels, such as local files, remote servers, files or data generated by real-time calculations, etc. The data conversion configuration supports data format conversion configuration. The data refresh configuration includes configurations such as data refresh frequency and whether to acquire in batches. The data component is generally used as an embedded component of the chart component, responsible for data acquisition and data processing for rendering and display by the chart component.

[0076] (5) Animation components are generally embedded in other components as embedded components to add animation transformation effects to other components. Animation component configuration includes preset animation, animation properties and other configurations. Among them, preset animation configuration includes configurations that support flipping, scrolling, translation, scaling, rotation and other effects. Animation property configuration provides configurations such as animation duration, execution times, execution frequency, execution direction, delay time, transition effect (linear, smooth, Bezier curve) and other configurations. After completing the animation component configuration, by embedding it into the slot of an external component (such as a container component), the external component can achieve the corresponding animation effect.

[0077] Figure 4 This is a schematic diagram of the configuration of the large screen interface provided in the embodiment of the present application. Figure 4As shown, the configuration of the large screen page determines the data interaction method and processing mode between the large screen and the server. Its configuration mainly includes: data request mode configuration, request and response format configuration, data execution frequency configuration, event linkage configuration, data processing reference configuration and data processing configuration.

[0078] Data request mode configuration: WebSocket data request mode and HTTP data request mode are provided. In the WebSocket data request mode, the server actively pushes the changed data to the large screen, and the large screen implements data refresh and display, which can achieve effective data push and avoid waste of network resources. It should be noted that the WebSocket data request mode requires the configuration of the execution frequency of the scheduled task, so that the server can regularly send WebSocket data requests to the large screen. In the HTTP data request mode, the large screen obtains data from the server through HTTP requests, and autonomously requests and refreshes the page.

[0079] Request and response body format configuration: Developers can customize the message body format and field content of their requests and responses.

[0080] Data execution frequency configuration: that is, the execution frequency configuration of data requests, which supports multiple configuration methods such as by seconds, by minutes, by hours, and custom intervals, and regularly triggers the data request process.

[0081] Event linkage configuration: After the data request is executed, it can be linked to trigger the execution of other data request processes, so different data requests and displays can be linked to trigger effects, achieving a more complex and exquisite page display effect. For example, the server actively pushes the change data of component 1 in the large screen page. Based on the event linkage configuration, it is determined that component 1 and component 2 are linked, and the server further pushes the change data of component 3.

[0082] Data processing reference information: This configuration references the data processing configuration. When the data request mode is HTTP request mode, the server loads and executes the data processing configuration according to the data processing index (or data processing number). When the data request mode is WebSocket request mode, the server-side scheduled task is triggered to monitor data changes according to the configured frequency. When data changes are detected, the server sends a WebSocket message to notify the large screen end to re-render the large screen page component.

[0083] Data processing configuration includes the configuration of chart data sources, which determines how to obtain data and how to process it into quality data that meets the requirements of large-screen display. Data processing configuration mainly includes the following configurations:

[0084] Data source configuration: Configure the url, driver, username, password and other information through the interface to implement data source configuration, which can support data sources such as jdbc, ElasticSearch, Kylin, etc.

[0085] Data result set (dataset) configuration: Based on the data source configuration, design the data set configuration, implement data query on the original data table or file of the data source by writing SQL, ES query statements, etc., and define the result set and the specific field information of the result set.

[0086] Data indicator dimension configuration: Based on the field results of the dataset query, select the fields and define some of them as indicators and some as dimensions to complete the definition of indicators and dimensions.

[0087] Chart display data configuration: Based on the indicator and dimension configuration, select the indicators and dimension data that are suitable for business requirements and user interests, configure, add filtered information, perform aggregate calculations, rename fields according to business meanings, etc., to achieve the final display data processing configuration.

[0088] After completing the above four configurations, a set of data processing configuration information is generated for reference during data request configuration.

[0089] The technical solutions provided by the embodiments of the present application are described in detail below through specific embodiments. It should be noted that the technical solutions provided by the embodiments of the present application may include part or all of the following contents, and the following specific embodiments may be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments.

[0090] Figure 5 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 1 .like Figure 5 As shown, the large screen page processing method of this embodiment includes:

[0091] Step 201: Receive a configuration file of a large-screen page. The configuration file includes configuration parameters of multiple components in the large-screen page. The configuration parameters of each component include a data request mode parameter of the component. The data request mode parameter is used to indicate a request method for obtaining rendering data of the component.

[0092] In this embodiment, the data request mode parameter of the component is used to indicate the request method for obtaining the rendering data of the component. Exemplarily, when the data request mode parameter is 0, it indicates that the request method for obtaining the rendering data of the component is an HTTP request; when the data request mode parameter is 1, it indicates that the request method for obtaining the rendering data of the component is a WebSocket request.

[0093] In an optional implementation, a corresponding data request mode may be configured according to the data update situation of the component. For example, if the data update of a component is periodic, the data request mode of the component is configured as HTTP request, and the large screen terminal periodically sends data acquisition requests to the server. For another example, if the data update of a component is non-periodic, the data request mode of the component is configured as WebSocket request, and the large screen terminal directly receives the data update message sent from the server.

[0094] Step 202: Obtain rendering data of each component in the large screen page from the server according to the data request mode parameters of each component in the configuration file.

[0095] In an optional implementation, if the data request mode of the component is an HTTP request, the large screen sends an HTTP request to the server to obtain the rendering data of the component from the server. In this implementation, the data update of the component is also based on the HTTP request, for example, the large screen periodically sends an HTTP request to the server to obtain the latest rendering data of the component.

[0096] In an optional implementation, if the data request mode of the component is a WebSocket request, the large screen end does not actively send a data acquisition request. When receiving the rendering data of a component sent by the server, the component of the large screen page is re-rendered.

[0097] It should be noted that after the large screen and the server establish a WebSocket connection for the first time, the server does not need to send the component rendering data after receiving the data acquisition request, but directly sends the component rendering data to the large screen. This implementation method can reduce the number of signaling interactions between the large screen and the server, and reduce the occupation of network resources.

[0098] Optionally, in some embodiments, the configuration parameters of each component also include processing configuration parameters of the component's rendering data, and the processing configuration parameters include data source configuration, data set configuration, data indicator dimension configuration, and chart display data configuration.

[0099] In an optional implementation, the large screen end obtains rendering data that meets the processing configuration requirements of each component in the large screen page from the server end. That is, the server end processes the rendering data of each component according to the processing configuration parameters of the rendering data of each component, and sends the rendering data of the component to the large screen end after the processing configuration requirements of the component for the rendering data are met.

[0100] Step 203: Render the large-screen page based on the rendering data of multiple components.

[0101] The processing method of the large-screen page shown in this embodiment receives a configuration file of the large-screen page, which includes data request mode parameters of multiple components in the large-screen page. The data request mode parameters are used to indicate the request method for obtaining the rendering data of the components. The data request mode parameters of different components may be the same or different. According to the data request mode parameters of each component in the configuration file, the rendering data of each component in the large-screen page is obtained from the server, and the large-screen page is rendered based on the rendering data of multiple components. Based on the different configurations of the data request acquisition parameters for different components in the configuration file, the number of interactions between the large-screen end and the server can be reduced to a certain extent, the occupation of network resources can be reduced, and the efficiency of data acquisition on the large-screen end can be improved.

[0102] Figure 6 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 2 .like Figure 6 As shown, the large screen page processing method of this embodiment includes:

[0103] Step 301: The large-screen terminal receives a configuration file of the large-screen page.

[0104] Step 302: The large screen terminal establishes a WebSocket connection with the server terminal according to the configuration file.

[0105] Step 303: The large screen terminal sends a trigger instruction to the server terminal, and the trigger instruction is used to instruct the server terminal to start the data change monitoring task.

[0106] In this embodiment, the configuration file includes data request mode parameters of the first component in the large-screen page, and the first component is any one of the multiple components in the large-screen page.

[0107] Assuming that the data request mode parameter of the first component is a WebSocket parameter, the large screen terminal sends a connection request to the server terminal according to the data request mode parameter of the first component in the configuration file, and the connection request is used to request the large screen terminal to establish a WebSocket connection with the server terminal. After the WebSocket connection is established, the large screen terminal can obtain the rendering data of the first component from the server terminal.

[0108] In an optional implementation, after establishing the WebSocket connection, the large screen terminal can send a trigger instruction to the server according to the configuration file. Optionally, the trigger instruction includes the execution frequency of the data change monitoring task (i.e., the scheduled task), and the data change monitoring task is used to monitor whether the first component has data updates. The server monitors whether the first component has data updates based on the execution frequency of the data change monitoring task in the trigger instruction.

[0109] In an optional implementation, after the large screen terminal establishes a WebSocket connection with the server terminal, the server terminal can also automatically trigger a data change monitoring task for the large screen terminal connected thereto according to a pre-configuration, wherein the pre-configuration of the server terminal includes the execution frequency of the data change monitoring task.

[0110] Step 304: The server sends data update information to the large screen. (Optional)

[0111] In this embodiment, the server monitors whether the data of the first component is updated according to the execution frequency of the data change monitoring task. If the server detects that the data of the first component is updated, the server sends data update information to the large screen. Optionally, the data update message includes the identifier of the first component, the update location of the data in the first component, and the updated data.

[0112] Step 305: The large screen terminal re-renders the large screen page. (Optional)

[0113] In this embodiment, the large-screen end re-renders the first component in the large-screen page according to the updated position of the data in the first component and the updated data.

[0114] Exemplarily, the first component is a chart component, and when a parameter in the chart component changes, the large-screen end refreshes the parameter value in the first component in the large-screen page according to the position of the parameter in the chart component and the updated value of the parameter.

[0115] The processing method of the large screen page shown in this embodiment is that if the data request method of a component in the large screen page is a WebSocket request, after the large screen terminal establishes a WebSocket connection with the server, the component in the large screen page can be rendered directly by receiving the component data from the server, where the component data includes the component update data. This method can reduce the number of interactions between the large screen terminal and the server to a certain extent, reduce the occupation of network resources, and improve the efficiency of large screen data acquisition.

[0116] Figure 7 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 3 .like Figure 7 As shown, the large screen page processing method of this embodiment includes:

[0117] Step 401: The large-screen terminal receives a configuration file of the large-screen page.

[0118] Step 402: The large screen terminal sends a data acquisition request to the server terminal according to the configuration file.

[0119] Step 403: The server sends a data acquisition response to the large screen.

[0120] In this embodiment, the configuration file includes data request mode parameters of the second component in the large screen page, and the second component is any one of the multiple components in the large screen page.

[0121] Assuming that the data request mode parameter of the second component is an HTTP parameter, the large screen end sends a data acquisition request to the server end according to the data request mode parameter of the second component in the configuration file to request the rendering data of the second component. Specifically, the large screen end can initiate a data acquisition request to the server end at any time or periodically. Correspondingly, the server end obtains the data of the second component from the database according to the data acquisition request, and generates the rendering data of the second component after data processing. The server end sends a data acquisition response to the large screen end, and the response includes the rendering data of the second component generated after data processing.

[0122] It should be noted that one implementation method of the large screen terminal initiating a data acquisition request to the server at any time is: in response to the trigger operation of the large screen terminal user, initiating a data acquisition request to the server. This method is a supplement to the periodic acquisition of data by the large screen terminal and the direct delivery of data by the server, which can reduce the delay of data acquisition and display.

[0123] It should be noted that the second component of this embodiment is not necessarily related to the first component of the above embodiment, and is only used to distinguish and describe different implementation plans.

[0124] Exemplarily, taking the second component as a chart component, the chart component includes statistical data, which is calculated based on N data in the database. Assuming that at least one of the N data has changed, the server first obtains the latest N data, and after data processing, such as summation, obtains the statistical data of the N data. The server finally sends a data acquisition response to the large-screen end, and the response includes the updated statistical data.

[0125] Step 404: The large-screen end renders the large-screen page according to the rendering data in the data acquisition response.

[0126] The processing method of the large screen page shown in this embodiment is that if the data request method of a component in the large screen page is an HTTP request, after the large screen end establishes an HTTP connection with the server end, it can initiate a data acquisition request to the server end at any time, or it can initiate a data acquisition request to the server end according to the configured execution frequency. The server end returns the component data to the large screen end based on the data acquisition request to realize the rendering of the component data on the large screen end. This method supports manual triggering by the user of the large screen end, which can improve the efficiency of large screen data acquisition to a certain extent.

[0127] Based on the above embodiments, optionally, the configuration file also includes configuration parameters with dependencies between components in the large screen page, and the dependencies include nested relationships and / or event linkage relationships between components. Among them, the events in the event linkage relationship can be understood as update events (i.e., data updates within the components).

[0128] For an example of nested relationships between components, refer to Figure 2 , multiple container components can be nested in the background component, chart components can be nested in the container component, and data components and animation components can be nested in the chart component. It should be noted that the data acquisition method of components with nested relationships can refer to the above embodiment, which will not be repeated here.

[0129] Regarding the event linkage relationship between components, for example, the data in the data components in different container components may be related. For example, the data in data component 1 is determined based on the data in multiple other data components, such as the data in data components 2, 3, and 4. If the data in data component 2 is updated, in addition to re-rendering data component 2, data component 1 also needs to be rendered. In this example, data component 1 has an event linkage relationship with data components 2, 3, and 4, respectively.

[0130] Figure 8 Schematic diagram of the process of processing a large screen page provided in the embodiment of the present application Figure 4 .like Figure 8 As shown, the large screen page processing method of this embodiment includes:

[0131] Step 501: The large-screen terminal receives a configuration file of the large-screen page.

[0132] Step 502: The large screen terminal establishes a WebSocket connection with the server terminal according to the configuration file.

[0133] Step 503: The large screen terminal sends a trigger instruction to the server terminal, where the trigger instruction is used to instruct the server terminal to start a data change monitoring task.

[0134] Step 504: The server sends a data update message to the large screen.

[0135] Step 505: The large screen end re-renders the large screen page according to the configuration parameters of the event linkage relationship in the configuration file.

[0136] In this embodiment, if the configuration file includes configuration parameters that indicate an event linkage relationship between the third component and the fourth component in the large screen page. When the large screen end obtains updated data of the third component from the server, the third component and the fourth component in the large screen page are re-rendered according to the configuration parameters that indicate an event linkage relationship between the third component and the fourth component in the configuration file. The specific implementation methods include:

[0137] In an optional implementation, after determining that the data of the third component has been updated, the server determines the updated data (data processing) of the fourth component based on the configuration parameters of the event linkage relationship between the third component and the fourth component, and sends a data update message to the large-screen end, which includes the identifiers of the third component and the fourth component, the updated location of the data in the third component and the fourth component, and the updated data of the third component and the fourth component.

[0138] In this implementation, the server directly sends the latest update data of more than one component to the client based on the event linkage configuration between components in the configuration file, which can further reduce the number of data interactions between the large-screen end and the server and improve the efficiency of the large-screen end in obtaining page update data.

[0139] In an optional implementation, after determining that the data of the third component has been updated, the server sends a data update message to the large-screen end, which includes the identifier of the third component, the updated location of the data in the third component, and the updated data of the third component. After receiving the data update message, the large-screen end initiates a data acquisition request to the server according to the configuration parameters of the event linkage relationship between the third component and the fourth component in the configuration file, and the data acquisition request is used to request the server to return the updated data of the fourth component. After the server determines the updated data of the fourth component according to the data acquisition request, it returns the updated data of the fourth component to the large-screen end.

[0140] In this implementation, the server only actively pushes the original data in the database (this data refers to data that has not been processed), and the large screen end needs to actively initiate a request to obtain data in the associated components (this data refers to statistical data, that is, data that has been processed).

[0141] It should be noted that the third component and the fourth component of this embodiment are any two components in the large-screen page.

[0142] The processing method of the large screen page shown in this embodiment involves the re-rendering of at least two components with event linkage relationships in the large screen page. The large screen end can determine the target component that needs to be linked and updated based on the data update message sent by the server end and the event linkage relationship between the components in the configuration file, and initiate a target component data acquisition request to the server end. Alternatively, when the server end detects that a component has data updates, it further determines the update data of other components that have event linkage relationships with the component, and the server end can send the update data to the large screen end, thereby improving the speed at which the large screen page acquires the update data.

[0143] The above describes the large-screen page processing method provided by the embodiment of the present application. The following describes the large-screen page processing device provided by the embodiment of the present application.

[0144] The embodiment of the present application can divide the functional modules of the processing device of the large-screen page according to the above-mentioned method embodiment. For example, each functional module can be divided corresponding to each function, or two or more functions can be integrated into one processing module. The above-mentioned integrated module can be implemented in the form of hardware or in the form of software functional modules. It should be noted that the division of modules in the embodiment of the present application is schematic and is only a logical functional division. There may be other division methods in actual implementation. The following is an example of dividing each functional module corresponding to each function.

[0145] Fig. 9 A schematic diagram of the structure of a large-screen page processing device provided in an embodiment of the present application Figure 1 .like Fig. 9 As shown, the large-screen page processing device 600 provided in this embodiment includes: a receiving module 601 , an acquisition module 602 and a processing module 603 .

[0146] A receiving module 601 is used to receive a configuration file of a large screen page, wherein the configuration file includes configuration parameters of multiple components in the large screen page, and the configuration parameters of each component include a data request mode parameter of the component, and the data request mode parameter is used to indicate a request method for obtaining rendering data of the component;

[0147] The acquisition module 602 is used to acquire the rendering data of each component in the large screen page from the server according to the data request mode parameter of each component in the configuration file;

[0148] The processing module 603 is used to render the large-screen page based on the rendering data of the multiple components.

[0149] Fig.10 A schematic diagram of the structure of a large-screen page processing device provided in an embodiment of the present application Figure 2 .exist Fig. 9 Based on the device shown, Fig.10 As shown, the large-screen page processing device of this embodiment further includes: a sending module 604.

[0150] If the data request mode parameter of the first component is a parameter of a full-duplex communication protocol WebSocket based on a transmission control protocol TCP, the first component is any one of the multiple components;

[0151] A sending module 604, configured to send a connection request to the server according to a data request mode parameter of the first component in the configuration file, wherein the connection request is used to request to establish a WebSocket connection with the server;

[0152] The acquisition module 602 is used to acquire the rendering data of the first component from the server after the WebSocket connection is established.

[0153] In an optional embodiment of this embodiment, the sending module 604 is used to:

[0154] A trigger instruction is sent to the server, where the trigger instruction is used to instruct the server to start a data change monitoring task, where the data change monitoring task is used to monitor whether the first component has data updated.

[0155] In an optional embodiment of this embodiment, if the data of the first component is updated, the receiving module 601 is used to:

[0156] receiving a data update message from the server, wherein the data update message includes an identifier of the first component, an update location of data in the first component, and updated data;

[0157] The processing module 603 is used to re-render the first component in the large-screen page according to the updated position of the data in the first component and the updated data.

[0158] In an optional embodiment of this embodiment, if the data request mode parameter of the second component is a Hypertext Transfer Protocol HTTP parameter, the second component is any one of the multiple components;

[0159] A sending module 604, configured to send a data acquisition request to the server according to a data request mode parameter of the second component in the configuration file, wherein the data acquisition request is used to request rendering data of the second component;

[0160] The receiving module 601 is used to receive a data acquisition response from the server, where the data acquisition response includes rendering data of the second component.

[0161] In an optional embodiment of the present embodiment, the configuration file further includes configuration parameters of dependencies between components in the large-screen page, and the dependencies include nested relationships and / or event linkage relationships between components.

[0162] In an optional embodiment of this embodiment, if the configuration file includes configuration parameters of an event linkage relationship between the third component and the fourth component in the large screen page;

[0163] Processing module 603 is used to re-render the third component and the fourth component in the large-screen page according to the configuration parameters of the event linkage relationship between the third component and the fourth component in the configuration file when the updated data of the third component is obtained from the server.

[0164] In an optional embodiment of this embodiment, the configuration parameters of each component also include processing configuration parameters of rendering data of the component, and the processing configuration parameters include data source configuration, data set configuration, data indicator dimension configuration, and chart display data configuration;

[0165] The acquisition module 602 is used to acquire rendering data that meets the processing configuration requirements of each component in the large-screen page from the server.

[0166] In an optional embodiment of this embodiment, the type of the component includes at least one of the following:

[0167] Background components, container components, chart components, data components, animation components.

[0168] The large-screen page processing device provided in this embodiment can execute the technical solution of the large-screen end in any of the above-mentioned method embodiments. Its implementation principle and technical effect are similar and will not be repeated here.

[0169] Fig.11 The hardware structure diagram of the electronic device provided in the embodiment of the present application. Fig.11 As shown, the electronic device 700 provided in this embodiment includes:

[0170] Memory 701;

[0171] Processor 702; and

[0172] Computer programs;

[0173] Among them, the computer program is stored in the memory 701 and is configured to be executed by the processor 702 to implement the technical solution of the large screen end or the server end in any of the above method embodiments. The implementation principles and technical effects are similar and will not be repeated here.

[0174] Optionally, the memory 701 may be independent or integrated with the processor 702. When the memory 701 is a device independent of the processor 702, the electronic device 700 further includes a bus 703 for connecting the memory 701 and the processor 702.

[0175] The embodiment of the present application also provides a computer-readable storage medium on which a computer program is stored. The computer program is executed by the processor 702 to implement the technical solution of the large-screen end or the server end in any of the aforementioned method embodiments.

[0176] An embodiment of the present application provides a computer program product, including a computer program, which, when executed by a processor, implements the technical solution of the large-screen end or the server end in any of the aforementioned method embodiments.

[0177] The embodiment of the present application also provides a chip, including: a processing module and a communication interface, wherein the processing module can execute the technical solution of the large-screen end or the server end in any of the aforementioned method embodiments.

[0178] Furthermore, the chip also includes a storage module (such as a memory), the storage module is used to store instructions, the processing module is used to execute the instructions stored in the storage module, and the execution of the instructions stored in the storage module enables the processing module to execute the technical solution of the large-screen end or the server end in any of the aforementioned method embodiments.

[0179] It should be understood that the processor may be a central processing unit (CPU), other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), etc. A general-purpose processor may be a microprocessor or any conventional processor. The steps of the method disclosed in the invention may be directly implemented by a hardware processor or implemented by a combination of hardware and software modules in the processor.

[0180] The memory may include a high-speed RAM memory, and may also include a non-volatile storage NVM, such as at least one disk memory, and may also be a USB flash drive, a mobile hard disk, a read-only memory, a magnetic disk or an optical disk, etc.

[0181] The bus may be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. The bus may be divided into an address bus, a data bus, a control bus, etc. For ease of representation, the bus in the drawings of the present application is not limited to only one bus or one type of bus.

[0182] The above storage medium can be implemented by any type of volatile or non-volatile storage device or a combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic memory, flash memory, magnetic disk or optical disk. The storage medium can be any available medium that can be accessed by a general or special purpose computer.

[0183] An exemplary storage medium is coupled to a processor so that the processor can read information from the storage medium and write information to the storage medium. Of course, the storage medium can also be a component of the processor. The processor and the storage medium can be located in an application specific integrated circuit (ASIC). Of course, the processor and the storage medium can also exist as discrete components in an electronic device.

[0184] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application, rather than to limit it. Although the present application has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or replace some or all of the technical features therein with equivalents. However, these modifications or replacements do not cause the essence of the corresponding technical solutions to deviate from the scope of the technical solutions of the embodiments of the present application.

Claims

1. A method for processing large screen pages, It is characterized in that Applied to a large screen terminal, the method includes: Receive a configuration file of a large-screen page, the configuration file including configuration parameters of multiple components in the large-screen page, the configuration parameters of each component including a data request mode parameter of the component, the data request mode parameter being used to indicate a request method for obtaining rendering data of the component; Obtaining rendering data of each component in the large screen page from the server according to the data request mode parameters of each component in the configuration file; Rendering the large-screen page based on the rendering data of the multiple components; The method further comprises: Sending a trigger instruction to the server, wherein the trigger instruction is used to instruct the server to start a data change monitoring task, wherein the data change monitoring task is used to monitor whether a first component has data updated, and the first component is any one of the multiple components; The obtaining, from the server, rendering data of each component in the large screen page according to the data request mode parameter of each component in the configuration file includes: If the data of the first component is updated, receiving a data update message from the server, the data update message including an identifier of the first component, an update location of the data in the first component, and the updated data; Re-render the first component in the large-screen page according to the updated position of the data in the first component and the updated data.

2. The method according to claim 1, It is characterized in that If the data request mode parameter of the first component is a parameter of a full-duplex communication protocol WebSocket based on a transmission control protocol TCP, the first component is any one of the multiple components; The method further comprises: According to the data request mode parameter of the first component in the configuration file, a connection request is sent to the server, where the connection request is used to request to establish a WebSocket connection with the server.

3. The method according to any one of claims 1 to 2, It is characterized in that The configuration file also includes configuration parameters of dependencies between components in the large-screen page, where the dependencies include nested relationships and / or event linkage relationships between components.

4. The method according to claim 3, It is characterized in that If the configuration file includes configuration parameters for an event linkage relationship between the third component and the fourth component in the large screen page; The method further comprises: When the updated data of the third component is obtained from the server, the third component and the fourth component in the large-screen page are re-rendered according to the configuration parameters of the event linkage relationship between the third component and the fourth component in the configuration file.

5. The method according to any one of claims 1 to 2, It is characterized in that The configuration parameters of each component also include processing configuration parameters of the rendering data of the component, and the processing configuration parameters include data source configuration, data set configuration, data indicator dimension configuration and chart display data configuration; The step of obtaining rendering data of each component in the large screen page from the server includes: Rendering data that meets the processing configuration requirements of each component in the large-screen page is obtained from the server.

6. The method according to any one of claims 1 to 2, It is characterized in that The type of the component includes at least one of the following: Background components, container components, chart components, data components, animation components.

7. A large screen page processing device, It is characterized in that include: A receiving module, used to receive a configuration file of a large-screen page, wherein the configuration file includes configuration parameters of multiple components in the large-screen page, and the configuration parameters of each component include a data request mode parameter of the component, and the data request mode parameter is used to indicate a request method for obtaining rendering data of the component; An acquisition module, used to acquire rendering data of each component in the large screen page from a server according to a data request mode parameter of each component in the configuration file; A processing module, configured to render the large-screen page based on the rendering data of the multiple components; a sending module, used for sending a trigger instruction to the server, wherein the trigger instruction is used for instructing the server to start a data change monitoring task, wherein the data change monitoring task is used for monitoring whether a first component has data updated, wherein the first component is any one of the multiple components; The acquisition module is specifically configured to receive a data update message from the server if the data of the first component is updated, wherein the data update message includes an identifier of the first component, an update location of the data in the first component, and the updated data; Re-render the first component in the large-screen page according to the updated position of the data in the first component and the updated data.

8. An electronic device, It is characterized in that include: Memory; processor; as well as Computer programs; The computer program is stored in the memory and is configured to be executed by the processor to implement the method according to any one of claims 1 to 6.

9. A computer-readable storage medium, It is characterized in that A computer program is stored thereon, and the computer program is executed by a processor to implement the method according to any one of claims 1 to 6.

10. A computer program product, It is characterized in that The invention comprises a computer program, which implements the method according to any one of claims 1 to 6 when being executed by a processor.

Images