Method, system, device and medium for building data visualization large screen based on ResNet algorithm improvement

Abstract

The application discloses a method, system, device and medium for building a data visualization large screen based on an improved ResNet algorithm, and the method comprises the following steps: constructing a training data set, training an improved ResNet18 model by using the training data set; removing two full connection layers of the trained improved ResNet18 model to serve as a feature extractor; extracting features of the training data set by using the feature extractor, training an SVM classifier by using the extracted features; cutting a large design graph to obtain a plurality of small graphs, inputting features of the small graphs into the trained SVM classifier after applying the feature extractor to extract the features of the small graphs, classifying the small graphs, matching components from a component library according to the categories of the small graphs, and rendering the components to a large screen according to the information of the small graphs; and configuring and adjusting the components and page attributes of the large screen according to data, display and event requirements of the large screen, so as to obtain a complete data visualization large screen. The application has a higher chart image classification accuracy than existing models, and reduces the design complexity of the large screen through low-code components, thereby avoiding a repeated configuration process.

Description

Technical Field

[0001] This invention relates to the field of image recognition, and specifically to a method, system, device, and medium for building a data visualization dashboard based on an improved ResNet algorithm. Background Technology

[0002] ReLU (Rectified Linear Unit) is an activation function widely used in deep learning.

[0003] ResNet, or Deep Residual Network, is a deep neural network architecture proposed by Microsoft Research Asia.

[0004] SGD (Stochastic Gradient Descent) is an optimization algorithm widely used in the fields of machine learning and deep learning.

[0005] SVM (Support Vector Machine) is a commonly used machine learning algorithm.

[0006] RBF (Radial Basis Function Kernel): A commonly used kernel function, widely applied in Support Vector Machines (SVM) and other machine learning algorithms.

[0007] In today's information and digital age, data has become a crucial foundation for organizational decision-making and strategic planning. However, with the dramatic increase in data volume and the diversification of data sources, traditional data processing and analysis methods are struggling to meet the demands for efficient and real-time decision-making. Enterprises and organizations face the challenge of effectively managing, analyzing, and presenting data. Data visualization, as a powerful data analysis tool, can transform complex data into intuitive and easily understandable information, thereby supporting faster and more accurate decision-making processes.

[0008] Data visualization dashboards typically refer to large-scale display systems that integrate various data visualization technologies and presentation methods. Through real-time data monitoring, dynamic data updates, and rich graphical presentations, they provide a comprehensive view, allowing users to easily understand data changes and trends. Existing data visualization solutions mainly include customized dashboard design and development, and drag-and-drop configuration of dashboard components on low-code platforms. Both solutions require dashboard builders to have a thorough understanding of the dashboard and the system, as well as some coding capabilities, resulting in significant R&D costs. By building a low-code component library and identifying, matching, and rendering components based on the required large-scale visualization, the workload for dashboard builders can be greatly reduced, improving development efficiency.

[0009] With the rapid development of image recognition technology, useful information can be extracted from massive amounts of data, and charts can be classified through image processing. Compared with traditional image classification algorithms such as k-nearest neighbor, support vector machine, and random forest, deep learning algorithms such as VGG, ResNet, ConvNets, and HOG have better performance. The ResNet model proposed by Kaiming He et al. makes the training depth more efficient by adding residual units to the deep neural network and solves the problems of gradient vanishing and model degradation. However, the recognition accuracy needs to be improved for chart images with hierarchical relationships and all of which need to be classified. Summary of the Invention

[0010] This invention addresses the shortcomings of existing technologies by providing a method, system, device, and medium for building data visualization dashboards based on an improved ResNet algorithm.

[0011] To achieve the above objectives, the present invention adopts the following technical solution:

[0012] A method for building a data visualization dashboard based on an improved ResNet algorithm includes the following steps:

[0013] Build a training dataset,

[0014] Train an improved ResNet18 model using the training dataset;

[0015] The two fully connected layers of the trained improved ResNet18 model are removed and used as the feature extractor.

