Data processing method and device

Abstract

Embodiments of the invention provide a data processing method and apparatus. The method comprises the steps of obtaining design drawing data and / or effect drawing data of a visual interface; identifying the design drawing data and / or the effect drawing data by adopting a preset image identification technology, and determining visual component information of the visual interface; the visual component information is input into a neural network model, preliminary layout information is output, and the neural network model is a model used for conducting visual interface layout according to the input visual component information; and generating target layout information of the visual interface based on the preliminary layout information. Through the embodiment of the invention, the quick layout of the low-code data visual interface chart component is realized, a user does not need to consume a lot of time in page layout, adjustment and overall large screen design, the processing efficiency of the visual interface is improved, the dependence on manual operation is reduced, meanwhile, enterprises can be helped to face different business scenes and user roles, and the user experience is improved. And rapid reuse of the data visualization interface is realized.

Description

Technical Field

[0001] The present invention relates to the technical field of Web front-end development and mobile front-end development, and in particular to a data processing method and device. Background Art

[0002] With the advent of the digital age, enterprises and organizations have collected a large amount of data. It has become essential to process these large-scale data sets and extract useful information from them. Data visualization is the process of presenting complex data in a graphical way, making it easier for users to understand and analyze the data. For enterprises and decision makers, presenting data in an intuitive and visual way can help them make decisions faster and more accurately.

[0003] The data visualization interface uses a large screen as a carrier to present data visualization in an intuitive way, convey the value of data to users in the form of visual impact, and help users quickly understand business data. The traditional data visualization interface development is first designed by UI designers as a prototype, and then coded and drawn by professional front-end programmers. This process may consume a lot of time and resources. Summary of the invention

[0004] In view of the above problems, a data processing method and device are proposed to overcome the above problems or at least partially solve the above problems, including:

[0005] A data processing method, the method comprising:

[0006] Obtain design drawing data and / or rendering data of a visualization interface;

[0007] Using a preset image recognition technology to recognize the design drawing data and / or the rendering data, and determine the visualization component information of the visualization interface;

[0008] Inputting the visualization component information into a neural network model and outputting preliminary layout information, wherein the neural network model is a model for performing visualization interface layout according to the input visualization component information;

[0009] The target layout information of the visualization interface is generated based on the preliminary layout information.

[0010] Optionally, the adopting a preset image recognition technology to recognize the design drawing data and / or the rendering data to determine the visualization component information of the visualization interface includes:

[0011] Identify the chart information of the visualization interface from the design drawing data and / or the rendering data based on a preset image recognition technology;

[0012] The visualization component information matching the chart information is determined from a preset component library corresponding to the visualization interface.

[0013] Optionally, the generating target layout information of the visualization interface based on the preliminary layout information includes:

[0014] determining a plurality of chart components in the preliminary layout information;

[0015] Associating the plurality of chart components and determining weight information of the associated chart components;

[0016] The chart components in the preliminary layout information are adjusted based on the weight information to generate target layout information.

[0017] Optionally, associating the multiple chart components and determining weight information of the associated chart components includes:

[0018] Determining display data of the multiple chart components on the visualization interface;

[0019] determining a data relationship between the display data and / or a data importance of the display data;

[0020] Associating the plurality of chart components according to the data relationship and / or the data importance;

[0021] Determine the weight information of the associated chart components.

[0022] Optionally, adjusting the chart components in the preliminary layout information based on the weight information to generate target layout information includes:

[0023] Determine the layout order of the chart components according to the weight information from high to low;

[0024] The chart components in the preliminary layout information are adjusted in layout based on the layout order to generate target layout information.

[0025] Optionally, it also includes:

[0026] When a change in the visualization interface is detected, the visualization interface is controlled to adjust its layout.

[0027] Optionally, it also includes:

[0028] Before inputting the visualization component information into the neural network model, the visualization component information is standardized.

[0029] A data processing device, comprising:

[0030] A data acquisition module is used to acquire design drawing data and / or rendering data of a visualization interface;

[0031] A visualization component information determination module, used to identify the design drawing data and / or the rendering data using a preset image recognition technology to determine the visualization component information of the visualization interface;

[0032] A preliminary layout information determination module, used to input the visualization component information into a neural network model and output preliminary layout information, wherein the neural network model is a model for performing visualization interface layout according to the input visualization component information;

[0033] The target layout information determination module is used to generate the target layout information of the visualization interface based on the preliminary layout information.

[0034] Optionally, the visualization component information determination module includes:

[0035] An image recognition submodule, used to recognize the chart information of the visualization interface from the design drawing data and / or the effect drawing data based on a preset image recognition technology;

[0036] The component matching submodule is used to determine the visualization component information matching the chart information from the preset component library corresponding to the visualization interface.

[0037] Optionally, the target layout information determination module includes:

[0038] A chart component determination submodule, used to determine a plurality of chart components in the preliminary layout information;

[0039] A weight information determination submodule, used to associate the plurality of chart components and determine weight information of the associated chart components;

