Industrial internet digital large screen data visualization system based on Kylin system

Abstract

The invention relates to the technical field of Internet data visualization, in particular to an industrial Internet digital large screen data visualization system based on a Kylin system. Comprising a front-end page development module based on Vue + datav, a JAVA writing back-end data processing module, a communication module of an MQTT protocol and an edge computing gateway, a Docker containerization deployment module, a domestic Kylin system deployment module and a data visualization module. According to the industrial internet digital large screen data visualization system based on the Kylin system, a Vue framework is adopted to carry out front-end page development, JAVA is adopted to compile back-end data processing, an MQTT protocol is utilized to carry out real-time communication with an edge computing gateway, and real-time data visualization of a computer end and a mobile section is provided; and the whole project is packaged into a docker container mirror image, so that the docker container mirror image can be quickly deployed on a domestic Kylin system server, the cross-platform problem is solved, and the efficiency and the safety of industrial production are improved.

Description

Technical Field

[0001] The present invention relates to the technical field of Internet data visualization, and specifically to an industrial Internet digital large-screen data visualization system based on the Kylin system. Background Art

[0002] With the continuous progress of technology, the application scenarios of industrial data visualization are also constantly expanding. In addition to traditional manufacturing management, the construction of smart factories, workshop large screens, and production large screens also plays an important role. In fields such as healthcare, education, and automation, industrial data visualization technology has also been widely applied, providing strong support for the digital transformation and intelligent upgrading of various industries. With the continuous deepening of industrial informatization and digitalization, industrial data visualization large screens are playing an increasingly important role in manufacturing management. In the past five years, the amount of data generated in our country has increased rapidly, and the big data market will also maintain a continuous and rapid growth trend, driving the increasing market demand for the industrial data visualization large screen industry.

[0003] Defects existing in the prior art:

[0004] On the one hand, with the popularization of various devices and operating systems, data visualization applications need to maintain consistency and efficiency on different platforms, which increases the difficulty of development and maintenance. On the other hand, some industrial Internet platforms use foreign Linux operating systems, posing a risk of external forces interfering and sabotaging through technical means, thus threatening the integrity of factory data and the stability of the production system. Summary of the Invention

[0005] The purpose of the present invention is to provide an industrial Internet digital large-screen data visualization system based on the Kylin system to solve the problems raised in the above background art.

[0006] To achieve the above purpose, the present invention provides the following technical solution: An industrial Internet digital large-screen data visualization system based on the Kylin system, including a front-end page development module based on Vue + datav, a back-end data processing module written in JAVA, a communication module of the MQTT protocol and the edge computing gateway, a Docker containerization deployment module, a domestic Kylin system deployment module, and a data visualization module;

[0007] The front-end page development module based on Vue + datav uses the Vue framework to achieve fast response and smooth interaction, improving the user experience. The cross-platform compatibility of the Vue framework enables the APP to run on a variety of devices, including mobile and desktop devices;

[0008] The backend data processing written in JAVA realizes real-time collection, storage, and analysis of device data through the backend logic written in JAVA. At the same time, the MQTT service and database are configured to ensure the accuracy and security of the data;

[0009] The communication between the MQTT protocol and the edge computing gateway uses the MQTT protocol to achieve real-time transmission and remote access of device data, improving communication efficiency and reliability. At the same time, through the distributed deployment of the edge computing gateway, the stability and reliability of the system are further enhanced;

[0010] The Docker containerized deployment packages the entire project into a Docker container image to achieve rapid deployment and migration;

[0011] The deployment of the domestic Kylin system deploys the Docker container image on the domestic Kylin system server to ensure the security and autonomy of the system;

[0012] The data visualization module introduces database data into the communication connection of the edge computing device and communicates with the industrial Internet platform through a remote client to display the visualization model and perform real-time interaction.

[0013] Preferably, the front-end page development module based on Vue is implemented using the virtual DOM algorithm. The specific steps are as follows:

[0014] Create a virtual DOM tree: Vue compiles the template of the component into a virtual DOM tree, and each node corresponds to an element or component of the real DOM;

[0015] Compare and update the real DOM: When data changes cause the component to be re-rendered, Vue will generate a new virtual DOM tree, which is compared with the old tree through the patch algorithm using depth-first traversal.

[0016] Preferably, the backend data processing module written in JAVA includes the following steps:

[0017] In the Java code, create two classes respectively for configuring MQTT connection parameters, subscribing to MQTT topics, and receiving device data;

[0018] Create a class for configuring the database connection, configure the connection URL, username, password, and other information of the MySQL database, and obtain the database connection. Note that the database name, username, and password parameters need to be modified according to the actual situation;

