Method for decoupling data visualization applications based on low-code development platforms

By performing decoupling analysis and code recombining on data visualization applications in low-code development platforms, the problem of data visualization applications being unable to be decoupled from other platforms was solved, enabling efficient portability and secure deployment on other platforms.

CN115408001BActive Publication Date: 2026-03-20CHONGQING HUMI NETWORK TECH CO LTD
View PDF 2 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-08-31
Publication Date
2026-03-20

AI Technical Summary

Technical Problem

Data visualization applications in existing low-code development platforms cannot be decoupled from other platforms, resulting in complex deployment and the inability to deploy independently, which limits their portability and flexibility.

Method used

By decoupling the data source types and visualization graphic components of the data visualization application, the component code storage structure and interaction logic are determined. The code is then reorganized, merged, packaged, and encapsulated into a portable file package, thereby decoupling the data visualization application from the original platform.

Benefits of technology

It improves the portability and security of data visualization applications, reduces deployment resource requirements, and ensures the normal operation and security of applications on other platforms.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN115408001B_ABST
    Figure CN115408001B_ABST
Patent Text Reader

Abstract

The present application relates to the technical field of low-code development, and in particular to a method for decoupling data visualization applications based on a low-code development platform. According to the method, after selecting a data visualization application to be decoupled according to requirements, the visualization graph components, data structures and underlying architecture used in the data visualization application are decoupled, the associated module codes are merged according to the original framework, and the data visualization application is transplanted in the form of a portable file package for separate deployment or integration with other platforms. When the development data visualization application system and the data visualization application to be bound use the same framework and development language, the data visualization application can be directly transplanted, improving the portability of the data visualization application. Moreover, by decoupling the data visualization application from the original platform, the deployment resource requirements of the application are reduced, and the need to consider the large underlying architecture of the original platform is eliminated, thereby enhancing the portability of the data visualization application.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] The application relates to the technical field of low-code development, and in particular to a method for decoupling a data visualization application based on a low-code development platform. BACKGROUND

[0002] Low code is a visual application development method that delivers applications with less code and at a faster speed. The code that programmers do not want to develop is automated, which is called low code. With the development of low code technology, data visualization applications have become one of the main development directions of low code development platforms.

[0003] At present, the processing methods of function blocks and data sources in low code development platforms on the market are different, and application publishing can only be deployed and published through respective platforms. Since the underlying architecture supporting low code development is large, it cannot be deployed independently without the underlying architecture. At the same time, when developers perform secondary development on the low code platform, they can only perform secondary development on their own platform. For example, when developing a data visualization application, part of the data comes from a certain system, and the data in another system needs to be exported and then imported into the data source of the data visualization application, and the process is relatively complex.

[0004] Therefore, how to decouple the data visualization application developed in the low code development platform from the platform itself and transplant it to other platforms has become a problem to be solved. SUMMARY

[0005] In view of the above problems of the prior art, the application provides a method for decoupling a data visualization application based on a low code development platform, which can decouple the data visualization application developed in the low code development platform from the platform itself and transplant it to other platforms.

[0006] In order to solve the above technical problems, the application adopts the following technical solutions:

[0007] The method for decoupling a data visualization application based on a low code development platform comprises the following steps:

[0008] S1, obtaining a data visualization application to be decoupled;

[0009] S2, decoupling and analyzing the data source type and the visual graph component composition of the data visualization application to be decoupled, and determining the component code storage structure of the visual graph component in the data source type corresponding to the data visualization application to be decoupled;

[0010] S3, decoupling analysis is performed on the component property code of each visual graphical component of the data visualization application to be decoupled and the function method used by the component property code, component code data of each visual graphical component corresponding to the data visualization application to be decoupled, and function method data used by each visual graphical component are obtained;

[0011] S4, decoupling analysis is performed on the component interaction underlying framework in the data source type corresponding to the data visualization application to be decoupled, and the calling interaction logic between each visual graphical component corresponding to the data visualization application to be decoupled in the corresponding underlying framework is determined;

[0012] S5, according to the component code storage structure of the visual graphical component in the data source type corresponding to the data visualization application to be decoupled and the calling interaction logic between each visual graphical component, the component code data of each visual graphical component corresponding to the data visualization application to be decoupled is recombined and packaged to form a corresponding portable file package.

[0013] Noun explanation:

[0014] Component code storage structure: the code structure of the visual graphical component and the specific storage location structure of each type of file.

[0015] Preferably, S2 includes:

[0016] S201, data source analysis is performed on the data visualization application to obtain the number of data sources used by the data visualization application and the type of each data source;

[0017] S202, the visual graphical component associated with each data source in the data visualization application and the function corresponding to the visual graphical component are obtained respectively;

[0018] S203, according to the data source type of each visual graphical component, the corresponding code structure and the associated folder path are pulled respectively as the corresponding component code storage structure.