[0040] The target layout information determination submodule is used to adjust the chart components in the preliminary layout information based on the weight information to generate target layout information.

[0041] Optionally, the weight information determination submodule includes:

[0042] A display data determination unit, used to determine display data of the multiple chart components on the visualization interface;

[0043] a data information determining unit, configured to determine a data relationship between the display data and / or data importance of the display data;

[0044] A component associating unit, configured to associate the plurality of chart components according to the data relationship and / or the data importance;

[0045] The weight information determining unit is used to determine the weight information of the associated chart component.

[0046] Optionally, the target layout information determination submodule includes:

[0047] A layout order determining unit, used to determine the layout order of the chart components according to the weight information from high to low;

[0048] The target layout information determining unit is used to perform layout adjustment on the chart components in the preliminary layout information based on the layout order to generate target layout information.

[0049] Optionally, the device further comprises:

[0050] The layout adjustment module is used to control the layout of the visualization interface to adjust when a change in the visualization interface is detected.

[0051] Optionally, the device further comprises:

[0052] The data standardization processing module is used to standardize the visualization component information before inputting the visualization component information into the neural network model.

[0053] An electronic device comprises a processor, a memory and a computer program stored in the memory and capable of running on the processor, wherein the computer program implements the above-mentioned data processing method when executed by the processor.

[0054] A computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the data processing method described above is implemented.

[0055] The embodiments of the present invention have the following advantages:

[0056] The embodiment of the present invention obtains the design drawing data and / or rendering data of the visualization interface; then, a preset image recognition technology can be used to identify the design drawing data and / or rendering data to determine the visualization component information of the visualization interface; then, the visualization component information can be input into a neural network model to output preliminary layout information, and the neural network model is a model for performing visualization interface layout according to the input visualization component information; thus, the target layout information of the visualization interface can be generated based on the preliminary layout information. The rapid layout of the chart components of the low-code data visualization interface is realized, and the user does not need to spend a lot of time on page layout, adjustment, and overall large-screen design, which improves the processing efficiency of the visualization interface and reduces the reliance on manual operations. At the same time, it can help enterprises to realize the rapid reuse of data visualization interfaces for different business scenarios and user roles. BRIEF DESCRIPTION OF THE DRAWINGS

[0057] In order to more clearly illustrate the technical solution of the present invention, the accompanying drawings required for use in the description of the present invention will be briefly introduced below. Obviously, the accompanying drawings in the following description are only some embodiments of the present invention. For ordinary technicians in this field, other accompanying drawings can be obtained based on these accompanying drawings without paying creative labor.

[0058] Figure 1a is a flow chart of steps of a data processing method provided by one embodiment of the present invention;

[0059] Figure 1b This is a schematic diagram of large screen layout classification provided by an embodiment of the present invention;

[0060] Figure 2a is a flowchart of another data processing method provided by an embodiment of the present invention;

[0061] Figure 2b is a schematic diagram of a layout of different components provided by an embodiment of the present invention;

[0062] Figure 2c is a relationship between data provided by an embodiment of the present invention;

[0063] Figure 3a It is a flow chart of an intelligent layout method of a low-code data visualization interface provided by an embodiment of the present invention;

[0064] Figure 3b This is a schematic diagram of an interface layout step provided by an embodiment of the present invention;

[0065] Figure 4 It is a structural diagram of a data processing device provided by an embodiment of the present invention. DETAILED DESCRIPTION

[0066] In order to make the above-mentioned purposes, features and advantages of the present invention more obvious and easy to understand, the present invention is further described in detail below in conjunction with the accompanying drawings and specific embodiments. Obviously, the described embodiments are part of the embodiments of the present invention, rather than all the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0067] Reference Figure 1a , shows a flow chart of the steps of a data processing method provided by an embodiment of the present invention, which may specifically include the following steps:

[0068] Step S101, obtaining design drawing data and / or rendering data of a visualization interface;

[0069] The visualization interface in the embodiment of the present invention is a front-end user-oriented interface for intuitively displaying data to the user. The design drawing data and the effect drawing data are image data that need to be displayed to the user in the visualization interface.

[0070] Step S102, using a preset image recognition technology to recognize the design drawing data and / or the rendering data, and determining the visualization component information of the visualization interface;

[0071] Among them, image recognition technology is used to identify images and obtain data corresponding to the images, thereby realizing the conversion of images into data. The visual component information in the embodiment of the present invention can be the characteristic information of each component in the visual interface, including but not limited to component type information, size information, position information, proportion information, etc.

[0072] In an embodiment of the present invention, the preset image recognition technology may include processes such as image preprocessing, feature extraction, image segmentation, component information extraction, and result output.

[0073] During image preprocessing, the image can be sharpened and normalized. Image sharpening can ensure that the image quality is high enough for effective recognition. Image normalization can convert the image into a uniform format and size for subsequent processing.

[0074] The feature extraction process can apply edge detection technology and key point detection technology. Among them, edge detection technology is a technology that uses methods such as the Canny edge detection algorithm to identify edges and contours in an image. Key point detection is a technology that uses algorithms such as SIFT (Scale Invariant Feature Transform) or SURF (Speeded Up Robust Features) to extract key points and feature descriptors in an image.