[0019] Create a class for storing the collected device data into the database, insert the data into the database table, and finally close the relevant database resources;

[0020] Through a loop, the collected data is stored in the database at regular intervals, and simple statistical analysis of the data record quantity is carried out. At the same time, the stored data list is cleared to prepare for receiving new data.

[0021] Preferably, the communication between the MQTT protocol and the edge computing gateway uses the MQTT protocol to achieve real-time transmission and remote access of device data. At the same time, during the calculation process, the important part of the data information is encrypted with a public key by an encryption processor. The encryption process includes data encryption based on quadratic congruence for the data information, that is, Rabin key encryption.

[0022] Preferably, before the database data is introduced into the edge computing device, it will go through data cleaning and preprocessing, including handling missing values, handling outliers, and data conversion.

[0023] Preferably, for real-time data in the database, a monitoring mechanism is established to detect data changes, which is achieved by periodically polling the data source (such as querying the database once every 1 second) or using an event-driven mechanism (such as when the data in the database changes, sending an update notification through a message queue);

[0024] When it is detected that the data change reaches a certain threshold or after a certain time interval, a visualization update is triggered.

[0025] Preferably, when the visualization large screen updates the visualization, transitional effects such as fading and flashing are adopted to smoothly display the data changes and avoid sudden visual impacts.

[0026] Compared with the prior art, the beneficial effects of the present invention are:

[0027] 1. This industrial Internet digital large screen data visualization system based on the Kirin system uses the Vue framework for front-end page development, JAVA for writing back-end data processing, uses the MQTT protocol to communicate with the edge computing gateway in real time, provides real-time data visualization for the computer side and the mobile side, and packages the entire project into a docker container image to achieve rapid deployment on a domestic Kirin system server, solving the cross-platform problem and improving the efficiency and security of industrial production.

[0028] 2. This industrial Internet digital large screen data visualization system based on the Kirin system improves the user experience, realizes efficient data processing and storage, strengthens the cooperation between edge computing and the cloud, realizes remote monitoring and control, promotes the industrial intelligent transformation, and enhances the scalability and flexibility of the system, etc. Description of the Drawings

[0029] To more clearly illustrate the technical solutions in the embodiments of the present invention, the following will briefly introduce the accompanying drawings required for the description of the embodiments. Obviously, the accompanying drawings in the following description are only some embodiments of the present invention. For those of ordinary skill in the art, without creative efforts, other accompanying drawings can be obtained based on these drawings.

[0030] Figure 1 It is the engineering flow chart of the large-screen data visualization of the present invention;

[0031] Figure 2 It is the flow chart of the Docker containerization part of the present invention;

[0032] Figure 3 It is the sample diagram of the finished product of the industrial Internet digital large-screen data visualization of the present invention. Specific implementation manners

[0033] The following will clearly and completely describe the technical solutions in the embodiments of the present invention in conjunction with the accompanying drawings in the embodiments of the present invention. Obviously, the described embodiments are only some embodiments of the present invention, rather than all embodiments. Based on the embodiments of the present invention, all other embodiments obtained by those of ordinary skill in the art without creative efforts belong to the scope of protection of the present invention.

[0034] Please refer to Figures 1-3 , the present invention provides a technical solution: an industrial Internet digital large-screen data visualization system based on the Kylin system, including a front-end page development module based on Vue+datav, a back-end data processing module written in JAVA, a communication module of the MQTT protocol and the edge computing gateway, a Docker containerization deployment module, a domestic Kylin system deployment module, and a data visualization module;

[0035] The front-end page development module based on Vue+datav uses the Vue framework to achieve fast response and smooth interaction, improving the user experience. The cross-platform compatibility of the Vue framework enables the APP to run on multiple devices, including mobile and desktop devices;

[0036] The front-end page development module based on Vue is implemented using the virtual DOM algorithm, and the specific steps are as follows:

[0037] Create a virtual DOM tree: Vue compiles the template of the component into a virtual DOM tree, and each node corresponds to an element or component of the real DOM;

[0038] Compare and update the real DOM: When data changes cause the component to be re-rendered, Vue will generate a new virtual DOM tree, which is compared with the old tree through the patch algorithm for a depth-first traversal.

[0039] The backend data processing written in JAVA realizes real-time collection, storage, and analysis of device data by writing backend logic in JAVA. At the same time, the MQTT service and database are configured to ensure data accuracy and security;

[0040] The backend data processing module written in JAVA includes the following steps:

[0041] In the Java code, create two classes to configure the MQTT connection parameters, subscribe to the MQTT topic, and receive device data respectively;

