Method for generating a page

Abstract

The application discloses a page generation method. The method comprises the following steps: acquiring a region image, source data corresponding to the region image, and a data structure feature of the source data; inputting the region image into a classification model, performing feature extraction on the region image by using the classification model to obtain a target image feature, determining a target chart type corresponding to the target image feature according to preset image features and target relationship information of a preset chart type; recognizing text information in the region image; fusing the data structure feature, the target chart type and the text information to obtain a feature analysis result of the region image; and based on the source data, rendering configuration information corresponding to the feature analysis result in preset configuration information to obtain a target page, wherein the target page comprises the text information and chart elements of the source data. The target page is generated in combination with the multi-aspect features of the image, manual reading of the image is not required, time consumption is reduced, and the generation efficiency and reusability of the page are improved.

Description

Technical Field

[0001] This application belongs to the field of image processing technology, and in particular relates to a method for generating a page. Background Technology

[0002] With the development of Internet technology, the demand for data visualization in multiple scenarios and on multiple terminals is becoming increasingly widespread. As a result, a large number of data visualization scenarios will appear in various fields of application.

[0003] Visualization scenarios and requirements vary across different systems. Existing common visualization pages are generated by manually reading images determined by designers based on the required scenario, then developing and integrating the chart elements in the images, connecting to the data source through coding, and finally rendering. This process is not only time-consuming and inefficient in page generation, but also lacks reusability. Summary of the Invention

[0004] This application provides a method, apparatus, device, medium, and product for generating a page. By acquiring the data structure features corresponding to an image, determining the chart type, and recognizing text information in the image, a feature analysis result is obtained through fusion. Based on the feature analysis result, the corresponding configuration information is rendered to obtain the target page. Generating the target page by combining multiple features of the image eliminates the need for manual image reading, reducing time consumption and improving page generation efficiency and reusability.

[0005] In a first aspect, embodiments of this application provide a method for generating a page, comprising:

[0006] Obtain the region image, the corresponding source data of the region image, and the data structure features of the source data;

[0007] The region image is input into the classification model, and the classification model is used to extract features from the region image to obtain target image features. According to the target relationship information of preset image features and preset chart types, the target chart type corresponding to the target image features is determined.

[0008] Identify text information in a region image;

[0009] The feature analysis results of the regional image are obtained by fusing data structure features, target chart types, and text information;

[0010] Based on the source data, the configuration information corresponding to the feature analysis results in the preset configuration information is rendered to obtain the target page, which includes text information and chart elements of the source data.

[0011] In one possible implementation, acquiring a region image includes:

[0012] Get the initial image;

[0013] The initial image is divided into regions to obtain regional images.

[0014] In one possible implementation, obtaining the source data corresponding to the region image and the data structure features of the source data includes:

[0015] Display area image;

[0016] Receive the input of the source data address corresponding to the region image;

[0017] In response to input, retrieve the source data from the source data address;

[0018] Extract the data structure features of the source data.

[0019] In one possible implementation, in response to input, obtaining source data from the source data address includes:

[0020] In response to the input, the regional images are clustered according to the source data address to obtain at least one set of regional images;

[0021] Obtain the source data corresponding to the source data address of each region image set.

[0022] In one possible implementation, after determining the target chart type corresponding to the target image features, the method further includes:

[0023] Obtain the preset data structure features corresponding to the target chart type;

[0024] The comparison results are obtained by comparing the preset data structure features with the data structure features of the source data;

[0025] Determine the degree of matching based on the comparison results;

[0026] Displays the matching degree.

[0027] In one possible implementation, based on the source data, the configuration information corresponding to the feature analysis results in the preset configuration information is rendered to obtain the target page, including:

[0028] Obtain the layout information of the region image within the initial image;

[0029] The configuration information corresponding to the feature analysis results in the preset configuration information is rendered to obtain the rendered image;

[0030] Based on the layout information, the rendered images are combined and processed to obtain the target page.

[0031] In one possible implementation, the rendered images are combined according to layout information to obtain the target page, including:

[0032] The number of region images obtained;

[0033] Determine the scene template information based on the quantity and target chart type;

[0034] Based on the layout information and scene template information, the rendered images are combined and processed to obtain the target page.

[0035] In one possible implementation embodiment, after rendering the configuration information corresponding to the feature analysis results in the preset configuration information to obtain a rendered image, the method further includes:

[0036] Generate identification information for the rendered image, and save the rendered image and identification information;

[0037] Receive a preview request sent by the terminal device, the preview request including identification information;

[0038] Send the rendered image to the terminal device for display.

[0039] In one possible implementation, the classification model includes a first sub-classification model and a second sub-classification model; the region image is input into the classification model, and the classification model is used to extract features from the region image to obtain target image features. Based on the target relationship information of preset image features and preset chart types, the target chart type corresponding to the target image features is determined, including:

[0040] The region image is divided into sub-region images corresponding to the region image;

[0041] Input the region image and partial region image into the classification model;

[0042] The first sub-classification model is used to extract features from the region image to obtain the first sub-image features. According to the target relationship information of the preset image features and preset chart types, the first sub-chart type corresponding to the first sub-image features is determined.

[0043] The second sub-classification model is used to extract features from a portion of the image to obtain the features of the second sub-image. Based on the target relationship information, the type of the second sub-chart corresponding to the features of the second sub-image is determined.

[0044] If the first sub-chart type and the second sub-chart type are the same, the first sub-chart type is determined to be the target chart type for the region image.

[0045] In one possible implementation, the method further includes, before inputting the region image and partial region image into the classification model:

[0046] Obtain image samples of the first region;

[0047] The first region image sample is divided to obtain the second region image sample corresponding to the first region image sample;

[0048] Input the first region image sample and the second region image sample into the initial classification model;

[0049] Using the first sub-initial classification model in the initial classification model, feature extraction is performed on the image samples of the first region to obtain the third sub-image features. According to the initial relationship information between the preset image features and the preset chart type, the first predicted chart type corresponding to the third sub-image features is determined.