[0075] The image segmentation process can include region segmentation and object recognition. Region segmentation mainly uses methods such as region growing algorithm or watershed algorithm to divide the image into different regions, each of which represents a potential visual component. Object recognition mainly uses deep learning models (such as convolutional neural network CNN) to classify the segmented regions and identify specific visual components (such as buttons, text boxes, icons, etc.).

[0076] The component information extraction process can include attribute recognition and relationship analysis. Attribute recognition is used to further analyze the identified visual components and extract their attribute information, such as position, size, color, text content, etc. Relationship analysis is used to analyze the relative position and interaction relationship between components and build the hierarchical structure and logical relationship of components.

[0077] During the result output process, the identified and extracted information can be displayed in a visual way to facilitate user understanding and use. The recognition results are stored as structured data to facilitate subsequent query and analysis.

[0078] Through the above steps, the preset image recognition technology can effectively identify the design data and rendering data, and accurately determine the visual component information of the visual interface. This process requires not only advanced image processing algorithms, but also powerful computing power and support from deep learning models to ensure the accuracy and efficiency of recognition.

[0079] Step S103, inputting the visualization component information into the neural network model, and outputting preliminary layout information, the neural network model is a model for performing visualization interface layout according to the input visualization component information;

[0080] After identifying the visualization components, the visualization component information can be input into the trained neural network model, and the neural network model can perform preliminary layout based on the visualization components and output preliminary layout information, wherein the preliminary layout information can include the location and area information of the components.

[0081] In one embodiment of the present invention, a large amount of design drawing data and / or rendering data of a visual interface, as well as a visual interface layout corresponding to the design drawing data and / or rendering data, can be collected. After image feature recognition is performed on these data, they are input into the initial neural network model for training. The model parameters in the neural network model are adjusted based on the predicted layout information and the actual visual layout information feedback, so that the predicted layout information approaches the actual visual layout information. After multiple iterations of the neural network model according to this training method, a neural network model that can be used to execute the interface layout is obtained. Among them, the neural network model in the embodiment of the present invention may include but is not limited to a convolutional neural network (CNN), a recurrent neural network (RNN), a generative adversarial network (GAN), an attention mechanism (Attention Mechanism), and a graph neural network (GNN). In actual applications, any of the above models can be selected to train the interface layout model alone, or a combination of multiple different models can be used to train the interface layout model together.

[0082] In one embodiment of the present invention, a model performance evaluation can be performed on a trained neural network model, wherein the evaluation indicators may include but are not limited to one or more of accuracy, precision, and recall rate, F1 score (F1 Score, the harmonic mean of precision and recall rate, which comprehensively considers precision and recall rate), layout similarity, diversity, user satisfaction, and running time.

[0083] When setting evaluation indicators, appropriate indicators should be selected according to specific application scenarios and requirements, and indicators should be complementary to each other to comprehensively evaluate the performance of the model. For example, when evaluating an interface layout model, indicators such as accuracy, layout similarity, and diversity can be used simultaneously to ensure that the model performs well in terms of accuracy, consistency, and creativity.

[0084] In one embodiment of the present invention, before inputting the visualization component information into the neural network model, the visualization component information is standardized.

[0085] In the data preprocessing stage, standardizing the position and size information of components, encoding the types of components, and generating training and test data sets are key steps to ensure the effectiveness of model training and generalization capabilities. Among them, the purpose of standardizing the position and size information of components is to ensure that the position and size information of different components are on the same scale, which is convenient for model learning and processing. Specifically, the position information standardization process is to convert the position coordinates of the component into relative coordinates, for example, converting the absolute coordinates into percentage coordinates relative to the entire large screen. The size information standardization process is to convert the size of the component into a relative size, for example, converting the absolute pixel size into a percentage size relative to the entire large screen.

[0086] Assume that the coordinates of the upper left corner of a component are (100, 200) and the size of the large screen is (1920, 1080), then the standardized coordinates are (100 / 1920, 200 / 1080).

[0087] Assuming a component is 300 pixels wide and 200 pixels high, the normalized size is (300 / 1920,200 / 1080).

[0088] The purpose of encoding component types is to convert component types into numerical form to facilitate model processing.

[0089] Methods for encoding component types may include one-hot encoding and label encoding. One-hot encoding may be used to convert each component type into a binary vector where only one element is 1 and the rest are 0. Label encoding may be used to map each component type to a unique integer value.

[0090] For example, there are three types of components: chart, text box, and button. After one-hot encoding, they are [1,0,0], [0,1,0], and [0,0,1]. After label encoding, they are 0, 1, and 2 respectively.

[0091] In one embodiment of the present invention, the standardized and encoded data may be further divided into a training set and a test set, and the training set and the test set may be used for model training and verification.

[0092] The partitioning method can be random partitioning or stratified partitioning. Random partitioning is used to randomly divide the data into training and test sets, for example, the ratio is 70% training set and 30% test set.

