Component visualization method and device and electronic equipment

Abstract

The invention relates to the technical field of Internet of Things, in particular to a component visualization method and device and electronic equipment, and the method comprises the steps: for any to-be-displayed component corresponding to a webpage, determining configuration information of data required for rendering any to-be-displayed component on a display interface; determining at least one related component associated with any one to-be-displayed component from the configuration information, and a data identifier of target data required for rendering any one to-be-displayed component in the data corresponding to each related component; for any related component, based on the component identifier of any related component and the data identifier of the target data, obtaining the target data from the target memory; and using the obtained target data to render any to-be-displayed component on a display interface. Through the method, data sharing among the components can be realized, so that the running memory resources are reduced, and the performance is improved.

Description

Technical Field

[0001] The present application relates to the technical field of Internet of Things, and in particular to a component visualization method, device and electronic device. Background Art

[0002] In the field of Internet of Things, web configuration is a graphical programming and monitoring system construction method based on Web technology. It allows users to quickly build monitoring screens and web pages that meet the application scenarios of the Internet of Things through a browser interface and by visually dragging components.

[0003] The components of Web configuration are the basic elements that constitute its visual interface and functional modules. Configuring the data source is a key step to ensure that Web configuration can correctly display the real-time status of IoT application scenarios. However, for different components, data sources are currently configured separately and each obtains data from the data source, resulting in resource waste and performance consumption during the operation of Web configuration. Summary of the invention

[0004] The embodiments of the present application provide a component visualization method, device and electronic device, which can alleviate the problems of resource waste and performance consumption during Web configuration operation.

[0005] In a first aspect, an embodiment of the present application provides a component visualization method, the method comprising:

[0006] For any component to be displayed corresponding to the webpage, determine configuration information of data required for rendering the component to be displayed on the display interface;

[0007] Determine from the configuration information at least one related component associated with any one of the components to be displayed, and a data identifier of target data required to render any one of the components to be displayed from the data corresponding to each of the related components;

[0008] For any relevant component, based on the component identifier of the any relevant component and the data identifier of the target data, acquiring the target data from the target memory;

[0009] Utilize the acquired target data to render any one component to be displayed on the display interface.

[0010] In a possible implementation manner, the configuration information further includes a first processing rule corresponding to data required for rendering any one of the components to be displayed;

[0011] The using the acquired target data to render any one of the components to be displayed on the display interface includes:

[0012] When a target event in the first processing rule is determined to be triggered based on the acquired target data, a target service for processing the target event in the first processing rule is determined;

[0013] The target service is called by a pre-deployed rule engine to process the target event, and any one of the components to be displayed is rendered using the result of processing the target event.

[0014] In a possible implementation manner, the configuration information further includes a second processing rule corresponding to the data required for rendering any one of the components to be displayed;

[0015] The acquiring the target data from the target memory includes:

[0016] Periodically acquiring the target data from the target memory;

[0017] The using the acquired target data to render any one of the components to be displayed on the display interface includes:

[0018] Based on the data analysis method in the second processing rule, the target data is analyzed by a pre-deployed time series analysis service, wherein the data analysis method includes any one of aggregation, classification, and prediction;

[0019] Rendering any one of the components to be displayed on the display interface using an analysis result obtained after analyzing the target data.

[0020] In a possible implementation manner, the configuration information further includes a data conversion method corresponding to the data required for rendering any one of the components to be displayed;

[0021] The using the acquired target data to render any one of the components to be displayed on the display interface includes:

[0022] The acquired target data is format-converted according to the data conversion format, and the format-converted target data is used to render any one of the components to be displayed on the display interface.

[0023] In a possible implementation, the method further includes:

[0024] Using the configuration information, a general configuration template is obtained;

[0025] Storing the general configuration template in a pre-built template library;

[0026] When rendering other components, the general configuration template is obtained from the template library, and the configuration information of the other components is obtained using the general configuration template.

[0027] In a possible implementation manner, after rendering any one of the components to be displayed on the display interface, the method further includes:

[0028] If it is detected that, in the data corresponding to any one of the related components, the target data required for rendering any one of the components to be displayed is updated, the updated target data is used to re-render the any one of the components to be displayed.

[0029] In a second aspect, an embodiment of the present application provides a visualization device, the device comprising:

[0030] A configuration information determination module is used to determine, for any component to be displayed corresponding to a web page, configuration information of data required for rendering the component to be displayed on a display interface;