[0016] The features of the training dataset are extracted using a feature extractor, and the extracted features are then used to train an SVM classifier.

[0017] The design image is divided into several smaller images. The features of the smaller images are extracted using a feature extractor and then input into a trained SVM classifier to classify the smaller images. Components are matched from the component library according to the category of the smaller image. The components are then rendered to the large screen based on the information of the smaller images. The attributes of the components and the large screen page are configured and adjusted according to the data, display and event requirements of the large screen to obtain a complete data visualization large screen.

[0018] To optimize the above technical solution, the specific measures also include:

[0019] Furthermore, the construction of the training dataset specifically involves:

[0020] Image data was collected from the internet and past visualization projects. Each image contains exactly one chart, and a total of C images were collected. big Class 1 category images and C smallImages are classified into two categories, and each image is labeled with the corresponding category; data augmentation is then performed on the images.

[0021] Furthermore, the structure of the improved ResNet18 model specifically includes: an input layer, an initial convolutional layer, an initial pooling layer, four residual modules, a global average pooling layer, and two fully connected layers; each residual module consists of two convolutional layers and a corresponding BN layer and ReLU activation function, and the input of the residual module is connected to the output of the second convolutional layer; the two fully connected layers are used to output the first-level class and the second-level class, respectively;

[0022] The loss function used when training the improved ResNet18 model is as follows:

[0023] L total =αL big +βL small

[0024] In the formula, L total It is the joint loss function, L big It is a first-order category loss function, L small This is a second-order category loss function, where α and β are the loss weights for the first-order and second-order categories, respectively.

[0025] The expression for the first-order category loss function is as follows:

[0026]

[0027] In the formula, C big It is the total number of categories in the first-level category, y i It is the one-hot encoding of the first-level category label of the i-th class, p i It improves the probability prediction of the i-th primary class by the ResNet18 model;

[0028] The expression for the second-order category loss function is as follows:

[0029]

[0030] In the formula, γ and η are weighting coefficients, and C small It is the total number of secondary categories. It improves the probability prediction of the second-level class of the j-th class in the ResNet18 model. It improves the ResNet18 model's prediction of the primary class corresponding to the j-th secondary class, y. j It is the one-hot encoding of the second-level category label of the j-th class;

[0031] The improved ResNet18 model predicts the probability p of the first-level class i. i The calculation formula is as follows:

[0032]

[0033] In the formula, z i It is the normalized score of the first-level category of class i, z i =wx+b i w represents the SGD training weights, b i Here, x represents the deep feature, and z is the bias. g It is the normalized score of the first-level category of class g;

[0034] The Stochastic Gradient Descent (SGD) algorithm is used to update the weights of the neural network, specifically as follows:

[0035] Momentum is updated using the following formula:

[0036]

[0037] In the formula, ν t+1 It is the momentum of the (t+1)th iteration, v t It is the momentum of the t-th iteration, w t Here, γ is the SGD training weight for the t-th iteration, η is the momentum coefficient, and η is the learning rate. It is the weight decay coefficient. The loss function with respect to weights w is... t The gradient;

[0038] During training, the loss function is repeatedly calculated, the gradient is calculated based on backpropagation, the weights are updated, and the training and updating are continued until the loss function converges, and the optimal weight parameters are saved.

[0039] Furthermore, the SVM classifier uses a nonlinear RBF kernel SVM. When training the SVM classifier, the SVM learns how to classify data based on existing features. The optimal hyperparameters gamma and C are found through cross-validation and grid search. Multiple parameter combinations are systematically tested to find the best classification effect. Gamma is used to control the influence range of a single sample, and C is a regularization parameter used to control the tolerance for misclassification. When tuning gamma and C, an initial search range is first set. After obtaining the results through preliminary grid search, the range of gamma and C values ​​is narrowed for a more detailed search.

[0040] Furthermore, the method for generating the component library is as follows:

[0041] By using the Vue framework and related dependency libraries, generate low-code basic components with various property configurations, including:

[0042] Configure basic properties, including setting component size, transparency, component coordinates, rotation angle, margins, progress bar, background, sequence number, and category basic properties;