[0093] Stratified partitioning ensures that the distribution of component types in the training set and test set is consistent with the entire dataset, which is suitable for cases of class imbalance. Stratified partitioning ensures that the proportion of each component type in the training set and test set is consistent with the entire dataset.

[0094] Assume that there are 1000 component data, which are randomly divided into 700 training samples and 300 test samples.

[0095] By standardizing the location and size information of components, encoding the types of components, and generating training and test datasets, the effectiveness and generalization ability of model training can be ensured. These steps help improve the performance and reliability of the model, enabling it to better adapt to different data and scenarios.

[0096] In one embodiment of the present invention, the display size is determined according to the size of the display screen of the visualization interface, and different layout modes are selected according to the size of the large screen type. The specific layout mode information is as follows: Figure 1b As shown. Large screen sizes can be divided into standard large screens, extra-large screens and special-shaped screens, among which the layout methods of standard large screens can include but are not limited to left-center-right layout, left-right layout, top bar layout, and middle prominent layout; the layout methods of extra-large screens can include but are not limited to equal layout, story layout, monarch-minister layout, and grid layout; the layout methods of special-shaped screens can include vertical layout, star layout, and wave layout.

[0097] Step S104: generating target layout information of the visualization interface based on the preliminary layout information.

[0098] After determining the preliminary layout information, optimization processing can be performed based on the preliminary layout information to generate target layout information of the visualization interface. The target layout information is the final layout. In practical applications, the initial layout information can be optimized based on the association between chart components.

[0099] In one embodiment of the present invention, a preset image recognition technology is used to identify design drawing data and / or rendering data to determine visualization component information of a visualization interface, including: identifying chart information of a visualization interface from the design drawing data and / or rendering data based on the preset image recognition technology; and determining visualization component information that matches the chart information from a preset component library corresponding to the visualization interface.

[0100] The chart information may include the position information, proportion information, etc. of the chart.

[0101] In practical applications, image preprocessing can be performed on design drawing data and / or rendering data. Then, chart recognition can be performed. Specifically, chart recognition includes feature extraction and chart classification. In the feature extraction process, image processing technology (such as edge detection, region segmentation) and deep learning models (such as CNN) can be used to extract chart features in the image. In the chart classification process, a pre-trained deep learning model (such as a convolutional neural network) can be used to classify the extracted chart features and identify specific chart types (such as line charts, bar charts, pie charts, etc.).

[0102] After identifying the chart, chart information extraction can be performed, and the identified chart can be further analyzed to extract its attribute information, such as position, size, color, data range, etc. And analyze the relationship between the chart and surrounding components (such as titles, legends, interactive buttons), and extract related data and interactive information.

[0103] After extracting the chart information, you can query the visualization components that match the identified chart information from the preset component library. Specifically, you can determine the visualization components that match the chart through attribute matching and / or interaction matching. Attribute matching is used to select the best matching component by comparing the attribute information of the chart with the attributes of the components in the component library. Interaction matching is used to consider the interactive requirements of the chart and select components that support corresponding interactive functions.

[0104] Through the above steps, the preset image recognition technology can effectively identify the chart information of the visualization interface from the design drawing data and the rendering data, and determine the matching visualization component information from the component library. This process requires not only advanced image processing algorithms, but also powerful computing power and the support of deep learning models to ensure the accuracy and efficiency of recognition. At the same time, the design and maintenance of the component library is also key, and it is necessary to ensure that the components in the component library can meet the display and interaction requirements of various charts.

[0105] In an embodiment of the present invention, when a change in the visualization interface is detected, the visualization interface is controlled to perform layout adjustment.

[0106] In actual applications, real-time monitoring technologies (such as event listeners and state managers) can be used to continuously track the state of the visual interface and user interactions. Change detection mechanisms can also be set up, such as comparing the differences before and after the interface state to identify changes in interface elements (such as addition, deletion, movement, resizing, etc.).

[0107] When changes are detected in the visual interface, the detected changes can be analyzed to determine the scope and type of impact of the changes (such as local changes, global changes). The changes can be prioritized according to their importance and urgency, and the order and strategy of layout adjustment can be determined.

[0108] Specifically, dynamic layout algorithms (such as elastic box layout and grid layout) can be used to rearrange and adjust interface elements. Then, the layout can be optimized according to interface design principles (such as alignment, consistency, and usability) to ensure that the adjusted layout is both beautiful and practical. Then, graphic rendering technology can be used to update the adjusted layout to the visual interface in real time to ensure that users can see the changes immediately.

[0109] When changes are detected in the visual interface, appropriate interactive feedback (such as animation effects and prompt information) can also be provided to help users understand and adapt to layout changes.

[0110] In actual applications, performance indicators (such as response time and rendering speed) during layout adjustment can be continuously monitored to ensure that the adjustment process is smooth and does not affect the user experience. Based on the monitoring results, the layout adjustment algorithm and rendering technology can be optimized to improve the efficiency and stability of layout adjustment.