[0031] A related component determination module, used to determine from the configuration information at least one related component associated with any one of the components to be displayed, and a data identifier of target data required to render any one of the components to be displayed in the data corresponding to each of the related components;

[0032] A data acquisition module, configured to acquire the target data from a target memory based on a component identifier of any relevant component and a data identifier of the target data;

[0033] A display module is used to render any one component to be displayed on the display interface using the acquired target data.

[0034] In a third aspect, an embodiment of the present application provides an electronic device, the electronic device comprising:

[0035] At least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor executes the method as described in the first aspect above.

[0036] In a fourth aspect, an embodiment of the present application provides a computer storage medium, wherein the computer storage medium stores a computer program, and the computer program is used to enable a computer to execute the method in the first aspect as described above.

[0037] In a fifth aspect, an embodiment of the present application provides a computer program product, which implements the method in the first aspect above when the computer program is executed by a processor.

[0038] A component visualization method provided in an embodiment of the present application configures configuration information of data required for rendering a component to be displayed, so as to facilitate data acquisition and data processing. In terms of data acquisition, associated related components are configured in the configuration information, and a data source association function module is deployed on the server side to associate the component to be displayed with related components, thereby realizing data sharing between components, reducing running memory resources and improving performance.

[0039] In terms of data processing, a data format conversion script is configured in the configuration information, and a data format conversion function module is deployed on the server side to convert the data format of the acquired data according to the configuration information, reduce the component's dependence on the data source format, and improve the compatibility of component data; data processing rules can also be configured in the configuration information to introduce the powerful data processing and prediction capabilities of the IoT platform timing analysis service into the Web configuration construction, enhancing the data analysis visualization capabilities of the Web configuration; rule application data source configuration is also added to the configuration information, and complex business logic capabilities can be flexibly configured with the help of the IoT platform rule engine service, so that the Web configuration can be applied to richer business scenarios; configuration information import and export functions are provided, and a template library is introduced to template the component's configuration information, so that one-time configuration can be used in multiple places, simplifying the configuration process, reducing duplication of work, and improving interaction efficiency. BRIEF DESCRIPTION OF THE DRAWINGS

[0040] Figure 1 A schematic diagram of an application scenario of a component visualization method according to an exemplary embodiment of the present invention;

[0041] Figure 2 A schematic diagram of a flow chart of a component visualization method according to an exemplary embodiment of the present invention;

[0042] Figure 3 A schematic diagram of exporting and importing a template according to an exemplary embodiment of the present invention;

[0043] Figure 4 A schematic diagram of configuring data source configuration information according to an exemplary embodiment of the present invention;

[0044] Figure 5 A schematic diagram of data format conversion according to an exemplary embodiment of the present invention;

[0045] Figure 6 A schematic diagram of a rule engine service instance call according to an exemplary embodiment of the present invention;

[0046] Figure 7 A schematic diagram of a device monitoring process according to an exemplary embodiment of the present invention;

[0047] Figure 8A schematic diagram of a data analysis process according to an exemplary embodiment of the present invention;

[0048] Fig. 9 A schematic diagram of calling a timing analysis service instance according to an exemplary embodiment of the present invention;

[0049] Fig.10 A schematic diagram of a data aggregation process according to an exemplary embodiment of the present invention;

[0050] Fig.11 A schematic diagram of an update event monitoring according to an exemplary embodiment of the present invention;

[0051] Fig.12 A schematic diagram of a component visualization device according to an exemplary embodiment of the present invention;

[0052] Fig.13 The figure is a schematic diagram of an electronic device according to an exemplary embodiment of the present invention. DETAILED DESCRIPTION

[0053] In order to make the purpose, technical scheme and advantages of the present application clearer, the technical scheme in the embodiment of the present application will be clearly and completely described below in conjunction with the drawings in the embodiment of the present application. Obviously, the described embodiment is only a part of the embodiment of the present application, rather than all the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in the field without making creative work are within the scope of protection of the present application. In the absence of conflict, the embodiments in the present application and the features in the embodiments can be arbitrarily combined with each other. In addition, although the logical order is shown in the flow chart, in some cases, the steps shown or described can be performed in an order different from that here.

[0054] The acquisition, storage, use, and processing of data in the embodiments of this application comply with the relevant provisions of national laws and regulations.