[0043] Configure data, including setting data mapping fields to associate the mapping name and display name of the corresponding component; select the data source type of database, static data, API interface and shared data source; process the data results by writing filters and display the filtered data;

[0044] Configure component-related events, including configuring component click and loading effects, and implementing actions such as navigating to other pages in the project, network links, component showing / hiding, updating component data, and updating component state. Also, set the trigger conditions for target, condition, and delayed events.

[0045] Furthermore, the specific steps of cutting the large design drawing into several smaller drawings are as follows:

[0046] The image is preprocessed by converting it to grayscale, applying Gaussian blur, using OpenCV's Canny edge detection algorithm to extract edges, using the findContours contour extraction method to further extract the edges of the graph, and connecting objects within a set distance through dilation and erosion operations.

[0047] After cutting the image with obvious edges, the remaining part is preprocessed by binarization and morphological denoising. Then, the watershed algorithm is used to segment the region without obvious edges, and finally the design large image is divided into multiple small images.

[0048] Record the x-axis and y-axis coordinates of the top-left pixel of the cropped image in the larger image, as well as the height and width in pixels of each cropped image.

[0049] Furthermore, the step of rendering the component to the large screen based on the small image information specifically involves:

[0050] Based on the x-axis and y-axis coordinates of the top-left corner pixel of the cropped image within the larger image, as well as the height and width in pixels of each cropped image, the pixel dimensions of the input large image and the generated large screen are compared to determine the actual coordinates, height, and width in pixels of the components. The components are then rendered to their corresponding positions on the visualization large screen, generating a visualization large screen. Users can personalize the configuration of each component on the large screen according to their needs, including adjusting the size, position, and color of the components. Simultaneously, users add interactive events and bind data sources to the components, including click events and mouse hover events, to achieve dynamic display effects. Users combine configuration data, including static data, API interface data, and database data, and filter the data for display, ultimately achieving the desired display effect.

[0051] This invention also proposes a system for building a data visualization dashboard based on an improved ResNet algorithm, comprising:

[0052] The component library stores components used to build visual dashboards and generates new components iteratively based on requirements.

[0053] The image segmentation module is used to cut a large design image into several smaller images;

[0054] The image recognition module classifies small images and matches components from a component library based on the image category. The image recognition module is built based on a pre-trained improved ResNet18 model and an SVM classifier.

[0055] The visualization module is used to render components to the large screen based on information from the small images; it also configures and adjusts the attributes of components and the large screen page according to the data, display, and event requirements of the large screen to obtain a complete data visualization large screen.

[0056] The present invention also proposes an electronic device, comprising: a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, it implements the method for building a data visualization screen based on the improved ResNet algorithm as described above.

[0057] The present invention also proposes a computer-readable storage medium storing a computer program that enables a computer to execute the method described above for building a data visualization dashboard based on the improved ResNet algorithm.

[0058] The beneficial effects of this invention are:

[0059] 1. This invention designs a hierarchical classification model. By freezing most of the convolutional layers of a ResNet model, two fully connected layers are used to handle the major and minor categories respectively. The output of the preceding residual module serves as the input to the two fully connected layers. Based on prior information of the major category, the loss function for the minor category is adjusted to make the minor category prediction more consistent with the output of the major category. The weights of the loss functions for the major and minor categories are adjusted according to their impact on the overall accuracy of the model, and a joint loss function is designed. Finally, a support vector machine (SVM) with a nonlinear RBF kernel is trained and combined with the model to perform classification tasks, significantly improving the accuracy of chart classification. Compared with existing models, this invention considers the influence of the major category, resulting in higher accuracy in classifying chart images by major and minor categories.