[0111] In an embodiment of the present invention, by using image recognition technology and neural network algorithms, based on the design drawings or display effect drawings of the data visualization interface, the images are converted into data and model training is performed, and finally a one-click intelligent layout method that can be applied to the low-code data visualization interface design platform is generated. In the interface layout process, users only need to pay attention to the types of displayed data, the types of charts used, and the limitations of the relationships between displayed data, without considering the display and layout of each chart component in the data visualization interface.

[0112] In an embodiment of the present invention, the design drawing data and / or rendering data of the visualization interface can be obtained; then the preset image recognition technology can be used to identify the design drawing data and / or rendering data to determine the visualization component information of the visualization interface; then the visualization component information can be input into a neural network model to output preliminary layout information, and the neural network model is a model for performing visualization interface layout according to the input visualization component information; thus, the target layout information of the visualization interface can be generated based on the preliminary layout information. The rapid layout of the chart components of the low-code data visualization interface is realized, and the user does not need to spend a lot of time on page layout, adjustment and overall large-screen design, which improves the processing efficiency of the visualization interface and reduces the dependence on manual operation. At the same time, it can help enterprises to realize the rapid reuse of data visualization interfaces for different business scenarios and user roles.

[0113] Reference Figure 2a , shows a flowchart of another data processing method provided by an embodiment of the present invention, which may specifically include the following steps:

[0114] Step S201, obtaining design drawing data and / or effect drawing data of a visualization interface;

[0115] Step S202, using a preset image recognition technology to recognize the design drawing data and / or the rendering data, and determining the visualization component information of the visualization interface;

[0116] Step S203, inputting the visualization component information into the neural network model, and outputting preliminary layout information, the neural network model is a model for performing visualization interface layout according to the input visualization component information;

[0117] Step S204, determining a plurality of chart components in the preliminary layout information;

[0118] A plurality of graph components may be included in the preliminary layout information output by the neural network model.

[0119] Step S205, associating multiple chart components and determining weight information of the associated chart components;

[0120] To optimize the layout, multiple chart components can be simplified and associated, and then the weight information of the associated chart components can be determined. The weight information can be determined by the importance of the business data and the relationship between the chart components and the data displayed. The setting of the weight information can be manually corrected.

[0121] In one embodiment of the present invention, associating multiple chart components and determining weight information of the associated chart components may include the following sub-steps:

[0122] Sub-step 11, determining display data of multiple chart components on the visualization interface;

[0123] In one example, display data related to each chart component may be extracted from a data source (such as a database, an API interface).

[0124] Sub-step 12, determining the data relationship between the displayed data and / or the data importance of the displayed data;

[0125] Sub-step 13, associating the plurality of chart components according to data relationships and / or data importance;

[0126] Sub-step 14, determining the weight information of the associated chart components.

[0127] In practical applications, the priority and relationship diagram of the chart component elements in the target area can be determined. In this process, a chart component can be limited to be associated with at most two chart components. For the display mode of the associated components, chart components of different priorities have different weight values, and the display mode can be automatically selected by calculating the weight expression. Figure 2b , showing different component layouts in the embodiments of the present invention. The weight relationships of the components under different layouts are as follows:

[0128] (1)W1+W2>W3;

[0129] (2)W1+W2 <W3;

[0130] (3) W1 = W2 + W3 and W2 = W3;

[0131] (4) W1 = W2 = W3;

[0132] The relationship between the corresponding data is as follows Figure 2c shown.

[0133] (1) Data 2 is the intersection of data 1 and data 3;

[0134] (2) Data 3 contains data 1 and data 2;

[0135] (3) Data 1 and data 2 form data 3;

[0136] (4) Data 1, Data 2, and Data 3 are independent data of the same business module;

[0137] The corresponding weight values ​​of the combined charts are set to (1) 3, (2) 2, (3) 1, and (4) 0, respectively, and the weight value of the single display chart is 0.

[0138] Step S206: adjusting the chart components in the preliminary layout information based on the weight information to generate target layout information.

[0139] In practical applications, weight information determines the order of visual chart layout. The higher the weight value, the higher the priority of placement. In the optimization process, the layout can be optimized by introducing the weight information of the chart components.

[0140] In one embodiment of the present invention, the chart components in the preliminary layout information are adjusted based on the weight information to generate the target layout information, including: determining the layout order of the chart components by sorting them from high to low according to the weight information; and adjusting the layout of the chart components in the preliminary layout information based on the layout order to generate the target layout information.

[0141] In an embodiment of the present invention, the design drawing data and / or rendering data of the visualization interface can be obtained; then the preset image recognition technology can be used to identify the design drawing data and / or rendering data to determine the visualization component information of the visualization interface; then the visualization component information can be input into a neural network model to output preliminary layout information, and the neural network model is a model for performing visualization interface layout according to the input visualization component information; thereby, multiple chart components in the preliminary layout information can be determined; multiple chart components are associated, and weight information of the associated chart components is determined; the chart components in the preliminary layout information are adjusted based on the weight information to generate target layout information. Rapid layout of chart components in a low-code data visualization interface is achieved, and users do not need to spend a lot of time on page layout, adjustment, and overall large-screen design, which improves the processing efficiency of the visualization interface and reduces dependence on manual operations. At the same time, it can help enterprises to achieve rapid reuse of data visualization interfaces for different business scenarios and user roles.