[0055] First, some concepts involved in the embodiments of the present application are introduced.

[0056] Component: Also known as Web component, it is a functional module that can be visualized.

[0057] Configuration information: It can also be called data source configuration information, which contains some configuration items corresponding to the data required to render the component to be displayed, such as data format conversion scripts.

[0058] Related components: can be configured in the configuration information corresponding to the component to be displayed, which is related to the component to be displayed.

[0059] Web configuration: also known as web page, Web configuration is a graphical programming and monitoring system construction method based on Web technology. It allows users to quickly build monitoring screens and Web pages that meet the application scenarios of the Internet of Things through a browser interface and by visually dragging components.

[0060] The components of WEB configuration are the basic elements that constitute its visual interface and functional modules, such as basic components (text boxes, pictures, etc.), interactive components (buttons, switches, etc.), chart components (line charts, bar charts, pie charts, maps, etc.), media components (Hikvision video, Dahua video, etc.), industrial components (indicator lights, pipes, fans, flow meters, etc.). Configuring the data source is a key step to ensure that the Web configuration can correctly display the real-time status of the IoT application scenario.

[0061] Data source: In the embodiment of the present application, the data source is the source of data, which can be an IoT device, such as an air conditioner, a fan, etc. The data source can be divided into a static data source and a dynamic data source.

[0062] Static data source: It is static data manually filled in or imported into tables, compressed packages, etc., mainly used for static display on the Web.

[0063] Dynamic data source: Data acquisition of dynamic data source can include the following two types:

[0064] (1) Bind the historical or latest data of the devices connected to the IoT platform, that is, connect the real-time or historical data of the IoT platform devices to the dynamic visualization through configuration to achieve the effect of digital twins;

[0065] (2) Calling the internal application programming interface (API) of the IoT platform or the API of a third-party system. This method is mainly used in customized business scenarios, such as calling the API of a third-party energy management platform to build a large configuration screen that dynamically displays energy usage.

[0066] The component visualization method in the embodiment of the present application is described in detail below with reference to the accompanying drawings.

[0067] like Figure 1 As shown, an application scenario of a component visualization method provided by an embodiment of the present application includes a server 101, at least one component to be displayed (such as Figure 1 102_1, 102_2, ... 102_N) and display 103 are shown in the figure.

[0068] The server 101 is used for processing data required for rendering each component to be displayed according to configuration information of at least one component to be displayed, and rendering each component to be displayed on a display interface of the display 103 .

[0069] 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, content delivery networks (CDN), and big data and artificial intelligence platforms, but the embodiments of the present application do not specifically limit this.

[0070] Based on the problem that in the prior art, data sources are configured separately and data from the data sources are obtained separately, which leads to resource waste and performance consumption during the operation of the Web configuration, the embodiment of the present application proposes a component visualization method, such as Figure 2 The process described herein comprises:

[0071] S201: For any component to be displayed corresponding to a webpage, determine configuration information of data required for rendering the component to be displayed on a display interface.

[0072] The above configuration information is configured by the technician on the display interface of the display 103. The configuration information contains multiple configuration items corresponding to the data required for rendering the components to be displayed. The configuration items corresponding to the data may include data processing rules, data sources, etc., which are not specifically limited in the embodiments of the present application. The configuration information corresponding to different components to be displayed may be the same or different. For example, for the scene of "displaying the temperature data of the air conditioner", the "broken line" component and the "histogram" component can be used for display, and the configuration information of the "broken line" component and the "histogram" component can be the same.

[0073] For scenarios where the configuration information corresponding to different components to be displayed may be the same, an embodiment of the present application provides a solution for exporting the already configured configuration information as a universal configuration template. If the technician believes that the configuration information of the current component is highly universal, it can be exported as a universal configuration template and stored in a pre-built template library so that when rendering other components, the corresponding configuration information can be obtained using the template selected from the template library. For example, the template may only contain a certain processing rule, or only contain a data format conversion script, so that after the technician imports the template, there is no need to rewrite the data format conversion script.

[0074] like Figure 3As shown, the configuration information of component 1 is exported as template 1; the configuration information of component 2 is exported as template 3; the configuration information of component 3 is exported as template 2; component 4 obtains template 3 from the template library to obtain configuration information; component 5 obtains template 4 from the template library to obtain configuration information. In addition, the embodiment of the present application also provides a solution for modifying the imported general configuration template, and the technician can modify the imported template according to the needs.