[0050] Using the second sub-initial classification model in the initial classification model, feature extraction is performed on the second region image sample to obtain the fourth sub-image features. Based on the initial relational information, the second prediction chart type corresponding to the fourth sub-image features is determined.

[0051] Based on the features of the third and fourth sub-images, determine the first loss value of the initial classification model;

[0052] Based on the first and second prediction chart types, determine the second loss value of the initial classification model;

[0053] If the first loss value or the second loss value does not meet the preset training stopping condition, the model parameters of the initial classification model are updated. The updated initial classification model is used to update the third sub-image features, the fourth sub-image features, the first predicted chart type and the second predicted chart type, and the first loss value and the second loss value are updated until the first loss value and the second loss value meet the preset training stopping condition, and the classification model is obtained. The model parameters include the initial relation information.

[0054] Secondly, embodiments of this application provide an electronic device, the device comprising:

[0055] Processor and memory storing computer program instructions;

[0056] A method for generating pages that implement any of the above when the processor executes computer program instructions.

[0057] Thirdly, embodiments of this application provide a computer storage medium on which computer program instructions are stored, and when the computer program instructions are executed by a processor, a method for generating a page that implements any of the above-mentioned methods.

[0058] Fourthly, embodiments of this application provide a computer program product, characterized in that, when the instructions in the computer program product are executed by the processor of an electronic device, the electronic device is able to execute the page generation method of any of the above-mentioned methods.

[0059] This application discloses a page generation method, apparatus, device, medium, and product. The method includes: acquiring a region image, source data corresponding to the region image, and data structure features of the source data; inputting the region image into a classification model, using the classification model to extract features from the region image to obtain target image features, and determining a target chart type corresponding to the target image features according to target relationship information of preset image features and preset chart types; recognizing text information in the region image; fusing the data structure features, target chart type, and text information to obtain a feature analysis result of the region image; and rendering the configuration information corresponding to the feature analysis result in preset configuration information based on the source data to obtain a target page, wherein the target page includes text information and chart elements of the source data.

[0060] In this way, by acquiring the data structure features corresponding to the image, determining the chart type, and recognizing the text information in the image, the feature analysis results are obtained through fusion. Based on the feature analysis results, the corresponding configuration information is rendered to obtain the target page. By combining multiple features of the image to generate the target page, manual image reading is not required, reducing time consumption and improving the efficiency and reusability of page generation. Attached Figure Description

[0061] To more clearly illustrate the technical solutions of the embodiments of this application, the accompanying drawings used in the embodiments of this application will be briefly introduced below. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0062] Figure 1 This is a schematic diagram of the structure of a page generation system provided in one embodiment of this application;

[0063] Figure 2 This is a flowchart illustrating a page generation method provided in another embodiment of this application;

[0064] Figure 3 This is another embodiment of the design draft acquisition interface provided in this application;

[0065] Figure 4 This is a flowchart illustrating a page generation method provided in another embodiment of this application;

[0066] Figure 5 This is a flowchart illustrating a page generation method provided in another embodiment of this application;

[0067] Figure 6 This is another embodiment of the data source detection interface provided in this application;

[0068] Figure 7 This is a flowchart illustrating a page generation method provided in another embodiment of this application;

[0069] Figure 8 This is the target page provided in another embodiment of this application;

[0070] Figure 9 This is a schematic diagram of the structure of a page generation apparatus provided in another embodiment of this application;

[0071] Figure 10 This is a schematic diagram of the structure of an electronic device provided in another embodiment of this application. Detailed Implementation

[0072] The features and exemplary embodiments of various aspects of this application will be described in detail below. To make the objectives, technical solutions, and advantages of this application clearer, the application will be further described in detail below with reference to the accompanying drawings and specific embodiments. It should be understood that the specific embodiments described herein are only intended to explain this application and not to limit it. For those skilled in the art, this application can be implemented without some of these specific details. The following description of the embodiments is merely to provide a better understanding of this application by illustrating examples.

[0073] It should be noted that, in this document, relational terms such as "first" and "second" are used merely to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising..." does not exclude the presence of additional identical elements in the process, method, article, or apparatus that includes said element.

[0074] With the development of Internet technology, the demand for data visualization in multiple scenarios and on multiple terminals is becoming increasingly widespread. As a result, a large number of data visualization scenarios will appear in various fields of application.

[0075] Visualization scenarios and requirements vary across different systems. Existing common visualization pages are generated by manually reading images determined by designers based on the required scenario, then developing and integrating the chart elements in the images, connecting to the data source through coding, and finally rendering. This process is not only time-consuming and inefficient in page generation, but also lacks reusability.

[0076] To address the problems of existing technologies, embodiments of this application provide a method, apparatus, device, medium, and product for generating pages. The page generation method provided in this application is applied to a page generation system. Figure 1 As shown, the page generation system 100 includes an image preprocessing module 110, a feature extraction module 120, a data conversion module 130, a canvas editing module 140, and a rendering module 150. The image preprocessing module 110 acquires a region image; the feature extraction module 120 acquires the data structure features corresponding to the region image, determines the chart type, and recognizes text information in the image, fusing them to obtain feature analysis results; the data conversion module 130 acquires the configuration information corresponding to the feature analysis results; and the canvas editing module 140 and the rendering module 150 render the corresponding configuration information based on the feature analysis results to obtain the target page. By combining multiple features of the image to generate the target page, manual image reading is unnecessary, reducing time consumption and improving page generation efficiency and reusability.

[0077] The page generation method provided in the embodiments of this application will be described below. Figure 2 A flowchart illustrating a page generation method provided in one embodiment of this application is shown.

[0078] like Figure 2 As shown, the page generation method provided in this application embodiment includes the following steps.

[0079] S210. Obtain the region image, the source data corresponding to the region image, and the data structure features of the source data.

[0080] Here, the area images are regional images of different areas in the design draft. Each area image includes at least one chart element. The source data includes the data that needs to be visualized.