[0019] Preferably, S3 includes:

[0020] S301, after obtaining each visual graphical component of the data visualization application, the component code data of each visual graphical component is parsed, and the component code data includes SVG graphical component and component property code structure;

[0021] S302, the data model of each visual graphical component of the data visualization application and the corresponding function method data are obtained.

[0022] Preferably, S4 includes:

[0023] S401, according to the data source of the data visualization application, pulling the architecture component and version number of the underlying framework of the data visualization application to obtain the corresponding underlying framework;

[0024] S402, determining the calling interaction logic between the corresponding visualization graph components of the data visualization application in the corresponding underlying framework.

[0025] Preferably, in S401, the architecture component includes a database, a front-end component, a back-end component, a dependent package and a framework peripheral library.

[0026] Preferably, in S5, after the code recombination and completion, code encryption is further performed, and then the corresponding portable file package is formed by packaging and encapsulating.

[0027] Preferably, in S2, the data source type includes a big data suite, an Internet of Things suite and a local data source.

[0028] Preferably, in S5, after obtaining the portable file package, secondary development or separate deployment calling is performed using the portable file package.

[0029] Compared with the prior art, the present application has the following beneficial effects:

[0030] 1. Using the method, according to the specific needs, the data visualization application to be decoupled is selected, the visualization graph component, data structure and underlying architecture used in the data visualization application are decoupled, the associated module code is combined according to the original framework, and the data visualization application is transplanted and deployed separately or integrated with other platforms in the form of a portable file package. When the development data visualization application system and the data visualization application to be bound use the same framework and development language, the data visualization application can be directly transplanted, improving the portability of the data visualization application. Moreover, by decoupling the data visualization application from the original platform, the deployment resource requirements of the application are reduced, and the huge underlying of the original platform does not need to be considered.

[0031] In this way, the data visualization application developed in the low-code development platform can be decoupled from the platform itself and transplanted to other platforms, thereby enhancing the portability of the data visualization application.

[0032] 2. At the same time, by decoupling the visualization graph component, the data structure and the underlying architecture, the minimum closed loop of the data visualization application deployment and normal operation can be guaranteed while improving the portability, and the application deployment resource requirements are reduced.

[0033] 3. By decoupling the data visualization application, encrypting the code after combining the code according to the original structure, the security of the application can be guaranteed, and the security can be guaranteed by using a secure key during secondary development. BRIEF DESCRIPTION OF DRAWINGS

[0034] In order to make the purpose, technical scheme and advantages of the application clearer, the application will be described in further detail below with reference to the drawings, in which:

[0035] Figure 1 Flowchart of the method for decoupling data visualization application based on low-code development platform.

[0036] Figure 2 Technical idea analysis diagram for decoupling data visualization application by applying the method of the application. DETAILED DESCRIPTION

[0037] The application will be described in further detail below through specific embodiments:

[0038] EMBODIMENT

[0039] As shown in the embodiment, a method for decoupling data visualization application based on low-code development platform is disclosed, comprising the following steps: Figure 1

[0040] S1. According to specific requirements, obtain the data visualization application to be decoupled.

[0041] S2. Decouple and analyze the data source type and visualization graphic component composition of the data visualization application to be decoupled, and determine the component code storage structure of the visualization graphic component in the data source type corresponding to the data visualization application to be decoupled. The component code storage structure is the code structure of the visualization graphic component and the specific storage location structure of each type of file. In specific implementation, S2 comprises:

[0042] S201. Analyze the data source of the data visualization application to obtain the number of data sources used by the data visualization application and the type of each data source. For ease of understanding, an example is used to illustrate (the subsequent steps are also illustrated based on this example), for example, the data visualization application "XX automobile parts production monitoring management system" for local data source, whose data source is a local Excel data table. When there are multiple data sources, only the relevant operations need to be performed respectively, which will not be described here.

[0043] S202. Obtain the visualization graphic component associated with each data source in the data visualization application and the function corresponding to the visualization graphic component. Since there is only one data source in the example, all graphic components in the data visualization application can be directly obtained: near 7-day production situation (column chart), near 7-day order situation (line chart), near 7-day order list (table), workshop (static picture), data visualization application name (Text text).

[0044] Based on the obtained visualization graphic component, the function of the graphic component is obtained:​

[0045] Near 7-day production situation (bar chart): APP.Production(output, date);

[0046] Near 7-day order situation (line chart): APP.Oder(oder, date);

[0047] Near 7-day order list (table): APP.Oderlist(oder, date);

[0048] Workshop (static picture): APP.Picture(pic[]);

[0049] Data visualization application name (Text text): APP.Doc(text[]);

[0050] S203, according to the data source type of each visualization component, pull the corresponding code structure and associated folder path as the corresponding component code storage structure.