[0075] The following is based on Figure 4 This section describes in detail the process of exporting configuration information into templates and importing templates.

[0076] After configuring the configuration information of component 1, export the configuration information of component 1 and generate a general configuration template, which is saved in the template library. When configuring the configuration information of component 2, select the imported general configuration template through the display interface, select a suitable general configuration template from the template library, parse the template and fill it into the configuration information of component 2, and then determine whether to respond to the modification instruction. If so, modify the configuration information according to the information in the response instruction and then determine that the configuration is completed. Otherwise, directly determine that the configuration is completed.

[0077] S202: Determine from the configuration information at least one related component associated with the any one component to be displayed, and a data identifier of target data required to render the any one component to be displayed from data corresponding to each related component.

[0078] When configuring the configuration information of the data source, the technician can first determine at least one related component associated with the component to be displayed, wherein the data required for rendering at least the related component overlaps with the data for rendering the component to be displayed, that is, the data corresponding to the component to be displayed can be obtained from the data corresponding to one or more related components; in addition, if part of the data corresponding to the component to be displayed cannot be obtained from the data of the related component, it is necessary to obtain it from the data source separately. After the data corresponding to the related component and the component to be displayed are obtained from the data source, they are stored in their respective memories for easy reading.

[0079] After determining the relevant components from the configuration information, it is necessary to further determine which data in the relevant component data is required by the component to be displayed, which can be determined by using data identifiers. For example, the data identifier can be a data name (such as "air conditioning temperature data", "fan speed data"); it can also be a data number (such as "001", "002").

[0080] S203: For any relevant component, based on the component identifier of the any relevant component and the data identifier of the target data, obtain the target data from the target memory.

[0081] When rendering the component to be displayed, the data identifier can be used to find the target data from the memory corresponding to the relevant component.

[0082] For example, the first part of the data of the component to be displayed overlaps with the data of component 1, the second part of the data overlaps with the data of component 2, and the third part of the data does not overlap. When rendering the component to be displayed, it is necessary to obtain the first part of the data from the memory corresponding to component 1 based on the data identifier; obtain the second part of the data from the memory corresponding to component 2; and obtain the third part of the data from the data source, where the data source can be obtained through configuration information.

[0083] By associating the component to be displayed with related components, and obtaining data from the target memory corresponding to the related component when rendering the component to be displayed, that is, the same data can be stored only once, without storing the data corresponding to each component, so that data sharing can be achieved, and the waste of memory resources can be reduced. When running the Web configuration and rendering each component, there is no need to access data in multiple memories, thereby improving performance.

[0084] S204: Rendering any one component to be displayed on the display interface using the acquired target data.

[0085] For different scenarios, the obtained target data may need to be further processed before it can be displayed. The processing of the target data may include the following methods:

[0086] (1)Data conversion.

[0087] For a component to be displayed, it may be necessary to integrate data of different data structures for display. For example, for a visualization scene of air conditioner usage, it may be necessary to integrate air conditioner switch data (0 for off, 1 for on), temperature data (26°C), operating time data (October 31, 2024 - November 1, 2024) and other types of data. However, due to the different data formats of these data, they cannot be directly integrated and need to be further converted.

[0088] The current method for data format conversion is to customize the development of APIs to achieve data format conversion. However, data from the same data source may require customized development of different APIs in order to adapt to different components, increasing development costs.

[0089] In the embodiment of the present application, a data format conversion function module is built into the server 101, and the data format conversion function module realizes the conversion of the data format by identifying a pre-configured data format conversion script. Among them, the data format conversion script can be configured in the configuration information, and the data format conversion script can be written in Java or JavaScript programming language. In addition, other functions, such as parameter filtering, numerical operation, etc., can also be written in the data format conversion script, which is not specifically limited in the embodiment of the present application.

[0090] like Figure 5 As shown, after obtaining the target data from the data source, the target data can first be converted according to the data format conversion script in the configuration information. The data of data source 1 is converted by data format conversion script 1 to render component 1; the data of data source 1 is converted by data format conversion script 2 to render component 2; the data of data source 2 is converted by data format conversion script 3 to render component 3; the data of data source 2 is directly rendered to component 4 without conversion.

[0091] In the embodiment of the present application, the data format conversion can be performed after the data is obtained from the data source, and then the converted data is stored in the memory, or the original data can be stored in the memory, and the data format conversion is performed when the data is read from the memory. This embodiment of the present application is not specifically limited to this.