[0081] In some embodiments, the source data corresponding to the region image includes data that matches the chart elements of the region image. Here, matching refers to matching data structure features, which may include, but are not limited to, data dimensions, variable types, statistical indicators, and correlation analysis.

[0082] S220. Input the region image into the classification model, use the classification model to extract features from the region image to obtain target image features, and determine the target chart type corresponding to the target image features according to the target relationship information of the preset image features and preset chart type.

[0083] Here, the classification model is pre-trained. The preset image features include the target image features, and the preset chart types include the target chart types.

[0084] In some embodiments, the classification model can be trained by a bilinear convolutional neural network.

[0085] In some embodiments, chart types are divided into broad chart categories and subcategories. Broad chart categories may include bar charts, pie charts, line charts, area charts, dashboards, numerical indicators, text charts, and combined charts. Taking bar charts as an example, subcategories can be further divided into classification bar charts, stacked bar charts, comparison bar charts, and pie charts, among others.

[0086] In some embodiments, the application scenarios for chart types may include comparison (such as bar charts, radar, funnels, polar coordinates), proportion (such as pie charts, funnels, dashboards), correlation (such as scatter plots, tree diagrams, evidence diagrams), trend (such as line charts, curve charts), and geographic maps (such as color maps).

[0087] It's important to note that the general chart categories only distinguish between two main types: "bar chart" and "line chart." However, for different application scenarios, it's necessary to differentiate between subcategories within these main categories. For example, distinguishing between "basic bar chart" and "stacked bar chart," "bar chart," and "donut bar chart"; and distinguishing between "basic pie chart" and "rose chart," "donut chart," and so on.

[0088] In some embodiments, the target chart type can be a chart category or a sub-category under a chart category.

[0089] S230, Identify text information in the region image.

[0090] As an example, the text information includes the title of the area image.

[0091] S240. The data structure features, target chart type and text information are fused to obtain the feature analysis results of the regional image.

[0092] In some embodiments, the results from three channels—chart type determination, text information recognition, and data structure feature acquisition—are fused using a feature-level fusion strategy to obtain the fused feature analysis result. As an example, based on data structure features, target chart type, and text information, a fine-grained chart type is obtained through the softmax layer of a feedforward artificial neural network model (MLP).

[0093] In some embodiments, the feature extraction module includes a multimodal feature extraction unit. The multimodal feature extraction unit is configured with an image recognition channel, a text processing channel, and a source data processing channel to determine the target chart type, text information, and data structure features, thereby enabling the extraction, fusion, and analysis of the visualization chart features and outputting feature analysis results.

[0094] In some embodiments, multimodal feature analysis is performed based on the different weights of the image recognition channel, text processing channel, and source data processing channel, and the feature analysis results are obtained by weighted summation of the target chart type, text information, and data structure features.

[0095] S250. Based on the source data, render the configuration information corresponding to the feature analysis results in the preset configuration information to obtain the target page. The target page includes text information and chart elements of the source data.

[0096] In some embodiments, based on the data conversion module, the feature analysis results are converted into visual component / element information, including component category, style, position and size, etc.

[0097] In some embodiments, the data conversion module transforms the feature analysis results into web-compatible interface elements and corresponding configuration information, including chart categories and / or subcategories, colors, sizes, and other configuration information. The configuration information corresponding to the feature analysis results is then input into the rendering module using the preset configuration information from the canvas editing module, rendering the configuration information into the target page.

[0098] In some embodiments, a target page is displayed, which provides editable controls. Users can further optimize and adjust the chart elements on the target page based on business line requirements and actual source data.

[0099] In some embodiments, the preset configuration information can satisfy the configuration information corresponding to the feature analysis results. The canvas editing module includes a container component and an attribute configuration unit. The preset configuration information that can be set in the container component and the attribute configuration unit includes:

[0100] 1. Container component and visualization scene template: (1) The container component is a wrapper for the chart component and meets the basic configuration, including: height, width, border, background, level and other configuration items, and can be dragged and dropped to change the position; (2) The visualization scene template data includes: layout structure, style, background, border and preset data source.

[0101] 2. Configuration panel configuration information: chart type, source data type and configuration, chart basic configuration, chart advanced configuration; (1) Source data type and configuration: realize the data restoration in the target page through the configuration of source data type and source data; (2) Chart basic configuration: configure the component size, position, level, scaling, background and border through the basic configuration panel, and configure the state, threshold, color and other settings for specific components; (3) Chart advanced configuration: realize the advanced configuration of the chart by directly inputting the chart configuration JSON data.

[0102] Here, custom components can also be implemented by embedding an iframe. As an example, we'll use visualization chart component libraries such as echarts as materials.

[0103] In some embodiments, the canvas editing module can be built using a front-end framework (such as Vue-cli).

[0104] In this way, by acquiring the data structure features corresponding to the image, determining the chart type, and recognizing the text information in the image, the feature analysis results are obtained through fusion. Based on the feature analysis results, the corresponding configuration information is rendered to obtain the target page. By combining multiple features of the image to generate the target page, manual image reading is not required, reducing time consumption and improving the efficiency and reusability of page generation.

[0105] Based on this, in some embodiments, acquiring the region image in S210 above may specifically include:

[0106] Get the initial image;

[0107] The initial image is divided into regions to obtain regional images.

[0108] Here, the initial image is a design draft.

[0109] In some embodiments, the image preprocessing module is used to upload and preprocess the initial image, divide and cut the design draft into regions, and standardize the image to obtain region images. Each region image contains at least one chart element.

[0110] In some embodiments, a design draft acquisition interface is displayed, through which the user uploads a design draft. In response to the user-uploaded design draft, the design draft is divided into regions to obtain area images.

[0111] As an example, such as Figure 3 As shown, the design draft acquisition interface includes an upload design draft control and a start recognition control.

[0112] In this way, by dividing the initial image, multiple regions can be identified and rendered separately, reducing interference between regions and improving the accuracy of the generated page.

[0113] Based on this, in some embodiments, such as Figure 4 As shown, in S210 above, obtaining the source data and data structure features of the source data corresponding to the region image can specifically include:

[0114] S211, Display area image;

[0115] S212, Receive the input of the source data address corresponding to the region image;

[0116] S213. In response to input, obtain the source data at the source data address;

[0117] S214. Extract the data structure features of the source data.

[0118] Here, the source data address includes the URL address.

[0119] In some embodiments, the canvas editing module includes a canvas rendering unit and a data source selection unit. The canvas editing module provides drag-and-drop canvas functionality, a configuration toolbar, source data switching, and publishing capabilities. Users can select source data and adjust the canvas layout.

[0120] In some embodiments, a canvas rendering unit displays a region image. A data source selection unit receives input of a source data address corresponding to the region image, and in response to the input, obtains the source data at the source data address and extracts the data structure features of the source data.

[0121] As an example, statistical analysis methods are used to extract the data structure features of the source data. Specifically, the source data is preprocessed (including standardization and normalization). Then, feature extraction is performed, including: identifying variable types: distinguishing between numerical, categorical, and time-series variables; calculating statistical indicators: calculating statistics such as mean, median, mode, standard deviation, variance, skewness, and kurtosis to understand the central tendency, dispersion, and distribution pattern of the data; correlation analysis: evaluating the linear and non-linear relationships between variables by calculating Pearson correlation coefficient, Spearman rank correlation coefficient, etc.; data dimensions: having multiple numerical variables indicates having multiple data dimensions. In some embodiments, the layout information of the region images in the initial image is obtained, and the region images are previewed in the canvas rendering unit according to the layout information, while the source data of different region images are configured.

[0122] In this way, by displaying an area image, users can input a suitable data source and select the corresponding configuration information by extracting the data structure features of the source data. This avoids the problem of mismatch between the chart scenario and the data source, improves the page generation efficiency, and saves labor costs.

[0123] Based on this, in some embodiments, the above-mentioned S213 may specifically include:

[0124] In response to the input, the regional images are clustered according to the source data address to obtain at least one set of regional images;

[0125] Obtain the source data corresponding to the source data address of each region image set.

[0126] Here, the source data addresses corresponding to the regional images in each regional image set are the same.

[0127] In some embodiments, different source data addresses are also used as the basis for displaying visualization charts, and charts with the same source data address are grouped into the same combined component unit. In terms of linkage effect, the repeated calling of source data in multiple charts can be reduced, the number of requests to remotely obtain data source interfaces can be reduced, and the loading time of large screen pages can be effectively shortened.

[0128] In this way, source data from the same source data address is retrieved only once, which reduces the repeated calls to source data in multiple charts, reduces the number of requests to remotely retrieve data source interfaces, and effectively shortens page loading time.

[0129] Based on this, in some embodiments, such as Figure 5 As shown, after S220 above, the method may further include:

[0130] S310. Obtain the preset data structure features corresponding to the target chart type;

[0131] S320. Compare the preset data structure features with the data structure features of the source data to obtain the comparison results;

[0132] S330. Determine the matching degree based on the comparison results;

[0133] S340, Display matching degree.

[0134] Here, the preset data structure features are predefined.

[0135] In some embodiments, a unified chart data format is used for charts of the same type according to a preset data access standard, allowing users to access source data simply by following the data format. Different charts are configured using the public application programming interface (API) for chart component conversion. The public APIs of the chart components are categorized to enable seamless switching and configuration between different charts.

[0136] In some embodiments, source data selection is performed before chart type generation. The matching degree between the data visualization chart type and the source data is then detected through data structure feature analysis of the source data. The matching degree is displayed through a data source detection interface.

[0137] As an example, such as Figure 6As shown, the data source detection interface displays the corresponding region image and receives the source data address corresponding to the region image as input. It also receives user input via clicks on the matching degree detection control, detects the data structure features of the source data in the source data address, compares the preset data structure features with the source data's data structure features, and obtains a comparison result. The comparison result includes match and non-match. For a match result, the matching degree detection passes; for a non-match result, it is recommended to change the source data.

[0138] It's important to note that the preset data structure features corresponding to the target chart type are pre-defined. There's a correspondence between data structure features and chart types. For example, if the source data includes time series data, it corresponds to a line chart; if the source data includes categorical variables, it corresponds to a bar chart or pie chart; if the correlation matrix of the source data is calculated and the correlation coefficient between any two columns is greater than 0.7, the source data corresponds to a scatter plot. For a single numerical variable, it corresponds to a histogram; for multiple numerical variables, it corresponds to a comparative bar chart.

[0139] Understandably, multimodal feature analysis from three dimensions—image recognition channel, text processing channel, and source data processing channel—can effectively solve the problem of mismatch between data source and design draft chart scenario.

[0140] In this way, by comparing the preset data structure features corresponding to the target chart type with the data structure features of the source data, the matching degree of the source data is determined, and the matching degree is displayed so that users can decide whether to use the selected source data, thus improving the user experience.

[0141] Based on this, in some embodiments, such as Figure 7 As shown, the above S250 may specifically include:

[0142] S251. Obtain the layout information of the region image in the initial image;

[0143] S252. Render the configuration information in the preset configuration information that corresponds to the feature analysis results to obtain a rendered image;

[0144] S253. According to the layout information, the rendered images are combined and processed to obtain the target page.

[0145] In some embodiments, a region image corresponds to a rendered image.

[0146] In some embodiments, the layout information includes at least the relative and / or specific location, size, and orientation of the region image.

[0147] As an example, the target page is as follows Figure 8 As shown. The target page includes text information and chart elements representing the source data.

[0148] In this way, by using the layout information of the regional images in the initial image, the rendered images corresponding to the regional images are combined and processed according to the layout information, and the target page is rendered according to the original layout, thus improving the accuracy of target page generation.

[0149] Based on this, in some embodiments, the above-mentioned S253 may specifically include:

[0150] The number of region images obtained;

[0151] Determine the scene template information based on the quantity and target chart type;

[0152] Based on the layout information and scene template information, the rendered images are combined and processed to obtain the target page.