[0042] Create a class to configure the database connection, configure information such as the connection URL, username, and password of the MySQL database, and obtain the database connection. Note that the database name, username, and password parameters should be modified according to the actual situation;

[0043] Create a class to store the collected device data into the database, insert the data into the database table, and finally close the relevant database resources;

[0044] Through a loop, store the collected data into the database at regular intervals, perform simple statistical analysis of the data record quantity, and at the same time clear the stored data list to prepare to receive new data.

[0045] The communication between the MQTT protocol and the edge computing gateway uses the MQTT protocol to achieve real-time transmission and remote access of device data, improving communication efficiency and reliability. At the same time, through the distributed deployment of the edge computing gateway, the stability and reliability of the system are further enhanced;

[0046] The communication between the MQTT protocol and the edge computing gateway uses the MQTT protocol to achieve real-time transmission and remote access of device data. At the same time, during the calculation process, the important part of the data information is encrypted with a public key by an encryption processor. The encryption process includes data encryption based on quadratic congruence for the data information, that is, Rabin key encryption.

[0047] The Rabin cryptosystem is an improvement of the RSA cryptosystem. The Rabin cryptosystem can be considered as an RSA cryptosystem with fixed e and d values, where e = 2 and d = 1 / 2. That is, the encryption is c = m^2 mod n, and the decryption is m = c^(1 / 2) mod n.

[0048] Rabin key generation: Select two large prime numbers p and q, where p and q are required to be 4 times a multiple plus 3. Calculate n = pq. The public key is n and is publicly announced, and the private key is (p, q), which is privately hidden by the web page itself. The user sends the plaintext m to the web page, where 0 < m < n, and calculates with the public key n: c = m 2 (mod n), and c is the ciphertext.

[0049] S3: The encrypted data information is published on the web page. When other users open the web page to view the data, the configuration server of the web page will load and decrypt the data and judge the correctness of the decryption.

[0050] After receiving the ciphertext c, the web page calculates using the private key (p, q) hidden by time:

[0051] Calculate: m 1 , m 2 , m 3 , m 4 , satisfying

[0052] m 1 (mod p) = m p ; m 1 (mod q) = m q ;

[0053] m 2 (mod p) = m p ; m 2 (mod q) = q - m q ;

[0054] m 3 (mod p) = p - m p ; m 3 (mod q) = m q ;

[0055] m 4 (mod p) = p - m p ; m 4 (mod q) = q - m q ;

[0056] So, the real plaintext m must be one of the four numbers: m 1 , m 2 , m 3 , m 4 . Observe the 4 numbers, exclude the meaningless "garbled characters", and the remaining one is the real plaintext m, and the decryption is completed.

[0057] The Docker containerization deployment packages the entire project into a Docker container image to achieve fast deployment and migration;

[0058] The domestic Kylin system deployment deploys the Docker container image on the domestic Kylin system server to ensure the security and autonomy of the system;

[0059] The data visualization module introduces database data into the edge computing device for communication connection, and communicates with the industrial Internet platform through a remote client, which is used to display the visualization model and perform real-time interaction.

[0060] Before the database data is introduced into the edge computing device, it will go through data cleaning and preprocessing, including handling missing values, handling outliers, and data transformation.

[0061] Handling missing values: Identify the missing parts in the data and select appropriate methods to fill or handle these missing values according to the characteristics of the data and the purpose of analysis. Common methods include deleting records containing missing values, filling numerical missing values with the mean / median / mode, or filling with the most likely value (inferred based on other relevant data).

[0062] Handling outliers: Discover and handle abnormal data points through statistical methods (such as calculating the standard deviation range) or business rules. Outliers may be data entry errors or real but special situations.

[0063] Data transformation: Transform the data according to the visualization requirements. This may include standardization (transforming the data to a specific mean and standard deviation range), normalization (mapping the data to the 0-1 interval), or logarithmic transformation (used to handle data with exponential growth characteristics), etc.

[0064] The display large screen is configured with a processor that supports basic interaction operations such as clicking, double-clicking, dragging, and zooming. More complex interactions can also be designed, such as data filtering. Users can select a specific time period through a slider or select a specific product line through a drop-down menu, and then all relevant charts on the large screen will be updated in real time according to the filtering conditions.

[0065] For real-time data on the display large screen, a monitoring mechanism needs to be established to detect data changes. This can be achieved by polling the data source regularly (such as querying the database every 1 second) or using an event-driven mechanism (such as when the data in the database changes, sending an update notification through a message queue).