[0142] The following is based on Figure 3a as well as Figure 3b The above embodiments of the present invention are exemplarily described as follows:

[0143] Reference Figure 3a As shown, it is a flowchart of an intelligent layout method of a low-code data visualization interface in an embodiment of the present invention. The flowchart may include processes such as data acquisition, data preprocessing, feature extraction, neural network model processing, data association components and final layout.

[0144] During the data acquisition process, a design drawing or a display effect drawing of the data visualization interface to be laid out can be obtained.

[0145] In the data preprocessing stage, the acquired data can be standardized to standardize the location and size information of the components, encode the types of components, and generate training data sets and test data sets;

[0146] In the feature extraction process, the feature information of the components can be extracted, and then the neural network model can be used for preliminary layout. Specifically, the extracted feature information can be input into the neural network model to obtain the initial layout information, and then the component association can be performed to realize layout optimization.

[0147] Reference Figure 3b FIG. 1 is a schematic diagram of an interface layout step in an embodiment of the present invention, which may specifically include the following steps:

[0148] Step S301, determining the layout method according to the large screen size;

[0149] Large screen sizes can be divided into standard large screens, extra-large screens and special-shaped screens. Among them, the layout methods of standard large screens may include but are not limited to left-center-right layout, left-right layout, top bar layout, and middle prominent layout; the layout methods of extra-large screens may include but are not limited to equal layout, story layout, monarch and minister layout, and grid layout; the layout methods of special-shaped screens may include vertical layout, star layout, and wave layout.

[0150] Select the target layout from a variety of different layouts available based on the screen size.

[0151] Step S302, clarifying the chart component elements displayed in the target area;

[0152] The design drawing data and / or rendering data of the visualization interface are obtained, and then the design drawing data and / or the rendering data are identified using a preset image recognition technology to determine the visualization component information (i.e., chart component elements) of the visualization interface.

[0153] In actual applications, the data visualization interface designer can decide the type and number of chart components to be used. At the same time, the program will limit the number of visualization chart components according to the layout method selected in S302. The number of charts displayed on a single screen is between 7 and 10, and it is avoided that there are more than 12 charts to prevent information overload and visual fatigue. The number of visualization charts displayed is limited to between 7 and 12.

[0154] Step S303, obtaining large screen layout information through a neural network algorithm;

[0155] The chart component elements and the target layout method are input into the neural network model, and the neural network algorithm is used to obtain the large-screen layout information.

[0156] Step S304, associating components according to the data displayed in the chart to determine the relationship between component elements;

[0157] Limit a chart component to be associated with at most 2 chart components. For the display mode of associated components, chart components with different priorities can set different weight values, and the display mode can be automatically selected through the calculation of weight expressions. Among them, the weight value can be determined by the importance of business data and the relationship between the chart components to display data.

[0158] Step S305: Use the rule engine of the data association component to adjust the position of the component and output the layout information of the visualization interface.

[0159] This application realizes the rapid layout of chart components of a low-code data visualization interface. Users do not need to spend a lot of time on page layout, adjustment, and overall large-screen design. They only need to drag the chart components to the area of ​​the design panel, and output the layout of the data visualization interface through a neural network algorithm. The charts are combined with the data used in the visualization charts, and the relationship and weight values ​​between the components are set. The entire data visualization interface is readjusted based on the above information, and the layout of the low-code data visualization interface is quickly realized, which improves processing efficiency and reduces dependence on manual operations without spending much time considering the layout design of the data large screen. At the same time, it helps enterprises to realize the rapid reuse of data visualization interfaces for different business scenarios and user roles.

[0160] It should be noted that, for the sake of simplicity, the method embodiments are described as a series of action combinations, but those skilled in the art should be aware that the embodiments of the present invention are not limited by the order of the actions described, because according to the embodiments of the present invention, certain steps can be performed in other orders or simultaneously. Secondly, those skilled in the art should also be aware that the embodiments described in the specification are all preferred embodiments, and the actions involved are not necessarily required by the embodiments of the present invention.

[0161] Reference Figure 4 , shows a schematic diagram of the structure of a data processing device provided by an embodiment of the present invention, which may specifically include the following modules:

[0162] Data acquisition module 401, used to acquire design data and / or effect data of a visualization interface;

[0163] A visualization component information determination module 402 is used to identify the design drawing data and / or the rendering data using a preset image recognition technology to determine the visualization component information of the visualization interface;

[0164] A preliminary layout information determination module 403 is used to input the visualization component information into a neural network model and output preliminary layout information. The neural network model is a model for performing visualization interface layout according to the input visualization component information.

[0165] The target layout information determination module 404 is configured to generate target layout information of the visualization interface based on the preliminary layout information.