[0153] Here, the scene template information is set in advance.

[0154] In some embodiments, relationship information between a preset number of region images, chart type, and preset scene template information is obtained, and scene template information corresponding to the acquired number of region images and target chart type is determined. Here, the preset scene template information includes the scene template information of the region images.

[0155] In some embodiments, preset data for added scenario-based templates is provided. For scenario-based templates, the user creates a new template with preset scenario information corresponding to the chart, enabling quick creation and modification of scenario-based templates.

[0156] In this way, not only is the layout information of the regional images in the initial image taken into account and the target page is rendered according to the original layout, but the target page can also add scene templates based on the number of regional images and the type of target chart, thereby improving the user experience.

[0157] Based on this, in some embodiments, after S252 described above, the method may further include:

[0158] Generate identification information for the rendered image, and save the rendered image and identification information;

[0159] Receive a preview request sent by the terminal device, the preview request including identification information;

[0160] Send the rendered image to the terminal device for display.

[0161] Here, the identification information can be a link or an ID.

[0162] In some embodiments, the page generation system may further include a storage module. Based on the rendering module and the storage module, multi-terminal display and browsing can be achieved according to the identification information of the rendered image.

[0163] In some embodiments, the generated rendered image is stored on a server, and a unique identifier link is generated. Upon receiving a preview request from a terminal device, the preview can be accessed on the terminal device via the unique identifier link.

[0164] In this way, the rendered image corresponding to the region image is saved, so that when a preview request is received from the terminal device, the rendered image can be sent to the terminal device and displayed, thereby improving the user experience.

[0165] Based on this, in some embodiments, the classification model includes a first sub-classification model and a second sub-classification model; the above S220 may specifically include:

[0166] The region image is divided into sub-region images corresponding to the region image;

[0167] Input the region image and partial region image into the classification model;

[0168] The first sub-classification model is used to extract features from the region image to obtain the first sub-image features. According to the target relationship information of the preset image features and preset chart types, the first sub-chart type corresponding to the first sub-image features is determined.

[0169] The second sub-classification model is used to extract features from a portion of the image to obtain the features of the second sub-image. Based on the target relationship information, the type of the second sub-chart corresponding to the features of the second sub-image is determined.

[0170] If the first sub-chart type and the second sub-chart type are the same, the first sub-chart type is determined to be the target chart type for the region image.

[0171] Here, the classification model can be trained using a bilinear convolutional neural network.

[0172] In some embodiments, the region image is divided to obtain partial region images corresponding to the region image. The output vectors of the fully connected layers are obtained through a classification model, namely the output vectors of the two convolutional networks: the first sub-chart type and the second sub-chart type. If the first sub-chart type and the second sub-chart type are consistent, the first sub-chart type is determined to be the target chart type of the region image.

[0173] In some embodiments, if the first sub-chart type and the second sub-chart type are inconsistent, a prompt message is displayed to remind the user that the classification model needs to be retrained.

[0174] Understandably, determining the fine-grained chart type through weak supervision helps in capturing local features under specific categories during target page generation, extracting more effective features, reducing the time developers spend extracting configuration information, and improving development efficiency. Compared to strongly supervised classification models, it does not require a large amount of manual input.

[0175] In this way, the chart type is determined by the first sub-classification model and the second sub-classification model respectively. If the chart type determined by the two models is consistent, the chart type corresponding to the region image is obtained, which improves the accuracy of chart type determination.

[0176] Based on this, in some embodiments, prior to the above-described S220, the method may further include:

[0177] Obtain image samples of the first region;

[0178] The first region image sample is divided to obtain the second region image sample corresponding to the first region image sample;

[0179] Input the first region image sample and the second region image sample into the initial classification model;

[0180] Using the first sub-initial classification model in the initial classification model, feature extraction is performed on the image samples of the first region to obtain the third sub-image features. According to the initial relationship information between the preset image features and the preset chart type, the first predicted chart type corresponding to the third sub-image features is determined.

[0181] Using the second sub-initial classification model in the initial classification model, feature extraction is performed on the second region image sample to obtain the fourth sub-image features. Based on the initial relational information, the second prediction chart type corresponding to the fourth sub-image features is determined.

[0182] Based on the features of the third and fourth sub-images, determine the first loss value of the initial classification model;

[0183] Based on the first and second prediction chart types, determine the second loss value of the initial classification model;

[0184] If the first loss value or the second loss value does not meet the preset training stopping condition, the model parameters of the initial classification model are updated. The updated initial classification model is used to update the third sub-image features, the fourth sub-image features, the first predicted chart type and the second predicted chart type, and the first loss value and the second loss value are updated until the first loss value and the second loss value meet the preset training stopping condition, and the classification model is obtained. The model parameters include the initial relation information.

[0185] Here, the initial classification model is a bilinear convolutional neural network.

[0186] In some embodiments, a first region image sample is acquired, and the first region image sample is divided to obtain a second region image sample corresponding to the first region image sample. Two convolutional networks are trained using the first region image sample and the second region image sample, respectively. It can be understood that the smaller the first loss value, the closer the feature calculation process of different convolutional networks is; the smaller the second loss value, the closer the different convolutional networks are in predicting chart types. The model parameters are continuously optimized to train and optimize the neural convolutional networks. When the first loss value and the second loss value are less than a preset threshold, the training process ends, and a trained weakly supervised classification model is obtained.

[0187] In some embodiments, the first loss value and the second loss value can be determined by the L2 norm distance.

[0188] In this way, by training the classification model with a large number of samples, the accuracy of the classification model's output results is improved, which in turn improves the accuracy of chart type determination.

[0189] It should be noted that since designers typically lack control over the selection and input of source data, a mismatch may occur between the chart types in the design draft and the actual scenarios and chart types required by the source data after the backend developers input the source data. This increases communication costs, and repeated modifications consume more development resources. The embodiment provided in this application solves the problem of prioritizing chart type design over source data selection. It moves the previously reactive selection of chart source data to before chart type generation, using multimodal image type feature and source data feature analysis to intelligently recommend data visualization chart types and scenario classifications. This avoids relying solely on chart types generated from the design draft, resolves the mismatch between the designed chart scenario and the actual data source characteristics, and reduces communication and modification time between designers and developers.