[0060] 2. This invention provides rapidly deployable components for large-screen design by generating a low-code component library. It segments the large design image entered during large-screen project creation and applies a pre-trained chart and image classification model and classifier to categorize the smaller images, matching appropriate components. The components are then rendered onto the large screen based on the information in the smaller images. Finally, the attributes of the components and large-screen pages are configured and adjusted according to the data, display, and event requirements of the large screen, completing a complete data visualization large screen. This invention reduces the workflow of component selection, dragging, resizing, and repositioning through large image segmentation and recognition technology. It adaptively generates visualization display schemes based on different image content, ensuring the accuracy of the display effect. Furthermore, the low-code components reduce the complexity of large-screen design, avoiding repetitive configuration operations and greatly improving the work efficiency of large-screen builders. This system is applicable to various scenarios, such as enterprise data analysis and display, public safety monitoring, and intelligent manufacturing, and has broad application prospects. Attached Figure Description

[0061] Figure 1 This is a flowchart of the method for building a data visualization dashboard based on the improved ResNet algorithm proposed in this invention.

[0062] Figure 2 This describes the process of building a classification model.

[0063] Figure 3 This is a structural diagram of a system for building a data visualization dashboard based on an improved ResNet algorithm. Detailed Implementation

[0064] The technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, and not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those of ordinary skill in the art without creative effort are within the scope of protection of this application.

[0065] Example 1

[0066] This invention proposes a method for building a data visualization dashboard based on an improved ResNet algorithm. The process of this method is as follows: Figure 1 As shown, it includes the following steps:

[0067] Step S1: Construct the training dataset. The dataset in this embodiment of the invention is composed of chart images from the Internet and those used in previous visualization large screen projects. Each image contains exactly one chart. A total of 3,000 chart images were collected from 11 primary categories and 70 secondary categories, with roughly the same number of images in each category. Primary categories include bar charts, column charts, line charts, bubble charts, etc.; secondary categories are subcategories of primary categories. For example, the primary category of bar charts is further divided into secondary categories such as basic bar charts, 3D bar charts, grouped bar charts, and stacked bar charts.

[0068] Each image was labeled with its corresponding category. After obtaining the initial dataset, data augmentation was performed using methods such as image resizing, image rotation, and color jittering. The dataset was divided into a training set (70%) and a test set (30%).

[0069] Step S2: Train the improved ResNet18 model using the training dataset. The structure of the improved ResNet18 model specifically includes: an input layer, an initial convolutional layer, an initial pooling layer, four residual modules, a global average pooling layer, and two fully connected layers. Each residual module consists of two convolutional layers, a corresponding BN layer, and a ReLU activation function. The input of the residual module is connected to the output of the second convolutional layer. The two fully connected layers are used to output the first-level class and the second-level class, respectively.

[0070] The formula for convolution is:

[0071]

[0072] Where X(i,j,c) represents the value of the feature map at (i,j) and channel c, W(m,n,c,k) represents the value of the convolution kernel k at position (m,n) and channel c, and Y(i,j,k) represents the value of the output feature map at pixel position (i,j) after convolution by kernel k. C is the number of channels, H f W is the height of the convolution kernel. f is the width of the convolution kernel.

[0073] Subcategories within the same primary category all possess features related to the primary category. For example, 3D bar charts and basic bar charts within a bar chart display rectangular or variant data. Therefore, primary and secondary categories share the preceding convolutional layers.

[0074] The loss function used when training the improved ResNet18 model is as follows:

[0075] L total =αL big +βL small

[0076] In the formula, L total It is the joint loss function, Lbig It is a first-order category loss function, L small This is a second-order category loss function, where α and β are the loss weights for the first-order and second-order categories, respectively.

[0077] The expression for the first-order category loss function is as follows:

[0078]

[0079] In the formula, C big It is the total number of categories in the first-level category, y i It is the one-hot encoding of the first-level category label of the i-th class, p i It improves the probability prediction of the i-th primary class by the ResNet18 model;

[0080] Due to issues such as similar features in some second-level categories and a limited number of samples in the second-level categories, the loss function for the second-level categories can be adjusted based on prior information from the first-level categories, making the second-level category predictions more consistent with the output of the first-level categories. The expression for the second-level category loss function is as follows:

[0081]