[0066] When it is detected that the data change reaches a certain threshold (such as the sales change exceeds 10%) or after a certain time interval (such as updating every 5 minutes), trigger the visualization update.

[0067] Dynamic visualization update:

[0068] When updating the visualization, transitional effects such as gradual changes and flashing should be adopted to smoothly display data changes and avoid sudden visual impacts. For example, when updating the line color or data point position of a line chart, an animated transition effect can be used to enable users to naturally perceive the data change process. At the same time, the update process needs to be efficient, minimizing the impact on system performance and avoiding lags or delays.

[0069] It should be noted that in this article, relational terms such as first and second are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any actual relationship or order between these entities or operations. Moreover, the term "comprising", "including" or any other variant thereof is intended to cover non-exclusive inclusion, so that a process, method, article or device comprising a series of elements not only includes those elements, but also includes other elements not expressly listed, or further includes elements inherent to such process, method, article or device. Without further limitation, an element defined by the statement "comprising a..." does not exclude the existence of additional identical elements in the process, method, article or device comprising the said element.

[0070] Although the embodiments of the present invention have been shown and described, for those of ordinary skill in the art, it can be understood that various changes, modifications, substitutions and variations can be made to these embodiments without departing from the principles and spirit of the present invention, and the scope of the present invention is defined by the appended claims and their equivalents.

Claims

1. The industrial Internet digital large-screen data visualization system based on the Kylin system is characterized by: It includes front-end page development module based on Vue+datav, back-end data processing module written in JAVA, communication module between MQTT protocol and edge computing gateway, Docker container deployment module, domestic Kirin system deployment module and data visualization module; The front-end page development module based on Vue+datav adopts the Vue framework to achieve fast response and smooth interaction, improve user experience, and the cross-platform compatibility of the Vue framework enables the APP to run on multiple devices, including mobile and desktop; The JAVA backend data processing uses JAVA to write backend logic to achieve real-time collection, storage and analysis of device data, while configuring MQTT services and databases to ensure data accuracy and security; The communication between the MQTT protocol and the edge computing gateway uses the MQTT protocol to achieve real-time transmission and remote access of device data, improve communication efficiency and reliability, and further enhance the stability and reliability of the system through the distributed deployment of the edge computing gateway; The Docker containerized deployment packages the entire project into a Docker container image to achieve rapid deployment and migration; The domestic Kylin system deployment deploys the Docker container image on the domestic Kylin system server to ensure the security and autonomous controllability of the system; The data visualization module introduces database data into the edge computing device communication connection, and communicates with the industrial Internet platform through a remote client to display the visualization model and perform real-time interaction.

2. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: The Vue-based front-end page development module is implemented using the virtual DOM algorithm. The specific steps are as follows: Create a virtual DOM tree: Vue compiles the component's template into a virtual DOM tree, where each node corresponds to an element or component of the real DOM; Compare and update the real DOM: When data changes cause the component to re-render, Vue will generate a new virtual DOM tree and compare it with the old tree through a depth-first traversal using the patch algorithm.

3. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: The JAVA backend data processing module includes the following steps: In the Java code, create two classes to configure MQTT connection parameters and subscribe to MQTT topics and receive device data. Create a class to configure the database connection, configure the connection URL, user name, password and other information of the MySQL database, obtain the database connection, and pay attention to modify the database name, user name and password parameters according to the actual situation; Create a class to store the collected device data in the database, insert the data into the database table, and finally close the related database resources; Through a cycle, the collected data is stored in the database at regular intervals, and a simple statistical analysis of the data record quantity is performed. At the same time, the stored data list is cleared to prepare for receiving new data.

4. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: The communication between the MQTT protocol and the edge computing gateway utilizes the MQTT protocol to realize real-time transmission and remote access of device data. At the same time, during the calculation process, the important part of the data information is encrypted with a public key through an encryption processor. The encryption process includes data encryption based on quadratic congruence, namely Rabin key encryption.

5. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: Before the database data is introduced into the edge computing device, it will undergo data cleaning and preprocessing, including processing missing values, processing outliers and data conversion.

6. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: The database establishes a monitoring mechanism for real-time data to detect data changes, which is achieved by periodically polling the data source (such as querying the database every 1 second) or using an event-driven mechanism (such as sending an update notification through a message queue when the data in the database changes); When the data change reaches a certain threshold or a certain time interval has passed, the visualization update is triggered.

7. The industrial Internet digital large-screen data visualization system based on the Kylin system according to claim 1 is characterized by: When updating the visualization, the visualization screen uses transition effects such as gradient and flashing to smoothly display data changes and avoid sudden visual impact.

Images