[0092] (2) First processing rule.

[0093] Similarly, when performing flexible and complex business logic such as conditional judgment, difference or value on the original data of the data source, it is necessary to customize the development of backend service API based on different business scenarios, which increases the development cost. Based on this, the embodiment of the present application deploys a rule engine service in service 101, which can bind the corresponding service instance to the display component to realize the processing of data. Figure 6 As shown, instance 1 is called to implement the rendering of component 1 and component 3; instance 2 is called to implement the rendering of component 2, and instance 3 is called to implement the rendering of component 4.

[0094] In an embodiment of the present application, the rule engine service can support operations such as filtering, transforming, and forwarding real-time or historical data, and monitor IoT device events, and process events according to rules to implement complex business logic.

[0095] If the configuration information includes a first processing rule, when rendering the component to be displayed, when the target event in the first processing rule is determined to be triggered based on the acquired target data, the target service for processing the target event in the first processing rule is determined; the target service is called by a pre-deployed rule engine to process the target event, and any one of the components to be displayed is rendered using the result of processing the target event.

[0096] like Figure 7 As shown, the IoT devices are monitored, that is, the data of the acquired IoT devices are detected to determine whether the latest value of device 1 is greater than 1. If so, it is determined whether device 2 is offline. If device 2 is offline, it is determined to trigger target event 1, call target service 2 to generate alarm information, and display the alarm information; if device 2 is not offline, it is determined to trigger target event 2, call target service 2 to display the status information of device 2; if the latest value of device 1 is not greater than 1, it is determined not to trigger the event and not to call the service.

[0097] (3) Second processing rule.

[0098] At present, the Web configuration construction lacks data analysis functions such as data aggregation, sampling, and prediction. When it is necessary to build a Web configuration screen with data analysis capabilities, it is necessary to customize the data analysis API on the server side, which increases the development cost. In the embodiment of the present application, in order to realize the data analysis function, a timing analysis service is deployed on server 101. The timing analysis service can timely detect abnormal situations such as equipment failures and environmental changes through the analysis of timing data, and can also predict future trends and changes. The timing analysis service supports the aggregation, classification, and prediction of multiple device data, and then presents it in the form of various visual charts such as tables, line charts, histograms, pie charts, heat maps, TopN ranking charts, etc. The second processing rule can be configured in the configuration information, and the second processing rule can include the period for obtaining the target data, such as 1 day, 1 hour, etc., or it can be to obtain historical data for 1 month.

[0099] If the configuration information includes a second processing rule, when rendering the component to be displayed, first, according to the "time period" in the second processing rule, the target data is periodically obtained from the target memory; then, based on the data analysis method in the second processing rule, the target data is analyzed by a pre-deployed time series analysis service, and the data analysis method includes any one of aggregation, classification, and prediction; using the analysis result obtained after analyzing the target data, any one of the components to be displayed is rendered on the display interface.

[0100] like Figure 8As shown, the historical data of IoT device 1 is aggregated and averaged and data predicted using the time series analysis service, and the historical data of IoT device 2 is aggregated and maximum valued and data predicted. The two prediction results are integrated and presented in a line graph.

[0101] For the "Chart" component, you can directly bind the chart instance corresponding to the time series analysis service and associate the data generated by the instance with the chart component. Fig. 9 As shown, instance 1 (polyline) is used to render component 1 and component 2 (polyline Figure 1 and polyline Figure 2 ); Instance 2 (pie chart) is used to render component 4 (pie Figure 1 ); Instance 3 (bar graph) is used to render component 3 (bar graph) Figure 1 ). Table 1 shows the correspondence between the timing analysis service chart instance and the components. When configuring the data source configuration information, the technician can configure an appropriate timing analysis chart instance according to Table 1.

[0102] Table 1

[0103] Timing Analysis Chart Example WEB configuration can be associated with components sheet sheet Line chart Line chart, histogram Bar Chart Line chart, bar chart, pie chart Pie Chart Pie chart, bar chart Heatmap Heatmap Histogram Histogram, line chart, table TopN ranking chart Line chart, bar chart, histogram, table