[0082] In the formula, γ and η are weighting coefficients, and C small It is the total number of secondary categories. It improves the probability prediction of the second-level class of the j-th class in the ResNet18 model. It improves the ResNet18 model's prediction of the primary class corresponding to the j-th secondary class, y. j It is the one-hot encoding of the second-level category label of the j-th class;

[0083] The improved ResNet18 model predicts the probability p of the first-level class i. i The calculation formula is as follows:

[0084]

[0085] In the formula, z i It is the normalized score of the first-level category of class i, z i =wx+b i w represents the SGD training weights, b i Here, x represents the deep feature, and z is the bias. g It is the normalized score of the first-level category of class g;

[0086] The Stochastic Gradient Descent (SGD) algorithm is used to update the weights of the neural network, specifically as follows:

[0087] Momentum is updated using the following formula:

[0088]

[0089] In the formula, ν t+1 It is the momentum of the (t+1)th iteration, v t It is the momentum of the t-th iteration, w t Here, γ is the SGD training weight for the t-th iteration, η is the momentum coefficient, and η is the learning rate. It is the weight decay coefficient. The loss function with respect to weights w is... t The gradient;

[0090] During training, the loss function is repeatedly calculated, the gradient is calculated based on backpropagation, the weights are updated, and the training and updating are continued until the loss function converges, and the optimal weight parameters are saved.

[0091] Step S3: Remove the two fully connected layers of the trained improved ResNet18 model and use them as the feature extractor. Fully connected layers, as part of the neural network, are fixed as linear classifiers and are difficult to interpret in terms of specific classification decisions. Considering the variety of chart types (dozens of chart types), the complex distribution and overlap of features between categories; feature complexity (charts may have complex combinations and variations of features that a simple linear classifier may struggle to handle; for example, bar charts and pie charts may have similar line and area structures, but their classification requires complex judgment of details); and the difficulty of linearly separating visual features (the visual differences between different chart types, such as line direction and shape changes, may not be distinguishable by simple linear decision boundaries). Therefore, a classifier capable of handling complex nonlinear boundaries is needed. This embodiment uses a support vector machine (SVM) with a nonlinear RBF kernel combined with a pre-trained improved ResNet18 model for classification tasks. The RBF kernel can handle most nonlinear classification tasks well, calculating the relationship between data points based on feature similarity, and it can handle complex nonlinear relationships well. It is suitable for high-dimensional feature spaces.

[0092] Step S4: Extract features from the training dataset using a feature extractor, and train an SVM classifier using these extracted features. The SVM classifier uses a non-linear RBF kernel. During training, the SVM learns how to classify data based on existing features. The optimal hyperparameters gamma and C are found through cross-validation and grid search. Multiple parameter combinations are systematically tested to find the best classification performance. Gamma controls the influence range of a single sample, and C is a regularization parameter used to control the tolerance for misclassification. When tuning gamma and C, an initial search range is first set. After obtaining results through preliminary grid search, the range of gamma and C values ​​is narrowed for a more refined search. The classification model construction process is as follows... Figure 2 As shown.

[0093] 30% of the test set was randomly selected from the dataset in step S1 to test the chart classification, classifying the chart images into 70 subcategories. All methods and testing procedures were repeated three times and the average was taken. The accuracy is shown in Table 1. The average accuracy of the method proposed in this invention combined with the SVM classifier is 81.2%, which is 6.1% higher than the ResNet18 model trained by direct transfer learning, and 2.7% higher than the method using only the improved algorithm in this paper. Furthermore, the average accuracy is superior to other classification models.

[0094] Table 1

[0095]

[0096] Step S5: Cut the large design image into several smaller images; specifically: preprocess the image, convert the image to grayscale, apply Gaussian blur, use OpenCV's Canny edge detection algorithm to extract edges, use the findContours contour extraction method to further extract the edges of the image, and connect objects within a set distance through dilation and erosion operations.

[0097] After cutting the image with obvious edges, the remaining part is preprocessed by binarization and morphological denoising. Then, the watershed algorithm is used to segment the region without obvious edges, and finally the design large image is divided into multiple small images.

