Screen drawing method, storage medium and electronic equipment
By encapsulating charts into reusable components and forming a data chart library, and utilizing similarity ranking and coordinate binding technologies, the shortcomings of manual configuration in traditional large-screen displays are solved, enabling fast and flexible chart display and data matching.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-12-04
- Publication Date
- 2026-04-14
AI Technical Summary
Traditional large-screen displays require manual configuration of charts and data sources, which makes it difficult to cope with rapidly changing user needs, lacks flexibility, and leads to repetitive development work and difficulties in automatically obtaining the required data.
Charts are encapsulated into reusable components to form a data chart library. By accessing data sources and processing datasets, and using similarity sorting and coordinate binding technologies, charts can be automatically matched to user needs.
It enables rapid location and accurate display based on user needs, reduces repetitive work, and improves the flexibility of large-screen displays and the ability to automatically acquire data.
Smart Images

Figure CN121858660A_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of chart display technology, specifically to a screen drawing method, storage medium, and electronic device. Background Technology
[0002] Traditional large-screen displays typically require manual configuration of charts and data sources. Each time data is updated, the data charts need to be manually readjusted and the large-screen content needs to be updated and redeployed according to the requirements.
[0003] Different users have different needs for the statistical dimensions and data display of the content on the large screen. In traditional screen drawing methods, it is usually necessary to manually filter the data and bind the charts according to the different needs of different users or departments to meet their respective needs and display priorities. Therefore, there will be repetitive development work, lack of flexibility, and difficulty in responding to rapidly changing needs.
[0004] Therefore, there is an urgent need for a screen drawing method, storage medium, and electronic device to solve the problem that traditional screen drawing methods are not convenient for automatically acquiring the required data and matching the required charts. Summary of the Invention
[0005] This invention addresses the shortcomings of existing technologies by providing a screen drawing method, storage medium, and electronic device to solve the problem that traditional screen drawing methods are not convenient for automatically acquiring the required data and matching the required charts.
[0006] To achieve the above objectives, the present invention adopts the following technical solution: A screen drawing method, characterized by comprising the following steps: Different charts are encapsulated into reusable chart components to form a data chart library; the data source is accessed and processed to obtain a dataset composed of various field information; chart components are selected from the data chart library, and the field information in the dataset is sorted according to the similarity based on the pre-input key field information; based on the number of fillable coordinates of the selected chart component, field information with the same number of items is selected from the sorted dataset, and then bound to the coordinates of the selected chart component; finally, the dataset is presented on the large screen in the form of the selected chart.
[0007] To optimize the above technical solution, the specific measures also include: Furthermore, the process of encapsulating different charts into reusable chart components and forming a data chart library includes the following steps: Define a base chart class containing common chart properties and methods. The common properties include appearance configuration and coordinate configuration. The base chart class provides an interface for coordinate configuration, allowing changes to the chart's coordinate information, and also provides an interface for appearance configuration, allowing changes to the chart's size and color. For each specific chart type, inherit from the base chart class, and combine multiple specific chart types to form a data chart library.
[0008] Furthermore, the access to the data source involves processing the data from the data source to obtain a dataset composed of various field information, including the following steps: Access the data source to obtain raw data. After cleaning and transforming the raw data using data processing functions, extract all field names and record them as the field name dataset, field name dataset = [field name 1, field name 2, ..., field name N], where N is the total number of field names, and output it.
[0009] Furthermore, it also includes the following steps: Convert the pre-input key field information into a key field dataset, key field dataset = [key field 1, key field 2, ..., key field L], where L is the number of key fields.
[0010] Furthermore, it also includes the following steps: For each field name in the field name dataset, calculate its similarity score with all key fields in the key field dataset, and calculate the average to obtain the total relevance score of the field name. Sort all field names in descending order according to the total relevance score to obtain the sorted field dataset.
[0011] Further, the step of calculating the similarity score between the field name and all key fields in the key field dataset, and averaging the scores to obtain the total relevance score of the field name, includes the following steps: Calculate the similarity score between the i-th key field and the field name using the edit distance similarity formula: Similarity score(key_field_i, field_name) = 1 - (edit distance(key_field_i, field_name) / max(length(key_field_i), length(field_name))). Wherein, edit distance(key_field_i, field_name) represents the minimum number of single-character edit operations required to convert the i-th key field into the field name, length(key_field_i) represents the number of characters in the i-th key field string, and length(field_name) represents the number of characters in the field name string; For each field name, calculate the average of its similarity scores with all key fields: Total relevance score (field name) = (Σ_{i=1}^{L} similarity score (key field_i, field name)) / L, Where L represents the number of key fields, and Σ represents the sum of similarity scores (key field_i, field name) for i from 1 to L.
[0012] Furthermore, the fields with the same number of items are selected from the self-sorted dataset and then bound to the coordinates of the selected chart component, including the following steps: Select a chart component from the data chart library. The number of fillable coordinates for this chart component is denoted as M. Select the first M field information from the sorted field dataset and bind them to the coordinates of the chart component in sequence.
[0013] Furthermore, a computer-readable storage medium storing a computer program is characterized in that the computer program causes a computer to execute a screen drawing method as described above.
[0014] Furthermore, an electronic device is characterized by comprising: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the computer program, it implements a screen drawing method as described above.
[0015] The beneficial effects of this invention are: This invention encapsulates different charts into reusable chart components, forming a data chart library. This facilitates the on-demand retrieval of different chart components. Simultaneously, it determines the key information to be displayed based on pre-inputted key field information. Field information in the dataset is sorted according to its similarity to the key field information, and a number of fields are selected equal to the number of fillable coordinates in the selected chart component. This allows for precise location of the user's desired key information content within the dataset. By binding these fields one by one with the coordinates of the selected chart component, it achieves rapid positioning of different display needs and accurate display of the required chart style. This invention solves the problem that traditional screen drawing methods are inconvenient for automatically acquiring the required data and matching the required charts. Attached Figure Description
[0016] Figure 1 This is a flowchart illustrating a screen drawing method proposed in this invention. Detailed Implementation
[0017] 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.
[0018] As attached Figure 1 As shown, a screen drawing method according to an embodiment of the present invention includes the following steps: Different charts are encapsulated into reusable chart components to form a data chart library; the data source is accessed and processed to obtain a dataset composed of various field information; chart components are selected from the data chart library, and the field information in the dataset is sorted according to the similarity based on the pre-input key field information. Based on the number of fillable coordinates of the selected chart component, field information with the same number of items is selected from the sorted dataset, and then bound to the coordinates of the selected chart component. Finally, the dataset is presented on the large screen in the form of the selected chart.
[0019] This invention encapsulates different charts into reusable chart components, forming a data chart library. This facilitates the on-demand retrieval of different chart components. Simultaneously, it determines the key information to be displayed based on pre-inputted key field information. Field information in the dataset is sorted according to its similarity to the key field information, and a number of fields are selected equal to the number of fillable coordinates in the selected chart component. This allows for precise location of the user's desired key information content within the dataset. By binding these fields one by one with the coordinates of the selected chart component, it achieves rapid positioning of different display needs and accurate display of the required chart style. This invention solves the problem that traditional screen drawing methods are inconvenient for automatically acquiring the required data and matching the required charts.
[0020] The process of encapsulating different charts into reusable chart components and forming a data chart library includes the following steps: Define a base chart class containing common chart properties and methods. The common properties include appearance configuration and coordinate configuration. The base chart class provides an interface for coordinate configuration, allowing changes to the chart's coordinate information, and also provides an interface for appearance configuration, allowing changes to the chart's size and color. For each specific chart type, inherit from the base chart class, and combine multiple specific chart types to form a data chart library.
[0021] The aforementioned access to the data source involves processing the data from the data source to obtain a dataset composed of various field information, including the following steps: Access the data source to obtain raw data. After cleaning and transforming the raw data using data processing functions, extract all field names and record them as the field name dataset, field name dataset = [field name 1, field name 2, ..., field name N], where N is the total number of field names, and output it.
[0022] Specifically, it also includes the following steps: Convert the pre-input key field information into a key field dataset, key field dataset = [key field 1, key field 2, ..., key field L], where L is the number of key fields.
[0023] For each field name in the field name dataset, calculate its similarity score with all key fields in the key field dataset, and calculate the average to obtain the total relevance score of the field name. Sort all field names in descending order according to the total relevance score to obtain the sorted field dataset.
[0024] The process of calculating the similarity score between the field name and all key fields in the key field dataset, and then averaging the scores to obtain the overall relevance score for that field name, includes the following steps: Calculate the similarity score between the i-th key field and the field name using the edit distance similarity formula: Similarity score(key_field_i, field_name) = 1 - (edit distance(key_field_i, field_name) / max(length(key_field_i), length(field_name))). Here, edit distance(key_field_i, field_name) represents the minimum number of single-character edit operations required to convert the i-th key field into the field name, length(key_field_i) represents the number of characters in the i-th key field string, length(field_name) represents the number of characters in the field name string, and similarity score ranges from 0 to 1, with higher values indicating greater relevance; For each field name, calculate the average of its similarity scores with all key fields: Total relevance score (field name) = (Σ_{i=1}^{L} similarity score (key field_i, field name)) / L, Where L represents the number of key fields, and Σ represents the sum of similarity scores (key field_i, field name) for i from 1 to L.
[0025] Specifically, it also includes the following steps: Select a chart component from the data chart library. The number of fillable coordinates for this chart component is denoted as M. Select the first M field information from the sorted field dataset and bind them to the coordinates of the chart component in sequence.
[0026] In the above scheme, the charts in the data chart library include various chart types such as line charts, bar charts, pie charts, scatter plots, heat maps, and maps.
[0027] In this solution, the size, position, background color, and other settings of the charts can also be adjusted as needed through appearance configuration.
[0028] Based on the above solution, intelligent interpretation and voice broadcast functions can also be provided: Access the large screen via a link. The large screen page has a voice broadcast icon. Clicking the button triggers the explanation robot, which explains the content of each module chart on the large screen in turn, including the name of the chart coordinates and the corresponding chart data, etc.
[0029] Intelligent interpretation of large-screen content relies on AI large-model analysis capabilities. It acquires all data from the large-screen content, including the types of chart components, the meaning of each coordinate or header, and corresponding specific data information. Noise filtering is performed on the large-screen data, and invalid data is cleaned using the Z-Score anomaly detection algorithm. Semantic interpretation of the processed data begins with key indicator extraction. Based on the TF-IDF weighted algorithm, core indicators are extracted, identifying the data with the highest weight for subsequent trend prediction and focus on key content. KeyScore(t)=TF(t)×log(N / DF(t)) TF(t): The frequency of a term in a document, reflecting the importance of the term in the document.
[0030] DF(t): The number of documents containing term t, used to measure the prevalence of the term. N: The total number of documents, used for standardization calculations.
[0031] log(N / DF(t)): Inverse document frequency, penalizing high-frequency common words and highlighting highly distinctive words.
[0032] Example of algorithm usage: In the "Number of shutdowns in the past week" chart, "5 units on Wednesday" is highlighted as high-weight data.
[0033] After generating the content for the large screen, the processed text information is converted into natural and fluent speech output through a speech synthesis engine, combined with voice playback technology. During the speech output process, the speech content is synchronized with the large screen module.
[0034] For example, the line chart of the number of cloud servers shut down in the past week shows the number of cloud servers shut down each day in the past week: 10 servers shut down on April 14, 15 servers shut down on April 15, 5 servers shut down on April 16, 7 servers shut down on April 17, 8 servers shut down on April 18, 2 servers shut down on April 19, and 4 servers shut down on April 20. Pay special attention to the operation status of cloud servers on April 15.
[0035] Furthermore, intelligent replacement through human-computer interaction can also be performed: On the large screen page, click the AI robot button to bring up the AI dialog box. Enter your question in the question input box or click the record button to voice input your question. After you finish entering your question, click send.
[0036] The AI dialog box displays the generated SQL, query results, and a preview of the data charts based on the question. After user confirmation, the generated data charts can be replaced in the original charts on the large screen via voice interaction, and the large screen content is automatically saved after the replacement. During the replacement process, a proportion-preserving algorithm is used. The width / height and aspectRatio of the original module are read during replacement, forcing the new chart to inherit the original size proportions to avoid layout misalignment. Finally, the positions of adjacent modules are automatically adjusted based on the remaining space on the canvas.
[0037] In another embodiment, the present invention provides a computer-readable storage medium storing a computer program that causes a computer to perform a screen drawing method as described above.
[0038] In another embodiment, the present invention provides an electronic device comprising: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the computer program, it implements a screen drawing method as described above.
[0039] 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.
[0040] 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.
[0041] 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 screen drawing method, characterized in that, Includes the following steps: Different charts are encapsulated into reusable chart components, forming a data chart library; Connect to the data source, process the data from the data source, and obtain a dataset composed of various field information; Select chart components from the data chart library, sort the field information in the dataset according to the pre-input key field information, and select the same number of field information from the sorted dataset according to the number of fillable coordinates of the selected chart component, and then bind them to the coordinates of the selected chart component. Finally, the dataset is presented on the large screen as a selected chart.
2. The screen drawing method according to claim 1, characterized in that, The process of encapsulating different charts into reusable chart components and forming a data chart library includes the following steps: Define a base chart class containing common chart properties and methods. The common properties include appearance configuration and coordinate configuration. The base chart class provides an interface for coordinate configuration, allowing changes to the chart's coordinate information, and also provides an interface for appearance configuration, allowing changes to the chart's size and color. For each specific chart type, inherit from the base chart class, and combine multiple specific chart types to form a data chart library.
3. The screen drawing method according to claim 1, characterized in that, The process of accessing the data source involves processing the data to obtain a dataset composed of various field information, including the following steps: Access the data source to obtain raw data. After cleaning and transforming the raw data using data processing functions, extract all field names and record them as the field name dataset, where field name dataset = [field name 1, field name 2, ..., field name N], and N is the total number of field names. Output the dataset.
4. The screen drawing method according to claim 3, characterized in that, It also includes the following steps: Convert the pre-input key field information into a key field dataset, key field dataset = [key field 1, key field 2, ..., key field L], where L is the number of key fields.
5. The screen drawing method according to claim 4, characterized in that, It also includes the following steps: For each field name in the field name dataset, calculate its similarity score with all key fields in the key field dataset, and calculate the average to obtain the total relevance score of the field name. Sort all field names in descending order according to the total relevance score to obtain the sorted field dataset.
6. The screen drawing method according to claim 5, characterized in that, The process of calculating the similarity score between the field name and all key fields in the key field dataset, and then averaging the scores to obtain the overall relevance score of the field name, includes the following steps: Calculate the similarity score between the i-th key field and the field name using the edit distance similarity formula: Similarity score(key_field_i, field_name) = 1 - (edit distance(key_field_i, field_name) / max(length(key_field_i), length(field_name))). Wherein, edit distance(key_field_i, field_name) represents the minimum number of single-character edit operations required to convert the i-th key field into the field name, length(key_field_i) represents the number of characters in the i-th key field string, and length(field_name) represents the number of characters in the field name string; For each field name, calculate the average of its similarity scores with all key fields: Total relevance score (field name) = (Σ_{i=1}^{L} similarity score (key field_i, field name)) / L, Where L represents the number of key fields, and Σ represents the sum of similarity scores (key field_i, field name) for i from 1 to L.
7. The screen drawing method according to claim 5, characterized in that, The data set after self-sorting selects fields with the same number of items, and then binds them to the coordinates of the selected chart component, including the following steps: Select a chart component from the data chart library. The number of fillable coordinates for this chart component is denoted as M. Select the first M fields from the sorted field dataset and bind them to the coordinates of the chart component in sequence.
8. A computer-readable storage medium storing a computer program, characterized in that, The computer program causes the computer to perform a screen drawing method as described in any one of claims 1-7.
9. An electronic device, characterized in that, include: 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 a screen drawing method as described in any one of claims 1-7.