[0190] The embodiments provided in this application, in response to image upload and start recognition control input, read the design draft, preprocess the design draft, and then divide it into regions; through multimodal feature extraction, fine-grained features of the image of the visualization chart component are extracted; the obtained effective features are converted into chart elements and corresponding configuration information usable on the web, and rendered into a UI page; the chart elements include chart subcategories, styles, positions, sizes, etc. It also supports customizing source data and modifying chart configurations and events through configuration, quickly generating the target page that meets the requirements. It supports storing the rendered image on the server and generating identification information; users can preview the rendered image through multiple terminals.

[0191] In the embodiments provided in this application, fine-grained image recognition is used to further refine the types of visual charts, solving the problems of time-consuming and labor-intensive manual identification of configuration information, as well as the coarse granularity of chart classification in ordinary image recognition. By converting the subcategories of the chart categories output by the classification model and the related configuration information, development efficiency can be improved and labor costs can be saved.

[0192] In the embodiments provided in this application, the visualization chart types are further refined based on fine-grained image recognition, and key features are extracted and converted into configuration information that can be rendered on the web (according to the data format agreed upon by different chart libraries, taking the commonly used chart library Ant G2 as an example). The configuration information includes: category, location, and chart size style. The manual recognition of the design draft into the visualization target page is replaced by machine recognition. This solves the problems of time-consuming and labor-intensive manual recognition of configuration information and chart recognition only distinguishing broad categories, improving classification precision and saving labor costs. It provides editable canvas and source data selection functions, enabling the reuse of charts from different source data and reducing project maintenance costs.

[0193] Based on the page generation method provided in the above embodiments, this application also provides specific implementations of the page generation apparatus. Please refer to the following embodiments.

[0194] First see Figure 9 The page generation apparatus 400 provided in this application embodiment includes:

[0195] The acquisition module 410 is used to acquire the region image, the source data corresponding to the region image, and the data structure features of the source data;

[0196] The determination module 420 is used to input the region image into the classification model, use the classification model to extract features from the region image to obtain target image features, and determine the target chart type corresponding to the target image features according to the target relationship information of the preset image features and the preset chart type.

[0197] Recognition module 430 is used to recognize text information in a region image;

[0198] The fusion module 440 is used to fuse data structure features, target chart types, and text information to obtain feature analysis results of the regional image;

[0199] Rendering module 450 is used to render the configuration information corresponding to the feature analysis results from the preset configuration information based on the source data, to obtain the target page. The target page includes text information and chart elements from the source data.

[0200] Based on this, in some embodiments, the acquisition module 410 can be specifically used for:

[0201] Get the initial image;

[0202] The initial image is divided into regions to obtain regional images.

[0203] Based on this, in some embodiments, the acquisition module 410 can be specifically used for:

[0204] Display area image;

[0205] Receive the input of the source data address corresponding to the region image;

[0206] In response to input, retrieve the source data from the source data address;

[0207] Extract the data structure features of the source data.

[0208] Based on this, in some embodiments, the acquisition module 410 can be specifically used for:

[0209] In response to the input, the regional images are clustered according to the source data address to obtain at least one set of regional images;

[0210] Obtain the source data corresponding to the source data address of each region image set.

[0211] Based on this, in some embodiments, the device 400 may further include:

[0212] The acquisition module 410 is also used to acquire the preset data structure features corresponding to the target chart type after determining the target chart type corresponding to the target image features;

[0213] The comparison module is used to compare the preset data structure features with the data structure features of the source data to obtain the comparison results.

[0214] The determination module 420 is also used to determine the degree of matching based on the comparison results;

[0215] The display module is used to show the matching degree.

[0216] Based on this, in some embodiments, the rendering module 450 can specifically be used for:

[0217] Obtain the layout information of the region image within the initial image;

[0218] The configuration information corresponding to the feature analysis results in the preset configuration information is rendered to obtain the rendered image;

[0219] Based on the layout information, the rendered images are combined and processed to obtain the target page.

[0220] Based on this, in some embodiments, the rendering module 450 can specifically be used for:

[0221] The number of region images obtained;

[0222] Determine the scene template information based on the quantity and target chart type;

[0223] Based on the layout information and scene template information, the rendered images are combined and processed to obtain the target page.

[0224] Based on this, in some embodiments, the device 400 may further include:

[0225] The generation module is used to render the configuration information corresponding to the feature analysis results in the preset configuration information, obtain the rendered image, generate the identification information of the rendered image, and save the rendered image and the identification information.

[0226] The receiving module is used to receive preview requests sent by the terminal device. The preview request includes identification information.

[0227] The sending module is used to send the rendered image to the terminal device for display.

[0228] Based on this, in some embodiments, the classification model includes a first sub-classification model and a second sub-classification model; the determining module 420 can specifically be used for:

[0229] The region image is divided into sub-region images corresponding to the region image;

[0230] Input the region image and partial region image into the classification model;

[0231] The first sub-classification model is used to extract features from the region image to obtain the first sub-image features. According to the target relationship information of the preset image features and preset chart types, the first sub-chart type corresponding to the first sub-image features is determined.

[0232] The second sub-classification model is used to extract features from a portion of the image to obtain the features of the second sub-image. Based on the target relationship information, the type of the second sub-chart corresponding to the features of the second sub-image is determined.

[0233] If the first sub-chart type and the second sub-chart type are the same, the first sub-chart type is determined to be the target chart type for the region image.

[0234] Based on this, in some embodiments, the device 400 may further include:

[0235] The acquisition module 410 is also used to acquire a first region image sample before inputting the region image and the partial region image into the classification model;

[0236] The segmentation module is used to segment the first region image sample to obtain the second region image sample corresponding to the first region image sample;

[0237] The determination module 420 is also used to input the first region image sample and the second region image sample into the initial classification model;