[0098] Record the x-axis and y-axis coordinates of the top-left pixel of the cropped image in the larger image, as well as the height and width in pixels of each cropped image.

[0099] Step S6: After extracting features from the small image using the feature extractor, input the extracted features into the trained SVM classifier to classify the small image. Match components from the component library according to the category of the small image. Render the components to the large screen based on the small image information. Configure and adjust the attributes of the components and the large screen page according to the data, display, and event requirements of the large screen to obtain a complete data visualization large screen.

[0100] The component library includes, but is not limited to, chart components (such as bar charts, line charts, pie charts, etc.), text boxes, image display boxes, video playback boxes, etc. Users can flexibly use components from the library for visual configuration when building large dashboards, greatly improving the efficiency and flexibility of large dashboard construction.

[0101] The method for generating the component library is as follows:

[0102] By using the Vue framework and related dependency libraries, generate low-code basic components with various property configurations, including:

[0103] Configure basic properties, including setting component size, transparency, component coordinates, rotation angle, margins, progress bar, background, sequence number, and category basic properties;

[0104] Configure data, including setting data mapping fields to associate the mapping name and display name of the corresponding component; select the data source type, such as database, static data, API interface, and shared data source; process the data results by writing filters and display the filtered data;

[0105] Configure component-related events, including configuring component click and loading effects, and implementing actions such as navigating to other pages in the project, network links, component showing / hiding, updating component data, and updating component state. Also, set the trigger conditions for target, condition, and delayed events.

[0106] Rendering components to the large screen based on information from the small image specifically involves:

[0107] Based on the x-axis and y-axis coordinates of the top-left corner pixel of the cropped image within the larger image, as well as the height and width in pixels of each cropped image, the pixel dimensions of the input large image and the generated large screen are compared to determine the actual coordinates, height, and width in pixels of the components. The components are then rendered to their corresponding positions on the visualization large screen, generating a visualization large screen. Users can personalize the configuration of each component on the large screen according to their needs, including adjusting the size, position, and color of the components. Simultaneously, users add interactive events and bind data sources to the components, including click events and mouse hover events, to achieve dynamic display effects. Users combine configuration data, including static data, API interface data, and database data, and filter the data for display, ultimately achieving the desired display effect.

[0108] Example 2

[0109] This invention proposes a system for building a data visualization dashboard based on an improved ResNet algorithm, corresponding to the method in Embodiment 1. Figure 3 As shown, it includes:

[0110] The component library stores components for building visual dashboards, and new components are generated iteratively based on requirements. Components in the library include, but are not limited to: chart components (such as bar charts, line charts, pie charts, etc.), text boxes, image display boxes, video playback boxes, etc. Users can flexibly use components from the library for visual configuration when building dashboards, greatly improving the efficiency and flexibility of dashboard construction.

[0111] The image segmentation module is used to cut a large design image into several smaller images;

[0112] The image recognition module classifies small images and matches components from a component library based on the image category. The image recognition module is built based on a pre-trained improved ResNet18 model and an SVM classifier.

[0113] The visualization module is used to render components to the large screen based on information from the small images; it also configures and adjusts the attributes of components and the large screen page according to the data, display, and event requirements of the large screen to obtain a complete data visualization large screen.

[0114] The implementation methods of each module and its function in the system are completely consistent with the steps of the method in Implementation Example 1, so they will not be repeated here.

[0115] Example 3

[0116] This invention proposes an electronic device, comprising: a memory, a processor, and a computer program stored in the memory and executable on the processor. When the processor executes the computer program, it implements the method for building a data visualization screen based on the improved ResNet algorithm as described in Embodiment 1.

[0117] Example 4

[0118] This invention proposes a computer-readable storage medium storing a computer program that enables a computer to execute the method for building a data visualization dashboard based on the improved ResNet algorithm as described in Embodiment 1.