[0051] S3, decoupling analysis is performed on the component attribute code of each visualization component of the data visualization application to be decoupled and the function method used, and the component code data of each visualization component of the data visualization application to be decoupled and the function method data used by each visualization component are obtained. In specific implementation, S3 includes:

[0052] S301, after obtaining each visualization component of the data visualization application, the component code data of each visualization component is parsed, and the component code data includes SVG component and component attribute code structure.

[0053] S302, obtain the data model and corresponding function method data of each visualization component of the data visualization application.

[0054] In the example, based on the near 7-day production situation (bar chart), the near 7-day order situation (line chart), the near 7-day order list (table), the workshop (static picture), and the data visualization application name (Text text) components in the data visualization application, the data model and the processing function method are obtained.

[0055] model1{

[0056] Tbname: "XX automobile parts production monitoring and management system"

[0057] Data:{

[0058] Att1: "order number"

[0059] Att2: "order name"

[0060] Att3: "Order Time"

[0061] Att4: "Delivery Time"

[0062] Att5: "Output"

[0063] }

[0064] Deal.Fun{

[0065] APP.Production(output, date);

[0066] APP.Oder(oder, date);

[0067] APP.Picture(pic[]);

[0068] APP.Doc(text[]);

[0069] }

[0070] };

[0071] Pull the associated data table structure, the core fields in the SQL file include output (output), order ID (order number), order name (order name), order time (order time), pic (application picture), and text (application text), and export as a database file APP.Sql.

[0072] It should be noted that, in actual operation, in order to reduce the workload of technical personnel, the corresponding storage module can also be created according to the component code storage structure after S203, and the storage module includes a graphic folder and a code file for storing the corresponding content of the corresponding graphic component. In this way, the SVG graphic component can be stored in the graphic folder of the corresponding path, and the component attribute code structure can be stored in the code file of the corresponding path, so as to directly obtain the component code. In addition, in order to facilitate the technical personnel to call the data of each visual graphic component, the associated data table structure can also be pulled based on the obtained data model and processing function method, and exported as a database file.

[0073] S4, after obtaining each visual graphic component of the data visualization application, the SVG graphic component and the component attribute code structure of each visual graphic component are parsed. In specific implementation, S4 includes:

[0074] S401, according to the data source of the data visualization application, the architecture component and the version number of the underlying framework of the data visualization application are pulled to obtain the corresponding underlying framework; wherein, the architecture component includes database, front-end component, back-end component, dependent package and framework peripheral library.

[0075] In an example, according to the data source of the data visualization application, the underlying architecture components and version numbers thereof are pulled as shown in the following table:

[0076]

[0077] S402, determine the calling interaction logic between the respective visualization graph components of the data visualization application in the corresponding underlying framework.

[0078] S5, according to the component code storage structure of the visualization graph components in the data source type corresponding to the data visualization application to be decoupled, and the calling interaction logic between the respective visualization graph components, the component code data of the respective visualization graph components corresponding to the data visualization application to be decoupled is recombined and merged, and after the code is sufficiently combined and merged, the code is encrypted, and then packaged and encapsulated to form a corresponding portable file package. Then, the portable file package is used for secondary development or separate deployment and calling.

[0079] The technical idea of decoupling the data visualization application by using the method of the application is as shown in Figure 2 .

[0080] For ease of understanding, another example (Example 2) is used to illustrate the flow, and the specific content of Example 2 is as follows:

[0081] For the data visualization application “XX engine health state monitoring system” of the Internet of Things kit, the data source is the Internet of Things platform, all visualization graph components in the data visualization application are obtained, including device running state, device running noise, device speed, device amplitude, and device picture; the complete code structure of the Internet of Things kit and the associated folder path are pulled, and a storage module of the corresponding folder structure is created, the storage module including a graph folder and a code file.

[0082] Based on the data visualization application, all graph components are obtained, the SVG graph component is stored in the graph folder of the corresponding path, and the component attribute code structure is stored in the corresponding code file.

[0083] Based on the device running state (Internet of Things kit interface), device running noise (Internet of Things kit interface), device speed (Internet of Things kit interface), device amplitude (Internet of Things kit interface), and device picture (dynamic picture) in the data visualization application, the data model and the processing function method thereof are obtained;

[0084] Model2{

[0085] Tbname: “XX engine health state monitoring system”

[0086] Data:{

[0087] Att1: "Device ID"

[0088] Att2: "Device running status"

[0089] Att3: "Device running noise"

[0090] Att4: "Device speed"

[0091] Att5: "Device amplitude"

[0092] Att6: "Device picture"

[0093] }

[0094] Deal.Fun{

[0095] APP.Dev(dev_ID);

[0096] }

[0097] };

[0098] Pull the associated data table structure and export it as a database file APP.Sql.