[0238] The determination module 420 is also used to extract features from the first sub-initial classification model in the initial classification model to obtain the third sub-image features, and determine the first predicted chart type corresponding to the third sub-image features according to the initial relationship information between the preset image features and the preset chart type.

[0239] The determination module 420 is also used to extract features from the second region image sample using the second sub-initial classification model in the initial classification model to obtain the fourth sub-image features, and to determine the second prediction chart type corresponding to the fourth sub-image features according to the initial relation information;

[0240] The determination module 420 is also used to determine the first loss value of the initial classification model based on the features of the third sub-image and the features of the fourth sub-image;

[0241] The determination module 420 is further configured to determine a second loss value for the initial classification model based on the first prediction chart type and the second prediction chart type;

[0242] The determination module 420 is further configured to update the model parameters of the initial classification model when the first loss value or the second loss value does not meet the preset training stopping condition, update the third sub-image features, the fourth sub-image features, the first prediction chart type and the second prediction chart type using the updated initial classification model, and update the first loss value and the second loss value until the first loss value and the second loss value meet the preset training stopping condition, thereby obtaining a classification model whose model parameters include initial relational information.

[0243] Each module of the page generation apparatus provided in this application embodiment can realize the functions of each step of the page generation method provided above, and can achieve its corresponding technical effects. For the sake of brevity, it will not be described in detail here.

[0244] Based on the same inventive concept, embodiments of this application also provide an electronic device.

[0245] Figure 10 A schematic diagram of the hardware structure of the electronic device provided in an embodiment of this application is shown.

[0246] An electronic device may include a processor 501 and a memory 502 storing computer program instructions.

[0247] Specifically, the processor 501 may include a central processing unit (CPU), an application specific integrated circuit (ASIC), or one or more integrated circuits that can be configured to implement the embodiments of this application.

[0248] Memory 502 may include mass storage for data or instructions. For example, and not limitingly, memory 502 may include a hard disk drive (HDD), floppy disk drive, flash memory, optical disk, magneto-optical disk, magnetic tape, or Universal Serial Bus (USB) drive, or a combination of two or more of these. Where appropriate, memory 502 may include removable or non-removable (or fixed) media. Where appropriate, memory 502 may be internal or external to the integrated gateway disaster recovery device. In a particular embodiment, memory 502 is non-volatile solid-state memory.

[0249] Memory may include read-only memory (ROM), random access memory (RAM), disk storage media devices, optical storage media devices, flash memory devices, and electrical, optical, or other physical / tangible memory storage devices. Therefore, typically, memory includes one or more tangible (non-transitory) computer-readable storage media (e.g., memory devices) encoded with software including computer-executable instructions, and when the software is executed (e.g., by one or more processors), it is operable to perform the operations described with reference to the method according to one aspect of this disclosure.

[0250] The processor 501 reads and executes computer program instructions stored in the memory 502 to implement any of the page generation methods in the above embodiments.

[0251] In one example, the electronic device may also include a communication interface 503 and a bus 510. Wherein, as... Figure 10 As shown, the processor 501, memory 502, and communication interface 503 are connected through bus 510 and complete communication with each other.

[0252] The communication interface 503 is mainly used to realize communication between various modules, devices, units and / or equipment in the embodiments of this application.

[0253] Bus 510 includes hardware, software, or both, that couples components of an electronic device together. For example, and not limitingly, the bus may include an Accelerated Graphics Port (AGP) or other graphics bus, an Extended Industry Standard Architecture (EISA) bus, a Front Side Bus (FSB), a Hyper Transport (HT) interconnect, an Industry Standard Architecture (ISA) bus, an Infinite Bandwidth Interconnect, a Linear Predictive Coding (LPC) bus, a memory bus, a MicroChannel Architecture (MCA) bus, a Peripheral Component Interconnect (PCI) bus, a PCI-Express (Peripheral Component Interconnect-X) bus, a Serial Advanced Technology Attachment (SATA) bus, a Video Electronics Standards Association Local Bus (VESA Local Bus, VLB) bus, or other suitable buses, or a combination of two or more of these. Where appropriate, bus 510 may include one or more buses. Although specific buses are described and illustrated in the embodiments of this application, this application contemplates any suitable bus or interconnection. The electronic device can perform the page generation method in the embodiments of this invention, thereby implementing the page generation method described above.

[0254] Furthermore, in conjunction with the page generation methods in the above embodiments, this application embodiment can provide a computer storage medium for implementation. This computer storage medium stores computer program instructions; when these computer program instructions are executed by a processor, they implement any of the page generation methods in the above embodiments.

[0255] This application also provides a computer program product, wherein the instructions in the computer program product, when executed by the processor of an electronic device, cause the electronic device to perform various processes implementing any of the above-described page generation method embodiments.

[0256] It should be clarified that this application is not limited to the specific configurations and processes described above and shown in the figures. For the sake of brevity, detailed descriptions of known methods are omitted here. In the above embodiments, several specific steps are described and shown as examples. However, the method process of this application is not limited to the specific steps described and shown. Those skilled in the art can make various changes, modifications, and additions, or change the order of steps, after understanding the spirit of this application.

[0257] The functional blocks shown in the above-described block diagram can be implemented as hardware, software, firmware, or a combination thereof. When implemented in hardware, they can be, for example, electronic circuits, application-specific integrated circuits (ASICs), appropriate firmware, plug-ins, function cards, etc. When implemented in software, the elements of this application are programs or code segments used to perform the required tasks. Programs or code segments can be stored on a machine-readable medium or transmitted over a transmission medium or communication link via data signals carried on a carrier wave. "Machine-readable medium" can include any medium capable of storing or transmitting information. Examples of machine-readable media include electronic circuits, semiconductor memory devices, read-only memory (ROM), flash memory, erasable read-only memory (EROM), floppy disks, compact disc read-only memory (CD-ROM), optical disks, hard disks, fiber optic media, radio frequency (RF) links, etc. Code segments can be downloaded via computer networks such as the Internet, intranets, etc.