[0119] In the embodiments disclosed in this application, a computer storage medium may be a tangible medium that may contain or store programs for use by or in conjunction with an instruction execution system, apparatus, or device. The computer storage medium may include, but is not limited to, electronic, magnetic, optical, electromagnetic, infrared, or semiconductor systems, apparatus, or devices, or any suitable combination of the foregoing. More specific examples of computer storage media include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fibers, portable compact disk read-only memory (CD-ROM), optical storage devices, magnetic storage devices, or any suitable combination of the foregoing.

[0120] Those skilled in the art will recognize that the units and algorithm steps of the various examples described in conjunction with the embodiments disclosed in this application can be implemented in electronic hardware or a combination of computer software and electronic hardware. Whether these functions are implemented in hardware or software depends on the specific application and design constraints of the technical solution. Those skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of this application.

[0121] The above are merely preferred embodiments of the present invention. The scope of protection of the present invention is not limited to the above embodiments. All technical solutions falling within the scope of the present invention's concept are within the scope of protection of the present invention. It should be noted that for those skilled in the art, any improvements and modifications made without departing from the principles of the present invention should be considered within the scope of protection of the present invention.

Claims

1. A method for constructing a data visualization dashboard based on an improved ResNet algorithm, characterized in that, Includes the following steps: Build a training dataset, Train an improved ResNet18 model using the training dataset; The structure of the improved ResNet18 model specifically includes: an input layer, an initial convolutional layer, an initial pooling layer, four residual modules, a global average pooling layer, and two fully connected layers; each residual module consists of two convolutional layers, a corresponding BN layer, and a ReLU activation function, and the input of the residual module is connected to the output of the second convolutional layer; the two fully connected layers are used to output the first-level class and the second-level class, respectively; The loss function used when training the improved ResNet18 model is as follows: In the formula, It is a joint loss function. It is a first-order category loss function. This is a second-order category loss function, where α and β are the loss weights for the first-order and second-order categories, respectively. The expression for the first-order category loss function is as follows: In the formula, It is the total number of categories in the first-level category. It is the one-hot encoding of the first-level category label of the i-th class. It improves the probability prediction of the i-th primary class by the ResNet18 model; The expression for the second-order category loss function is as follows: In the formula, γ and η These are weighting coefficients. It is the total number of secondary categories. It improves the probability prediction of the second-level class of the j-th class in the ResNet18 model. It improves the ResNet18 model's prediction of the primary category corresponding to the j-th secondary category. It is the one-hot encoding of the second-level category label of the j-th class; Improve the probability prediction of the first-level class i for the ResNet18 model. The calculation formula is as follows: In the formula, It is the first i Normalized score of the first-level category, , For training weights using SGD, For bias, x For deep features, It is the first g Normalized score of the first-level category; The Stochastic Gradient Descent (SGD) algorithm is used to update the weights of the neural network, specifically as follows: Momentum is updated using the following formula: In the formula, It is the first t Momentum from +1 iteration It is the first t Momentum of the next iteration It is the first t The SGD training weights for the next iteration It is the momentum coefficient. It's the learning rate. It is the weight decay coefficient. The loss function with respect to the weights exist The gradient; During training, the loss function is repeatedly calculated, the gradient is calculated based on backpropagation, the weights are updated, and the training and updating are continued until the loss function converges and the optimal weight parameters are saved. The two fully connected layers of the trained improved ResNet18 model are removed and used as the feature extractor. The features of the training dataset are extracted using a feature extractor, and the extracted features are then used to train an SVM classifier. The design image is divided into several smaller images. The features of the smaller images are extracted using a feature extractor and then input into a trained SVM classifier to classify the smaller images. Components are matched from the component library according to the category of the smaller image. The components are then rendered to the large screen based on the information of the smaller images. The attributes of the components and the large screen page are configured and adjusted according to the data, display and event requirements of the large screen to obtain a complete data visualization large screen.

2. The method for constructing a data visualization dashboard based on the improved ResNet algorithm as described in claim 1, characterized in that, The construction of the training dataset specifically involves: Image data was collected from the internet and past visualization projects. Each image contains exactly one chart. A total of [number] images were collected. Class 1 category images and Images are classified into two categories, and each image is labeled with the corresponding category; data augmentation is then performed on the images.