[0166] In an embodiment of the present invention, the visualization component information determination module 402 may include:

[0167] An image recognition submodule, used to recognize the chart information of the visualization interface from the design drawing data and / or the effect drawing data based on a preset image recognition technology;

[0168] The component matching submodule is used to determine the visualization component information matching the chart information from the preset component library corresponding to the visualization interface.

[0169] In one embodiment of the present invention, the target layout information determination module 404 includes:

[0170] A chart component determination submodule, used to determine a plurality of chart components in the preliminary layout information;

[0171] A weight information determination submodule, used to associate the plurality of chart components and determine weight information of the associated chart components;

[0172] The target layout information determination submodule is used to adjust the chart components in the preliminary layout information based on the weight information to generate target layout information.

[0173] In one embodiment of the present invention, the weight information determination submodule may include:

[0174] A display data determination unit, used to determine display data of the multiple chart components on the visualization interface;

[0175] a data information determining unit, configured to determine a data relationship between the display data and / or data importance of the display data;

[0176] A component associating unit, configured to associate the plurality of chart components according to the data relationship and / or the data importance;

[0177] The weight information determining unit is used to determine the weight information of the associated chart component.

[0178] In an embodiment of the present invention, the target layout information determination submodule may include:

[0179] A layout order determining unit, used to determine the layout order of the chart components according to the weight information from high to low;

[0180] The target layout information determining unit is used to perform layout adjustment on the chart components in the preliminary layout information based on the layout order to generate target layout information.

[0181] In one embodiment of the present invention, the device further comprises:

[0182] The layout adjustment module is used to control the layout of the visualization interface to adjust when a change in the visualization interface is detected.

[0183] In one embodiment of the present invention, the device further comprises:

[0184] The data standardization processing module is used to standardize the visualization component information before inputting the visualization component information into the neural network model.

[0185] In an embodiment of the present invention, the design drawing data and / or rendering data of the visualization interface can be obtained; then the preset image recognition technology can be used to identify the design drawing data and / or the rendering data to determine the visualization component information of the visualization interface; then the visualization component information can be input into a neural network model to output preliminary layout information, and the neural network model is a model for performing visualization interface layout according to the input visualization component information; thus, the target layout information of the visualization interface can be generated based on the preliminary layout information. Rapid layout of chart components of a low-code data visualization interface is achieved, and users do not need to spend a lot of time on page layout, adjustment, and overall large-screen design, which improves the processing efficiency of the visualization interface and reduces dependence on manual operations. At the same time, it can help enterprises to achieve rapid reuse of data visualization interfaces for different business scenarios and user roles.

[0186] An embodiment of the present invention further provides an electronic device, which may include a processor, a memory, and a computer program stored in the memory and capable of running on the processor, and the computer program implements the above data processing method when executed by the processor.

[0187] An embodiment of the present invention further provides a computer-readable storage medium, on which a computer program is stored. When the computer program is executed by a processor, the above data processing method is implemented.

[0188] As for the device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment.

[0189] The various embodiments in this specification are described in a progressive manner, and each embodiment focuses on the differences from other embodiments. The same or similar parts between the various embodiments can be referenced to each other.

[0190] Those skilled in the art will appreciate that the embodiments of the present invention may be provided as methods, devices, or computer program products. Therefore, the embodiments of the present invention may take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware. Moreover, the embodiments of the present invention may take the form of a computer program product implemented on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program codes.

[0191] The embodiments of the present invention are described with reference to the flowcharts and / or block diagrams of the methods, terminal devices (systems), and computer program products according to the embodiments of the present invention. It should be understood that each process and / or box in the flowchart and / or block diagram, as well as the combination of the processes and / or boxes in the flowchart and / or block diagram, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing terminal device to generate a machine, so that the instructions executed by the processor of the computer or other programmable data processing terminal device generate a device for implementing the functions specified in one process or multiple processes in the flowchart and / or one box or multiple boxes in the block diagram.

[0192] These computer program instructions may also be stored in a computer-readable memory that can direct a computer or other programmable data processing terminal device to operate in a specific manner, so that the instructions stored in the computer-readable memory produce a manufactured product including an instruction device that implements the functions specified in one or more processes in the flowchart and / or one or more boxes in the block diagram.

[0193] These computer program instructions can also be loaded onto a computer or other programmable data processing terminal device so that a series of operating steps are executed on the computer or other programmable terminal device to produce computer-implemented processing, so that the instructions executed on the computer or other programmable terminal device provide steps for implementing the functions specified in one or more processes in the flowchart and / or one or more boxes in the block diagram.

[0194] Although the preferred embodiments of the present invention 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 that fall within the scope of the embodiments of the present invention.

[0195] Finally, it should be noted that, in this article, relational terms such as first and second, etc. are only used to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the terms "include", "comprises" or any other variants thereof are intended to cover non-exclusive inclusion, so that a process, method, article or terminal device including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or terminal device. In the absence of further restrictions, the elements defined by the sentence "including one..." do not exclude the existence of other identical elements in the process, method, article or terminal device including the elements.