[0104] In addition to the above-mentioned time series analysis service being able to process time series type data (such as "room temperature measured by the air conditioner within a day"), the data aggregation function module deployed on the server 101 can also be used to implement aggregation operations on the device's historical data, such as average, cumulative quantity, sum, minimum value, and maximum value. For different business scenarios, technicians can choose a time series analysis service or a data aggregation function module to analyze the time series data. Specifically, when it is necessary to obtain data in real time and perform analysis on a business (with a relatively large amount of data), a time series analysis service can be selected. When it is only necessary to obtain historical data for analysis on a business (with a relatively small amount of data), a data aggregation function module can be selected. This embodiment of the present application does not specifically limit this.

[0105] like Fig.10 As shown in the figure, the historical data of IoT device 1 is read from the target memory, and the data aggregation function module is used to perform aggregation operation to obtain the maximum value, and then the aggregation result is used to render component 1; the historical data of IoT device 1 is aggregated and calculated through the data aggregation function module to obtain the minimum value, and then the aggregation result is used to render component 2; the historical data of IoT device 1 is directly used to render component 3. The device data is first subjected to appropriate aggregation preprocessing, and then the processed data is passed to the configuration component for visual display, which improves the flexibility of configuration data configuration and meets the needs of different business scenarios.

[0106] (4)Data update.

[0107] If it is detected that, in the data corresponding to any one of the related components, the target data required for rendering any one of the components to be displayed is updated, the updated target data is used to re-render the any one of the components to be displayed.

[0108] Since the data required for rendering the component to be displayed is obtained from the memory corresponding to at least one related component, when the data corresponding to the related component is updated, the data to be displayed needs to be re-rendered using the updated data.

[0109] like Fig.11 As shown, an event channel is pre-deployed on server 101 to monitor update events. When it is determined that component 1 has data update, it is necessary to determine whether each component is associated with component 1. Taking component 2 as an example, if component 2 is associated with component 1, and the updated data in component 1 is required by component 2, then the data of component 2 is synchronized and component 2 is re-rendered, that is, component 2 is re-rendered with the updated data. Otherwise, no processing is performed, that is, the currently displayed component 2 is not processed. In addition, the event channel can also monitor other events, such as Figure 7 The target event to be triggered is determined based on the data of the device.

[0110] A component visualization method provided in the embodiment of the present application integrates functions such as data source association, data format conversion, data aggregation, data analysis, business processing, and configuration templates to better display components. Among them, the data source association function can realize data sharing between components, reduce running memory resources and improve performance; the data format conversion function can reduce the dependence of components on data source formats and improve the compatibility of component data; the data aggregation function can improve the flexibility of using the data source of the configuration device to meet the needs of different business scenarios; the powerful data processing and prediction capabilities of the timing analysis service of the Internet of Things platform are introduced into the Web configuration construction, which can enhance the data analysis visualization capabilities of the Web configuration; the rule application data source configuration is increased, and the complex business logic capabilities can be flexibly configured with the help of the Internet of Things platform rule engine service, so that the Web configuration can be applied to more abundant business scenarios; the data source configuration import and export function is provided, and the template library is introduced to template the component data source configuration, so that one-time configuration can be used in multiple places, simplify the configuration process, reduce duplication of work, and improve interaction efficiency.

[0111] Based on the same inventive concept, the embodiment of the present application also provides a component visualization device, such as Fig.12 As shown, the device comprises:

[0112] The configuration information determination module 1201 is used to determine, for any component to be displayed corresponding to the web page, configuration information of data required for rendering the component to be displayed on the display interface;

[0113] A related component determination module 1202 is used to determine, from the configuration information, at least one related component associated with any one of the components to be displayed, and a data identifier of target data required to render any one of the components to be displayed in the data corresponding to each of the related components;

[0114] The data acquisition module 1203 is used to acquire the target data from the target memory based on the component identifier of any related component and the data identifier of the target data.

[0115] The display module 1204 is used to render any one component to be displayed on the display interface using the acquired target data.

[0116] In a possible implementation manner, the configuration information further includes a first processing rule corresponding to data required for rendering any one of the components to be displayed;

[0117] The display module 1204 is used to:

[0118] When a target event in the first processing rule is determined to be triggered based on the acquired target data, a target service for processing the target event in the first processing rule is determined;

[0119] The target service is called by a pre-deployed rule engine to process the target event, and any one of the components to be displayed is rendered using the result of processing the target event.

[0120] In a possible implementation manner, the configuration information further includes a second processing rule corresponding to the data required for rendering any one of the components to be displayed;