3. The method for constructing a data visualization dashboard based on the improved ResNet algorithm as described in claim 1, characterized in that, The SVM classifier uses a non-linear RBF kernel. During training, the SVM learns how to classify data based on existing features. The optimal hyperparameters gamma and C are found through cross-validation and grid search. Multiple parameter combinations are systematically tested to find the best classification performance. Gamma controls the influence range of a single sample, and C is a regularization parameter used to control the tolerance for misclassification. When tuning gamma and C, an initial search range is first set. After obtaining results through preliminary grid search, the range of gamma and C values ​​is narrowed for a more detailed search.

4. The method for constructing a data visualization dashboard based on the improved ResNet algorithm as described in claim 1, characterized in that, The method for generating the component library is as follows: By using the Vue framework and related dependency libraries, generate low-code basic components with various property configurations, including: Configure basic properties, including setting component size, transparency, component coordinates, rotation angle, margins, progress bar, background, sequence number, and category basic properties; Configure data, including setting data mapping fields to associate the mapping name and display name of the corresponding component; select the data source type of database, static data, API interface and shared data source; process the data results by writing filters and display the filtered data; Configure component-related events, including configuring component click and loading effects, and implementing actions such as navigating to other pages in the project, network links, component showing / hiding, updating component data, and updating component state. Also, set the trigger conditions for target, condition, and delayed events.

5. The method for constructing a data visualization dashboard based on the improved ResNet algorithm as described in claim 1, characterized in that, The specific steps of cutting the large design drawing into several smaller drawings are as follows: The image is preprocessed by converting it to grayscale, applying Gaussian blur, using OpenCV's Canny edge detection algorithm to extract edges, using the findContours contour extraction method to further extract the edges of the graph, and connecting objects within a set distance through dilation and erosion operations. After cutting the image with obvious edges, the remaining part is preprocessed by binarization and morphological denoising. Then, the watershed algorithm is used to segment the region without obvious edges, and finally the design large image is divided into multiple small images. Record the x-axis and y-axis coordinates of the top-left pixel of the cropped image in the larger image, as well as the height and width in pixels of each cropped image.

6. The method for constructing a data visualization dashboard based on the improved ResNet algorithm as described in claim 1, characterized in that, The specific steps for rendering components to the large screen based on the small image information are as follows: Based on the x-axis and y-axis coordinates of the top-left corner pixel of the cropped image within the larger image, as well as the height and width in pixels of each cropped image, the pixel dimensions of the input large image and the generated large screen are compared to determine the actual coordinates, height, and width in pixels of the components. The components are then rendered to their corresponding positions on the visualization large screen, generating a visualization large screen. Users can personalize the configuration of each component on the large screen according to their needs, including adjusting the size, position, and color of the components. Simultaneously, users add interactive events and bind data sources to the components, including click events and mouse hover events, to achieve dynamic display effects. Users combine configuration data, including static data, API interface data, and database data, and filter the data for display, ultimately achieving the desired display effect.

7. A system for building a data visualization dashboard based on an improved ResNet algorithm, implementing the method as described in claim 1, characterized in that, include: The component library stores components used to build visual dashboards and generates new components iteratively based on requirements. The image segmentation module is used to cut a large design image into several smaller images; The image recognition module categorizes small images and matches components from the component library based on the category of the small image; The image recognition module is built based on a pre-trained improved ResNet18 model and an SVM classifier; The visualization module is used to render components to the large screen based on information from the small images; it also configures and adjusts the attributes of components and the large screen page according to the data, display, and event requirements of the large screen to obtain a complete data visualization large screen.

8. An electronic device, characterized in that, include: The present invention includes a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the processor, when executing the computer program, implements the method for constructing a data visualization dashboard based on the ResNet algorithm improvement as described in any one of claims 1-6.

9. A computer-readable storage medium storing a computer program, characterized in that, The computer program causes the computer to execute the method for building a data visualization dashboard based on the ResNet algorithm improvement as described in any one of claims 1-6.

Images