[0099] According to the data source of the data visualization application, pull its underlying architecture components and version number:

[0100]

[0101] Output the startup command script commond.py of the deployment environment.

[0102] Code merging and encryption processing are performed on the output code file, and finally the encrypted file package is used for secondary development or separate deployment call.

[0103] Using the method, according to the specific needs, after selecting the data visualization application to be decoupled, the visualization graphic components, data structures, underlying architecture used in the data visualization application are decoupled, and the associated module code is combined according to the original framework, and the data visualization application is transplanted in the form of a portable file package and deployed separately or integrated with other platforms. When the data visualization application system and the data visualization application to be bound use the same framework and development language, the data visualization application can be directly transplanted, improving the portability of the data visualization application. Moreover, by decoupling the data visualization application from the original platform, the application deployment resource requirements are reduced, and the huge underlying of the original platform does not need to be considered. Moreover, by decoupling the visualization graphic components, data structures, and underlying architecture, while improving portability, the minimum closed loop of the data visualization application deployment and normal operation can also be guaranteed, reducing the application deployment resource requirements. By decoupling the data visualization application, encrypting the code after combining the code according to the original structure, the security of the application can be ensured, and the security can be ensured by using a secure key when secondary development is used.

[0104] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present application and not to limit the technical solutions. Those of ordinary skill in the art should understand that modifications or equivalent replacements of the technical solutions of the present application without departing from the spirit and scope of the technical solutions should be covered in the scope of the claims of the present application.

Claims

1. A method for decoupling data visualization applications based on a low-code development platform, characterized in that, Includes the following steps: S1. Obtain the data visualization application to be decoupled; S2. Perform decoupling analysis on the data source type and visualization graphic component composition of the data visualization application to be decoupled, and determine the component code storage structure of the visualization graphic component in the data source type corresponding to the data visualization application to be decoupled. S3. Perform decoupling analysis on the component attribute code and function methods used by each visualization graphic component of the data visualization application to be decoupled, and obtain the component code data and function method data used by each visualization graphic component of the data visualization application to be decoupled. S4. Perform decoupling analysis on the underlying architecture of component interaction in the data source type corresponding to the data visualization application to be decoupled, and determine the calling and interaction logic between each visualization graphic component in the corresponding underlying framework of the data visualization application to be decoupled. S5. Based on the component code storage structure of the visualization graphic components in the data source type corresponding to the data visualization application to be decoupled, as well as the calling and interaction logic between each visualization graphic component, the component code data of each visualization graphic component corresponding to the data visualization application to be decoupled is reorganized and merged, and packaged into a corresponding portable file package.

2. The method for decoupling data visualization applications based on a low-code development platform as described in claim 1, characterized in that: S2 includes: S201. Perform data source analysis on the data visualization application to obtain the number of data sources used by the data visualization application and the type of each data source. S202. Obtain the visualization graphics components associated with each data source in the data visualization application, as well as the functions corresponding to the visualization graphics components; S203. Based on the data source type of each visualization graphic component, retrieve its corresponding code structure and associated folder path as the corresponding component code storage structure.

3. The method for decoupling data visualization applications based on a low-code development platform as described in claim 2, characterized in that: S3 includes: S301. After obtaining each visualization graphic component of the data visualization application, parse the component code data of each visualization graphic component. The component code data includes SVG graphic components and component attribute code structure. S302. Obtain the data models and corresponding function method data of each visualization graphic component of the data visualization application.

4. The method for decoupling data visualization applications based on a low-code development platform as described in claim 3, characterized in that: S4 includes: S401: Based on the data source of the data visualization application, retrieve the underlying architecture components and version numbers of the data visualization application to obtain the corresponding underlying framework. S402. Determine the calling and interaction logic between the various visualization graphics components corresponding to the data visualization application in the corresponding underlying framework.

5. The method for decoupling data visualization applications based on a low-code development platform as described in claim 4, characterized in that: In S401, the architecture components include a database, front-end components, back-end components, dependency packages, and framework peripheral libraries.

6. The method for decoupling data visualization applications based on a low-code development platform as described in claim 1, characterized in that: In S5, after the code is reorganized and merged, it is encrypted and then packaged into a corresponding portable file package.

7. The method for decoupling data visualization applications based on a low-code development platform as described in claim 1, characterized in that: In S2, the data source types include big data suites, IoT suites, and local data sources.

8. The method for decoupling data visualization applications based on a low-code development platform as described in claim 1, characterized in that: In S5, after obtaining the portable file package, the portable file package can be used for secondary development or for standalone deployment and invocation.

Citation Information

Patent Citations

  • Visual configuration rendering method and system based on Vue modularizationand terminal

    CN112711408A

  • Application program transplantation method and device, equipment and storage medium

    CN114443130A