[0121] Determine the relevant component module 1204 for:

[0122] Periodically acquiring the target data from the target memory;

[0123] The display module 1204 is used to:

[0124] Based on the data analysis method in the second processing rule, the target data is analyzed by a pre-deployed time series analysis service, wherein the data analysis method includes any one of aggregation, classification, and prediction;

[0125] Rendering any one of the components to be displayed on the display interface using an analysis result obtained after analyzing the target data.

[0126] In a possible implementation manner, the configuration information further includes a data conversion method corresponding to the data required for rendering any one of the components to be displayed;

[0127] The display module 1204 is used to:

[0128] The acquired target data is format-converted according to the data conversion format, and the format-converted target data is used to render any one of the components to be displayed on the display interface.

[0129] In a possible manner, the device further includes an export module, configured to:

[0130] Using the configuration information, a general configuration template is obtained;

[0131] Storing the general configuration template in a pre-built template library;

[0132] When rendering other components, the general configuration template is obtained from the template library, and the configuration information of the other components is obtained using the general configuration template.

[0133] In a possible implementation, the display module 1204 is used to:

[0134] When it is detected that, in the data corresponding to any one of the related components, the target data required for rendering any one of the components to be displayed is updated, the updated target data is used to re-render the any one of the components to be displayed.

[0135] Based on the same inventive concept, an embodiment of the present application provides an electronic device, the device comprising:

[0136] At least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, and the instructions are executed by the at least one processor so that the at least one processor can execute any component visualization method provided in the embodiments of the present application.

[0137] Refer to the following Fig.13 The electronic device 130 according to this embodiment of the present application is described. Fig.13 The electronic device 130 shown is merely an example and should not bring any limitation to the functions and scope of use of the embodiments of the present application.

[0138] like Fig.13 As shown, the electronic device 130 is in the form of a general electronic device. The components of the electronic device 130 may include but are not limited to: the at least one processor 131, the at least one memory 132, and a bus 133 connecting different system components (including the memory 132 and the processor 131).

[0139] The processor 131 is used to read and execute instructions in the memory 132, so that the at least one processor can execute a component visualization method provided by the above embodiment.

[0140] Bus 133 represents one or more of several types of bus structures, including a memory bus or memory controller, a peripheral bus, a processor, or a local bus using any of a variety of bus architectures.

[0141] The memory 132 may include a readable medium in the form of a volatile memory, such as a random access memory (RAM) 1321 and / or a cache memory 1322 , and may further include a read-only memory (ROM) 1323 .

[0142] The memory 132 may also include a program / utility 1325 having a set (at least one) of program modules 1324, such program modules 1324 including but not limited to: an operating system, one or more application programs, other program modules, and program data, each of which or some combination may include an implementation of a network environment.

[0143] The electronic device 130 may also communicate with one or more external devices 134 (e.g., keyboards, pointing devices, etc.), may also communicate with one or more devices that enable a user to interact with the electronic device 130, and / or communicate with any device that enables the electronic device 130 to communicate with one or more other electronic devices (e.g., routers, modems, etc.). Such communication may be performed via an input / output (I / O) interface 135. Furthermore, the electronic device 130 may also communicate with one or more networks (e.g., a local area network (LAN), a wide area network (WAN), and / or a public network, such as the Internet) via a network adapter 136. As shown, the network adapter 136 communicates with other modules for the electronic device 130 via a bus 133. It should be understood that, although not shown in the figure, other hardware and / or software modules may be used in conjunction with the electronic device 130, including but not limited to: microcode, device drivers, redundant processors, external disk drive arrays, RAID systems, tape drives, and data backup storage systems.

[0144] In some possible implementations, various aspects of a component visualization method provided by the present application may also be implemented in the form of a program product, which includes program code. When the program product is run on a computer device, the program code is used to enable the computer device to execute the steps of a component visualization method according to various exemplary implementations of the present application described above in this specification.

[0145] In addition, the present application also provides a computer-readable storage medium, wherein the computer storage medium stores a computer program, wherein the computer program is used to enable a computer to execute any of the methods described in the above embodiments.

[0146] These computer program instructions may also be stored in a computer-readable memory capable of directing a computer or other programmable data processing device to operate in a specific manner, so that the instructions stored in the computer-readable memory produce an article of manufacture including an instruction device, which implements the process Figure 1 A process or multiple processes and / or boxes Figure 1 A function specified in one or more boxes.