[0258] It should also be noted that the exemplary embodiments mentioned in this application describe methods or systems based on a series of steps or apparatus. However, this application is not limited to the order of the above steps; that is, the steps can be performed in the order mentioned in the embodiments, or in a different order, or several steps can be performed simultaneously.

[0259] The aspects of this disclosure have been described above with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this disclosure. It should be understood that each block in the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, 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, or other programmable data processing apparatus to produce a machine such that these instructions, executable via the processor of the computer or other programmable data processing apparatus, enable the implementation of the functions / actions specified in one or more blocks of the flowchart illustrations and / or block diagrams. Such a processor can be, but is not limited to, a general-purpose processor, a special-purpose processor, a special application processor, or a field-programmable logic circuit. It is also understood that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can also be implemented by special-purpose hardware performing the specified functions or actions, or can be implemented by a combination of special-purpose hardware and computer instructions.

[0260] The above are merely specific embodiments of this application. Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the specific working processes of the systems, modules, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here. It should be understood that the protection scope of this application is not limited thereto. Any person skilled in the art can easily conceive of various equivalent modifications or substitutions within the technical scope disclosed in this application, and these modifications or substitutions should all be covered within the protection scope of this application.

Claims

1. A method for generating a page, characterized in that, include: Acquire the region image, the source data corresponding to the region image, and the data structure features of the source data; The region image is input into a classification model, and the region image is used to extract features to obtain target image features. According to the target relationship information of preset image features and preset chart types, the target chart type corresponding to the target image features is determined. Identify text information in the image of the region; The data structure features, the target chart type, and the text information are fused to obtain the feature analysis results of the region image; Based on the source data, the configuration information corresponding to the feature analysis results in the preset configuration information is rendered to obtain the target page, which includes the text information and the chart elements of the source data.

2. The page generation method according to claim 1, characterized in that, The acquisition of the region image includes: Get the initial image; The initial image is divided into regions to obtain regional images.

3. The page generation method according to claim 1 or 2, characterized in that, Obtaining the source data corresponding to the region image and the data structure features of the source data includes: Display the image of the region; Receive the input of the source data address corresponding to the region image; In response to the input, obtain the source data at the source data address; Extract the data structure features of the source data.

4. The page generation method according to claim 3, characterized in that, The process of obtaining source data at the source data address in response to the input includes: In response to the input, the regional images are clustered according to the source data address to obtain at least one set of regional images; Obtain the source data corresponding to the source data address of each of the aforementioned region image sets.

5. The page generation method according to claim 3, characterized in that, After determining the target chart type corresponding to the target image features, the method further includes: Obtain the preset data structure features corresponding to the target chart type; By comparing the preset data structure features with the data structure features of the source data, a comparison result is obtained; Based on the comparison results, the matching degree is determined; Display the matching degree.

6. The page generation method according to claim 2, characterized in that, The step of rendering the configuration information corresponding to the feature analysis result in the preset configuration information based on the source data to obtain the target page includes: Obtain the layout information of the region image in the initial image; The configuration information corresponding to the feature analysis result in the preset configuration information is rendered to obtain a rendered image; The rendered images are combined and processed according to the layout information to obtain the target page.

7. The page generation method according to claim 6, characterized in that, The step of combining the rendered images according to the layout information to obtain the target page includes: Obtain the number of images in the region; Determine the scene template information based on the quantity and the target chart type; The rendered images are combined and processed according to the layout information and the scene template information to obtain the target page.

8. The page generation method according to claim 6, characterized in that, After rendering the configuration information corresponding to the feature analysis result from the preset configuration information to obtain a rendered image, the method further includes: Generate identification information for the rendered image, and save the rendered image and the identification information; Receive a preview request sent by a terminal device, the preview request including the identification information; The rendered image is sent to the terminal device for display on the terminal device.

9. The page generation method according to claim 1, characterized in that, The classification model includes a first sub-classification model and a second sub-classification model; the step of inputting the region image into the classification model, using the classification model to extract features from the region image to obtain target image features, and determining the target chart type corresponding to the target image features according to the target relationship information of preset image features and preset chart types includes: The region image is divided to obtain a partial region image corresponding to the region image; The region image and the partial region image are input into the classification model; The first sub-classification model is used to extract features from the region image to obtain the first sub-image features. According to the target relationship information of the preset image features and the preset chart type, the first sub-chart type corresponding to the first sub-image features is determined. The second sub-classification model is used to extract features from the partial region image to obtain the second sub-image features. According to the target relationship information, the second sub-chart type corresponding to the second sub-image features is determined. If the first sub-chart type and the second sub-chart type are the same, the first sub-chart type is determined to be the target chart type of the region image.

10. The page generation method according to claim 9, characterized in that, Before inputting the region image and the partial region image into the classification model, the method further includes: Obtain image samples of the first region; The first region image sample is divided to obtain the second region image sample corresponding to the first region image sample; The first region image sample and the second region image sample are input into the initial classification model; Using the first sub-initial classification model in the initial classification model, feature extraction is performed on the first region image sample to obtain the third sub-image feature. According to the initial relationship information between the preset image feature and the preset chart type, the first predicted chart type corresponding to the third sub-image feature is determined. Using the second sub-initial classification model in the initial classification model, feature extraction is performed on the second region image sample to obtain the fourth sub-image feature. According to the initial relationship information, the second prediction chart type corresponding to the fourth sub-image feature is determined. Based on the features of the third sub-image and the features of the fourth sub-image, the first loss value of the initial classification model is determined; Based on the first prediction chart type and the second prediction chart type, determine the second loss value of the initial classification model; If the first loss value or the second loss value does not meet the preset training stopping condition, the model parameters of the initial classification model are updated. The third sub-image feature, the fourth sub-image feature, the first predicted chart type, and the second predicted chart type are updated using the updated initial classification model. The first loss value and the second loss value are also updated until the first loss value and the second loss value meet the preset training stopping condition, thus obtaining the classification model. The model parameters include the initial relation information.

Images