[0196] The data processing method and device provided above are introduced in detail. Specific examples are used in this article to illustrate the principles and implementation methods of the present invention. The description of the above embodiments is only used to help understand the method of the present invention and its core idea. At the same time, for those skilled in the art, according to the idea of ​​the present invention, there will be changes in the specific implementation method and application scope. In summary, the content of this specification should not be understood as a limitation on the present invention.

Claims

1. A data processing method, characterized in that: The method comprises: Obtain design drawing data and / or rendering data of a visualization interface; Using a preset image recognition technology to recognize the design drawing data and / or the rendering data, and determine the visualization component information of the visualization interface; Inputting the visualization component information into a neural network model and outputting preliminary layout information, wherein the neural network model is a model for performing visualization interface layout according to the input visualization component information; The target layout information of the visualization interface is generated based on the preliminary layout information.

2. The method according to claim 1, characterized in that The adopting of a preset image recognition technology to recognize the design drawing data and / or the rendering data to determine the visualization component information of the visualization interface includes: Identify the chart information of the visualization interface from the design drawing data and / or the rendering data based on a preset image recognition technology; The visualization component information matching the chart information is determined from a preset component library corresponding to the visualization interface.

3. The method according to claim 1, characterized in that The generating target layout information of the visualization interface based on the preliminary layout information includes: determining a plurality of chart components in the preliminary layout information; Associating the plurality of chart components and determining weight information of the associated chart components; The chart components in the preliminary layout information are adjusted based on the weight information to generate target layout information.

4. The method according to claim 3, characterized in that The step of associating the plurality of chart components and determining weight information of the associated chart components includes: Determining display data of the multiple chart components on the visualization interface; determining a data relationship between the display data and / or a data importance of the display data; Associating the plurality of chart components according to the data relationship and / or the data importance; Determine the weight information of the associated chart components.

5. The method according to claim 3, characterized in that: The step of adjusting the chart components in the preliminary layout information based on the weight information to generate target layout information includes: Determine the layout order of the chart components according to the weight information from high to low; The chart components in the preliminary layout information are adjusted in layout based on the layout order to generate target layout information.

6. The method according to any one of claims 1 to 5, characterized in that Also includes: When a change in the visualization interface is detected, the visualization interface is controlled to adjust its layout.

7. The method according to any one of claims 1 to 5, characterized in that Also includes: Before inputting the visualization component information into the neural network model, the visualization component information is standardized.

8. A data processing device, characterized in that: The device comprises: A data acquisition module is used to acquire design drawing data and / or rendering data of a visualization interface; A visualization component information determination module, used to identify the design drawing data and / or the rendering data using a preset image recognition technology to determine the visualization component information of the visualization interface; A preliminary layout information determination module, used to input the visualization component information into a neural network model and output preliminary layout information, wherein the neural network model is a model for performing visualization interface layout according to the input visualization component information; The target layout information determination module is used to generate the target layout information of the visualization interface based on the preliminary layout information.

9. The device according to any one of claims 8, characterized in that The visualization component information determination module includes: An image recognition submodule, used to recognize the chart information of the visualization interface from the design drawing data and / or the effect drawing data based on a preset image recognition technology; The component matching submodule is used to determine the visualization component information matching the chart information from the preset component library corresponding to the visualization interface.

10. The device according to any one of claims 8, characterized in that The target layout information determination module includes: A chart component determination submodule, used to determine a plurality of chart components in the preliminary layout information; A weight information determination submodule, used to associate the plurality of chart components and determine weight information of the associated chart components; The target layout information determination submodule is used to adjust the chart components in the preliminary layout information based on the weight information to generate target layout information.

11. The device according to any one of claims 10, characterized in that The weight information determination submodule includes: A display data determination unit, used to determine display data of the multiple chart components on the visualization interface; a data information determining unit, configured to determine a data relationship between the display data and / or data importance of the display data; A component associating unit, configured to associate the plurality of chart components according to the data relationship and / or the data importance; The weight information determining unit is used to determine the weight information of the associated chart component.

12. The device according to any one of claims 10, characterized in that The target layout information determination submodule includes: A layout order determining unit, used to determine the layout order of the chart components according to the weight information from high to low; The target layout information determining unit is used to perform layout adjustment on the chart components in the preliminary layout information based on the layout order to generate target layout information.

13. The device according to any one of claims 8, characterized in that The device also includes: The layout adjustment module is used to control the layout of the visualization interface to adjust when a change in the visualization interface is detected.

14. The device according to any one of claims 8, characterized in that The device also includes: The data standardization processing module is used to perform standardization processing on the visualization component information before inputting the visualization component information into the neural network model.

15. An electronic device, characterized in that: The method comprises a processor, a memory, and a computer program stored in the memory and capable of running on the processor, wherein when the computer program is executed by the processor, the data processing method according to any one of claims 1 to 7 is implemented.

16. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the data processing method according to any one of claims 1 to 7 is implemented.

Images