[0147] These computer program instructions can also be loaded onto a computer or other programmable data processing device so that a series of operating steps are executed on the computer or other programmable device to produce a computer-implemented process, thereby providing instructions for implementing the process. Figure 1 A process or multiple processes and / or boxes Figure 1 The steps for the functions specified in one or more boxes.

[0148] Although the preferred embodiments of the present application have been described, those skilled in the art may make additional changes and modifications to these embodiments once they have learned the basic creative concept. Therefore, the appended claims are intended to be interpreted as including the preferred embodiments and all changes and modifications falling within the scope of the present application.

[0149] Obviously, those skilled in the art can make various changes and modifications to the present application without departing from the spirit and scope of the present application. Thus, if these modifications and variations of the present application fall within the scope of the claims of the present application and their equivalents, the present application is also intended to include these modifications and variations.

Claims

1. A component visualization method, characterized in that the method include: For any component to be displayed corresponding to the webpage, determine configuration information of data required for rendering the component to be displayed on the display interface; Determine from the configuration information at least one related component associated with any one of the components to be displayed, and a data identifier of target data required to render any one of the components to be displayed from the data corresponding to each of the related components; For any relevant component, based on the component identifier of the any relevant component and the data identifier of the target data, acquiring the target data from the target memory; Utilize the acquired target data to render any one component to be displayed on the display interface.

2. The method according to claim 1, characterized in that The configuration information also includes a first processing rule corresponding to the data required for rendering any one of the components to be displayed; The using the acquired target data to render any one of the components to be displayed on the display interface includes: When a target event in the first processing rule is determined to be triggered based on the acquired target data, a target service for processing the target event in the first processing rule is determined; The target service is called by a pre-deployed rule engine to process the target event, and any one of the components to be displayed is rendered using the result of processing the target event.

3. The method according to claim 1, characterized in that The configuration information also includes a second processing rule corresponding to the data required for rendering any one of the components to be displayed; The acquiring the target data from the target memory includes: Periodically acquiring the target data from the target memory; The using the acquired target data to render any one of the components to be displayed on the display interface includes: Based on the data analysis method in the second processing rule, the target data is analyzed by a pre-deployed time series analysis service, wherein the data analysis method includes any one of aggregation, classification, and prediction; Rendering any one of the components to be displayed on the display interface using an analysis result obtained after analyzing the target data.

4. The method according to claim 1, characterized in that: The configuration information also includes a data conversion method corresponding to the data required for rendering any one of the components to be displayed; The using the acquired target data to render any one of the components to be displayed on the display interface includes: The acquired target data is format-converted according to the data conversion format, and the format-converted target data is used to render any one of the components to be displayed on the display interface.

5. The method according to claim 1, characterized in that The method further comprises: Using the configuration information, a general configuration template is obtained; Storing the general configuration template in a pre-built template library; When rendering other components, the general configuration template is obtained from the template library, and the configuration information of the other components is obtained using the general configuration template.

6. The method according to claim 1, characterized in that After rendering any one of the components to be displayed on the display interface, the method further includes: If it is detected that, in the data corresponding to any one of the related components, the target data required for rendering any one of the components to be displayed is updated, the updated target data is used to re-render the any one of the components to be displayed.

7. A component visualization device, characterized in that: The device comprises: A configuration information determination module is used to determine, for any component to be displayed corresponding to a web page, configuration information of data required for rendering the component to be displayed on a display interface; A related component determination module, used to determine from the configuration information at least one related component associated with any one of the components to be displayed, and a data identifier of target data required to render any one of the components to be displayed in the data corresponding to each of the related components; A data acquisition module, configured to acquire the target data from a target memory based on a component identifier of any relevant component and a data identifier of the target data; A display module is used to render any one component to be displayed on the display interface using the acquired target data.

8. An electronic device, characterized in that: The electronic device comprises: At least one processor; and a memory communicatively connected to the at least one processor; wherein the memory stores instructions executable by the at least one processor, the instructions being executed by the at least one processor so that the at least one processor executes a method as claimed in any one of claims 1 to 6.

9. A computer storage medium, characterized in that The computer storage medium stores a computer program, and the computer program is used to make a computer execute any one of the methods according to claims 1-6.

10. A computer program product, comprising 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 6 is implemented.

Images