Data display methods, apparatus, electronic devices and readable storage media
By detecting collisions in the view window within the MVVM framework, determining the second position node, and updating its position information, the page lag issue caused by translating large amounts of similar data is resolved, resulting in more efficient data rendering processing.
Patent Information
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- CHINA TELECOM CORP LTD
- Filing Date
- 2022-09-14
- Publication Date
- 2026-08-04
AI Technical Summary
In the MVVM framework, page lag can easily occur when translating large amounts of similar data.
By detecting collisions in the view window, the second position node is determined, and the position information is updated based on this node. Partially compiled functional data is used to display the data, avoiding the direct compilation of all excessive data.
It simplifies the rendering process of large amounts of data, avoids page lag, and improves the efficiency of data rendering.
Smart Images

Figure CN115562631B_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of data processing, and more particularly to a data display method, apparatus, electronic device, and readable storage medium. Background Technology
[0002] In a split-architecture development scenario, the front end often uses the data-driven view MVVM (Model-View-ViewModel) development framework, which may result in a large amount of similar data. If translation operations are performed rashly without restrictions, page lag may inevitably occur.
[0003] Currently, common approaches include lazy loading or using virtual tables in conjunction with scroll listeners. However, both lazy loading and virtual table implementations inevitably lead to performance waste, increased workload, and frequent invalid events. Summary of the Invention
[0004] This invention provides a data display method, apparatus, electronic device, and readable storage medium to solve the problem of page lag that occurs when translating large amounts of similar data under the MVVM framework in the prior art.
[0005] To solve the above-mentioned technical problems, the present invention is implemented as follows:
[0006] In a first aspect, embodiments of the present invention provide a data display method, the method comprising: detecting a collision operation acting on a view window, wherein first data displayed in the view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is a first position node; determining a second position node based on the collision operation and the first position node; updating the position information based on the second position node; and compiling the functional data to obtain second data, so as to display the second data in the view window.
[0007] Furthermore, the attribute fields of the functional data include the location information and the current display segment data. Before the collision detection operation applied to the view window, the method further includes: hijacking the excessive data and issuing a warning; performing feature processing and type translation on the excessive data to obtain the functional data; determining the initial position node corresponding to the functional data based on viewport parameters, and determining the location information as the initial position node; segmenting the functional data according to the initial position node to obtain initial display data, and determining the current display segment data as the initial display data; and performing template compilation on the functional data according to a preset template of the view window to obtain third data, so that the third data is displayed in the view window.
[0008] Furthermore, the hijacking and warning of the excessive data includes: monitoring the input data; if the number of data in the input data is greater than a preset threshold, then determining that the input data is the excessive data; and transmitting the excessive data to the data processing module.
[0009] Furthermore, the initial position node includes a first initial coordinate and a second initial coordinate, wherein the step of segmenting the functional data according to the initial position node to obtain initial display data includes: determining the first initial coordinate and the second initial coordinate based on the height of the view window, the height of the list item, and the buffer height; and segmenting the functional data according to the first initial coordinate and the second initial coordinate to obtain the initial display data.
[0010] Furthermore, the attribute field also includes a collision detection function, wherein the detection of collision operations applied to the view window includes: after the functional data is template-compiled according to a preset template of the view window to obtain third data, and after the third data is displayed in the view window, the collision detection function is started to perform collision detection on the user operation applied to the view window; if the boundary of the view window overlaps with the first position node, the user operation is determined to be a collision operation.
[0011] Further, determining the second position node based on the collision operation and the first position node includes: determining the movement direction of the view window based on the collision operation; and determining the second position node based on the movement direction, a preset distance, and the first position node.
[0012] Furthermore, the second location node includes a first coordinate and a second coordinate, wherein updating the location information according to the second location node includes: updating the location information according to the first coordinate and the second coordinate; after updating the location information according to the first coordinate and the second coordinate, it further includes: segmenting the functional data according to the first coordinate and the second coordinate to update the currently displayed segmented data.
[0013] Secondly, embodiments of the present invention further provide a data display device, the device comprising: a detection module, configured to detect collision operations acting on a view window at preset time intervals; a first processing module, configured to update a first position node in the view layer according to the collision operation to obtain a second position node; a second processing module, configured to segment functional data according to the second position node to obtain display data, wherein the functional data is derived from excess data; and a display module, configured to send the display data to the node information of the view layer to display the display data in the view window.
[0014] Thirdly, embodiments of the present invention also provide an electronic device, including: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program, when executed by the processor, implements the steps of the data display method as described in the first aspect above.
[0015] Fourthly, embodiments of the present invention further provide a storage medium on which a computer program is stored, and when the computer program is executed by a processor, it implements the steps of the data display method described in the first aspect above.
[0016] In this embodiment of the invention, a collision operation is detected acting on the view window. The first data displayed in the view window is compiled from functional data, which is then translated from excess data. The position information in the attribute field of the functional data is a first position node. A second position node is determined based on the collision operation and the first position node. The position information is updated based on the second position node. The functional data is then compiled to obtain the second data, which is then displayed in the view window. By partially compiling and displaying the excess data based on the first position node, and by re-determining the display portion of the excess data according to the collision operation, the rendering process of the excess data is simplified, avoiding the stuttering caused by directly compiling all the excess data, and improving the data rendering efficiency. This solves the problem of page stuttering that occurs when translating large amounts of similar data under the MVVM framework in the prior art.
[0017] The above description is merely an overview of the technical solution of the present invention. In order to better understand the technical means of the present invention and to implement it in accordance with the contents of the specification, and in order to make the above and other objects, features and advantages of the present invention more apparent and understandable, specific embodiments of the present invention are described below. Attached Figure Description
[0018] To more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings used in the description of the embodiments of the present invention will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For those skilled in the art, other drawings can be obtained based on these drawings without creative effort.
[0019] Figure 1 This is a schematic diagram illustrating an application scenario of a data display method according to an embodiment of the present invention;
[0020] Figure 2 This is a flowchart illustrating a data display method according to an embodiment of the present invention;
[0021] Figure 3 This is a flowchart illustrating an initial display method for excessive data in an embodiment of the present invention;
[0022] Figure 4A This is a schematic diagram of a view window rendering in an embodiment of the present invention;
[0023] Figure 4B This is a schematic diagram of a view window in an embodiment of the present invention;
[0024] Figure 5 This is a flowchart illustrating another data display method in an embodiment of the present invention;
[0025] Figure 6 This is a schematic diagram of the structure of a data display device according to an embodiment of the present invention. Detailed Implementation
[0026] The technical solutions of the embodiments of the present invention will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of the present invention. Based on the embodiments of the present invention, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of the present invention.
[0027] Example 1
[0028] Before introducing a data display method in an embodiment of the present invention, the application scenarios of the data display method will be introduced first.
[0029] like Figure 1The diagram illustrates an application scenario of a data display method according to an embodiment of the present invention. The front-end device 10 and the back-end server 20 can interact with each other. The front-end device 10 includes a display screen 100, on which a view window 110 can be displayed. The view window 110 can display corresponding text, images, videos, and other data. The device system of the front-end device is a system developed using the MVVM framework.
[0030] In the existing technology, if the front-end device 10 receives a large amount of the same type of excessive data and directly translates and displays it in the view window 110, it will cause the front-end device 10 to lag, resulting in a poor user experience.
[0031] To address the aforementioned issues, in this embodiment, within the device system of the front-end device 10, a collision operation is detected acting on the view window 110. The first data displayed in the view window 110 is compiled from functional data, which is then translated from excess data. The position information in the attribute field of the functional data is a first position node. Based on the collision operation and the first position node, a second position node is determined. The position information is updated based on the second position node. The functional data is then compiled to obtain the second data, which is then displayed in the view window 110. In this application scenario, by partially compiling and displaying the excess data based on the first position node, and by re-determining the display portion of the excess data according to the collision operation, the rendering process of the excess data is simplified. This avoids the stuttering caused by directly compiling all the excess data, thus improving the data rendering efficiency.
[0032] According to embodiments of the present invention, a data display method is provided, such as... Figure 2 As shown, the method may specifically include the following steps:
[0033] S202, detect collision operation applied to view window, wherein the first data displayed in view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is the first position node;
[0034] S204, determine the second position node based on the collision operation and the first position node;
[0035] S206, Update the location information according to the second location node;
[0036] S208, the functional data is compiled to obtain second data, so that the second data is displayed in the view window.
[0037] The technical solution in this embodiment is mainly applied to device systems using a data-driven view MVVM development framework. In this framework, excessive data refers to similar data exceeding a certain threshold. Directly translating this excessive data can cause page lag.
[0038] In this embodiment, a portion of the excess data is displayed in the view window. In this embodiment, the functional data is derived from the excess data. The functional data can be compiled and rendered into view content and displayed in the view window. The attribute fields of the functional data include the original data and position information. The original data is the unprocessed excess data. The position information is a cutting range parameter used to control the display range of the functional data, based on the size of the view window.
[0039] For example, in a display page with only up and down swiping, the location information includes two coordinate points: up and down; in a display page with up, down, left and right swiping, the location information includes four coordinate points: up, down, left and right.
[0040] First, the view window is checked at preset time intervals to detect user actions performed on it. These actions include, but are not limited to, browsing operations performed by the user through input devices, such as keyboard or mouse input, virtual key swipes, or touchscreen input. If the user's action involves viewing data other than the first set of data within the excess data (which is unrendered excess data), this is considered a collision operation. A collision operation occurs when the boundary of the viewed view window overlaps with the first position node.
[0041] Then, if the boundary of the current view window overlaps with the first position node during the collision operation, the first data currently displayed in the view window needs to be updated. Therefore, the position information in the attribute fields of the functional data can be updated based on the parameters of the collision operation. For example, the position information can be updated based on the scrolling direction of the collision operation on the page. For instance, if the first position node in the position information includes (X1, X2), and the scrolling direction is a downward scrolling distance of 5, then the second position node can be determined as (X1-5, X2-5). If the scrolling direction is an upward scrolling distance of 2, then the second position node can be determined as (X1+2, X2+2), and the position information is updated to the second position node.
[0042] Finally, the updated functional data is compiled according to the preset template corresponding to the view window to obtain the second data, so as to complete the rendering of the visualization data of the functional data at the current position and display the second data in the view window.
[0043] It should be noted that, in this embodiment, collision operations applied to the view window are detected. The first data displayed in the view window is compiled from functional data, which is then translated from excess data. The position information in the attribute fields of the functional data is the first position node. Based on the collision operation and the first position node, a second position node is determined. The position information is updated based on the second position node. The functional data is then compiled to obtain the second data, which is then displayed in the view window. By partially compiling and displaying the excess data based on the first position node, and by re-determining the display portion of the excess data based on the collision operation, the rendering process of the excess data is simplified, avoiding the stuttering caused by directly compiling all the excess data, and improving the data rendering efficiency. This solves the problem of page stuttering that occurs when translating large amounts of similar data under the MVVM framework in existing technologies.
[0044] Optionally, in this embodiment, the attribute field further includes currently displayed segment data. Before detecting a collision operation acting on the view window, the method further includes, but is not limited to: hijacking excess data and issuing a warning; performing feature processing and type translation on the excess data to obtain functional data; determining the initial position node corresponding to the functional data according to the viewport parameters, and determining the position information as the initial position node; and cutting the functional data according to the initial position node to obtain initial display data, and determining the currently displayed segment data as the initial display data; and performing template compilation on the functional data according to the preset template of the view window to obtain third data, so as to display the third data in the view window.
[0045] In the actual scenario of this embodiment, after receiving excessive data, the currently displayed segment data corresponding to the excessive data is first obtained. This currently displayed segment data is used to initially display the third data of the excessive data in the view window. For example... Figure 3 As shown, the initial display method for excess data may specifically include the following steps:
[0046] S31, hijacks excessive data and issues an early warning;
[0047] Optionally, in this embodiment, the excessive data is hijacked and an early warning is issued, including but not limited to: monitoring the input data; if the amount of input data exceeds a preset threshold, the input data is determined to be excessive data; and the excessive data is transmitted to the data processing module.
[0048] Specifically, such as Figure 4AThe view window rendering diagram shown illustrates how, when defining the initial recorded data, the listening method and content of the observer module within the MVVM development framework are rewritten, and a preset quantity threshold is added. When the change in recorded data exceeds the preset quantity threshold, an alert is issued, and the excess data is transmitted to the data processing module of the MVVM development framework.
[0049] S32, perform feature processing and type translation on the excessive data to obtain functional data;
[0050] Specifically, the received excess data is translated into the form of a defineProperties prototype chain in the MVVM development framework. Collision detection functions, view operation functions, position information, etc., which will be needed later, are then attached to the translated functional data. Collision detection functions and view operation functions are then attached to the functional data to implement the collision detection function and the corresponding business functions for the view operation. In this way, functional transfer and integration are completed while preserving the original data information.
[0051] S33, determine the initial position node corresponding to the functional data according to the viewport parameters, and determine the position information as the initial position node; and, cut the functional data according to the initial position node to obtain the initial display data, and determine the current display segment data as the initial display data;
[0052] Optionally, in this embodiment, the initial position node includes a first initial coordinate and a second initial coordinate. The functional data is segmented according to the initial position node to obtain initial display data, and the current display segment data is determined as the initial display data. This includes, but is not limited to: determining the first initial coordinate and the second initial coordinate based on the height of the view window, the height of the list item, and the height of the buffer; and segmenting the functional data according to the first initial coordinate and the second initial coordinate to obtain the initial display data.
[0053] Specifically, assuming that the view window only supports vertical browsing, an initial position node is generated based on the current view window height parameter, the single item height of the list of data displayed in the view window, and the buffer information used for buffering. The initial position node includes a first initial coordinate X1 and a second initial coordinate X2, and the initial position node is determined to be the position information corresponding to the functional data and stored on the prototype chain of the functional data.
[0054] like Figure 4BThe diagram shows a view window, which includes a display area and a buffer area. The first initial coordinate X1 in the initial position node is collision detection point 1, and the second initial coordinate X2 is collision detection point 2. The initial display data in the display area and the buffer area is the third data obtained by cutting based on the initial position node (X1, X2).
[0055] The view window height parameter determines the size range of the view window's display page, the list information single item height determines the area occupied by each data item, and the buffer information includes, but is not limited to, the buffer height. The data in the buffer is used to avoid waiting issues caused by slow data loading.
[0056] Up to the current step S33, the feedback value of the function data has changed due to the appearance of the location information. That is, the function data has been truncated through the initial location node to obtain the initial display data.
[0057] S34, perform template compilation on the functional data according to the preset template of the view window to obtain the third data, so as to display the third data in the view window.
[0058] Each time the observer performs data hijacking, a corresponding data block dep is created. Data hijacking only occurs in two situations: the initial display of excessive data and the modification of the display of excessive data based on collision operations. Through the processing of the observer module on the initial data, the data received by the data block dep will be transformed from the original data into functional data calculated through location information. The triggering of the function dep.notify() in the MVVM development framework will notify the update of the watcher in the MVVM development framework to realize the view update, thereby completing a series of template translation processes from functional data to third-party data.
[0059] In summary, the system intercepts and issues warnings for excessive data; it processes and translates the excessive data into functional data; it determines the initial position node corresponding to the functional data based on viewport parameters, and uses this position information as the initial position node; it then segments the functional data based on the initial position node to obtain initial display data, and determines the currently displayed segment as the initial display data; finally, it performs template compilation on the functional data according to the view window's preset template to obtain third data, which is then displayed in the view window. This allows a portion of the excessive data to be displayed in the view window, avoiding the need to translate all of the excessive data during the initial display and preventing page lag issues.
[0060] Optionally, in this embodiment, the attribute field further includes a collision detection function, wherein detecting collision operations applied to the view window includes, but is not limited to: after compiling the functional data according to the preset template of the view window to obtain third data, and after displaying the third data in the view window, starting the collision detection function to perform collision detection on the user operation applied to the view window; if the boundary of the view window overlaps with the first position node, then the user operation is determined to be a collision operation.
[0061] Specifically, in this embodiment, traditional performance optimization methods generally use virtual table scrolling listeners, which achieve the function but also inevitably incur performance overhead.
[0062] In this embodiment, the Resize Observer is used to adjust and observe the boundary node properties by instantiating an object. That is, before a new round of data hijacking is triggered, the first position node X1 and X2 in the view layer are monitored through the ResizeObserver API. When the contentRect property of the position node overlaps with the boundary of the view window, the collision condition is met, and the user operation is determined to be a collision operation.
[0063] Optionally, in this embodiment, determining the second position node based on the collision operation and the first position node includes, but is not limited to: determining the movement direction of the view window based on the collision operation; and determining the second position node based on the movement direction, a preset distance, and the first position node.
[0064] Specifically, for boundary nodes that meet the collision conditions, after collision detection, the movement direction of the view window in the view window is determined according to the collision operation; the movement direction includes, but is not limited to, the scrolling or sliding direction of the view. Then, the first position node is updated according to the movement direction and a preset distance to obtain the second position node. The preset distance can be set according to practical experience, and is not limited in this embodiment.
[0065] Optionally, in this embodiment, the second location node includes a first coordinate and a second coordinate. Updating the location information based on the second location node includes: updating the location information based on the first coordinate and the second coordinate; after updating the location information based on the first coordinate and the second coordinate, the method further includes: segmenting the functional data based on the first coordinate and the second coordinate to update the currently displayed segmented data.
[0066] Finally, after collision detection, the position information is adjusted using offsets, triggering the compilation of the `dep.notify()` template. Because the raw data and functional data are isolated, the data block `dep` only receives the callback value of the functional data, i.e., the currently displayed segmented data. For example, if the first position node includes (X1, X2) and the scrolling direction is a downward scroll distance of 5, then the second position node can be determined as (X1-5, X2-5), and the position information is updated based on the second position node. The functional data is then segmented based on the first coordinate X1-5 and the second coordinate X2-5 within the second position node to update the currently displayed segmented data.
[0067] As a specific embodiment, this embodiment uses personnel information as an example for illustration, such as... Figure 5 As shown, the data display method in this embodiment may specifically include the following steps:
[0068] S51, Receive personnel information;
[0069] Specifically, during the interaction between the front-end and back-end, if a certain output message contains 100,000 pieces of personnel information and no additional processing is done on the personnel information, the 100,000 pieces of personnel information are directly stored in the local record.
[0070] S52, hijacks excessive data and issues an alert;
[0071] Specifically, when a local record is assigned a value, it triggers data hijacking in observe. In this step, excess personnel information will no longer directly notify the dep module of data changes, but will instead trigger an alert message internally and enter the data processing module.
[0072] S53 processes and translates the excess data to obtain functional data;
[0073] Specifically, the received personnel information is translated into featuresData using the defineProperties prototype chain. The original information is attached to the featuresData properties in the form of V1. The processed attribute fields also include the position nodes for displaying the segmented data, the current display segment data V2 for template compilation, the function for performing collision detection, and the handling methods after collision, etc.
[0074] S54, obtain the initial position node;
[0075] Specifically, after obtaining the initial functional data, it is necessary to retrieve the value of the internal position information property. The value of the position property mainly depends on the current viewport height parameter. The initial position nodes X1 and X2 are generated based on the view window height parameter, the estimated list item height, and the buffer offset height.
[0076] S55, template compilation of functional data based on initial position nodes;
[0077] Specifically, the processed functional data is obtained. The callback value V2 of the functional data is mainly determined by the position from X1 to X2 of the original data V1. Now the functional data is passed to the dep module. The functional data is converted into a view node through template compilation using the dep.notify method. Since the callback value V2 of the functional data has been processed by the position node, there will be no more stuttering during the translation of the view layer node.
[0078] S56, perform collision detection on the view window;
[0079] Specifically, if the collision detection conditions are met, S57 is executed; otherwise, S56 is executed repeatedly.
[0080] Specifically, once the functional data is processed and displayed on the page, the collision detection function is activated. The essence of the collision detection function is to listen to the attribute information of boundary nodes in the view. It detects the information of a specified person by passing the position attribute to the initialization object `new ResizeObserver`. When the specified person reaches the boundary state due to user interaction, the collision condition is met, and the current user interaction is considered a collision operation.
[0081] S57, Get the updated location node;
[0082] Specifically, once the designated personnel information reaches the viewport boundary, the position node in the function data needs to be adjusted, and the movement direction of the position is determined according to the movement direction of the viewport. The callback value V2 of the function data will also change due to get(position_X1, position_X2).
[0083] Because the original data and the functional data are isolated, dep only receives the V2 callback value of the functional data. After collision detection, the position information is adjusted by offset. The pseudo-data hijacking will drive the compilation function compile to perform a new round of template compilation based on the updated position node and the callback value V2.
[0084] S58, compile the template based on the updated position nodes.
[0085] Specifically, the implementation of template compilation will drive the update of the view layer, allowing users to browse more user information and render large amounts of list data in a smoother and more interactive interface.
[0086] This invention detects collision operations on a view window. The first data displayed in the view window is compiled from functional data, which is then translated from excess data. The position information in the attribute fields of the functional data is a first position node. A second position node is determined based on the collision operation and the first position node. The position information is updated based on the second position node. The functional data is then compiled to obtain the second data, which is then displayed in the view window. By partially compiling and displaying the excess data based on the first position node, and redetermining the display portion of the excess data according to the collision operation, the rendering process of the excess data is simplified, avoiding the stuttering caused by directly compiling all the excess data, and improving the data rendering efficiency. This solves the problem of page stuttering that occurs when translating large amounts of similar data under the MVVM framework in the prior art.
[0087] Example 2
[0088] This invention provides a detailed description of a data display device according to an embodiment of the present invention.
[0089] Reference Figure 6 The diagram shows a schematic representation of a data display device according to an embodiment of the present invention.
[0090] The data display device of this invention includes: a detection module 60, a determination module 62, an update module 64, and a display module 66.
[0091] The functions of each module and the interaction between them are described in detail below.
[0092] The detection module 60 is used to detect collision operations applied to the view window, wherein the first data displayed in the view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is the first position node.
[0093] The determining module 62 is used to determine the second position node based on the collision operation and the first position node;
[0094] Update module 64 is used to update the location information according to the second location node;
[0095] Display module 66 is used to compile the functional data to obtain second data, so as to display the second data in the view window.
[0096] Furthermore, in this embodiment of the invention, a collision operation is detected acting on the view window. The first data displayed in the view window is compiled from functional data, which is then translated from excess data. The position information in the attribute field of the functional data is a first position node. A second position node is determined based on the collision operation and the first position node. The position information is updated based on the second position node. The functional data is then compiled to obtain the second data, which is then displayed in the view window. By partially compiling and displaying the excess data based on the first position node, and by re-determining the display portion of the excess data according to the collision operation, the rendering process of the excess data is simplified, avoiding the stuttering caused by directly compiling all the excess data, and improving the data rendering efficiency. This solves the problem of page stuttering that occurs when translating large amounts of similar data under the MVVM framework in the prior art.
[0097] Example 3
[0098] Preferably, embodiments of the present invention also provide an electronic device, including: a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein the computer program, when executed by the processor, implements the steps of the data display method as described above.
[0099] Optionally, in this embodiment, the memory is configured to store program code for performing the following steps:
[0100] S1, detect collision operations applied to the view window, wherein the first data displayed in the view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is the first position node;
[0101] S2, determine the second position node based on the collision operation and the first position node;
[0102] S3, Update the location information according to the second location node;
[0103] S4, compile the functional data to obtain second data, so that the second data is displayed in the view window.
[0104] Optionally, specific examples in this embodiment can refer to the examples described in Embodiment 1 above, and will not be repeated here.
[0105] Example 5
[0106] Embodiments of the present invention also provide a storage medium. Optionally, in this embodiment, the aforementioned readable storage medium stores a program or instructions that, when executed by a processor, implement the steps of the data display method as described in Embodiment 1.
[0107] Optionally, in this embodiment, the storage medium is configured to store program code for performing the following steps:
[0108] S1, detect collision operations applied to the view window, wherein the first data displayed in the view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is the first position node;
[0109] S2, determine the second position node based on the collision operation and the first position node;
[0110] S3, Update the location information according to the second location node;
[0111] S4, compile the functional data to obtain second data, so that the second data is displayed in the view window.
[0112] Optionally, the storage medium is also configured to store program code for performing the steps included in the method of Embodiment 1 above, which will not be described again in this embodiment.
[0113] Optionally, in this embodiment, the storage medium may include, but is not limited to, various media capable of storing program code, such as USB flash drives, read-only memory (ROM), random access memory (RAM), portable hard drives, magnetic disks, or optical disks.
[0114] Optionally, specific examples in this embodiment can refer to the examples described in Embodiment 1 above, and will not be repeated here.
[0115] It should be noted that, in this document, 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. Unless otherwise specified, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes that element.
[0116] Through the above description of the embodiments, those skilled in the art can clearly understand that the methods of the above embodiments can be implemented by means of software plus necessary general-purpose hardware platforms. Of course, they can also be implemented by hardware, but in many cases the former is a better implementation method. Based on this understanding, the technical solution of the present invention, in essence, or the part that contributes to the prior art, can be embodied in the form of a software product. This computer software product is stored in a storage medium (such as ROM / RAM, magnetic disk, optical disk), and includes several instructions to cause a terminal (which may be a mobile phone, computer, server, air conditioner, or network device, etc.) to execute the methods described in the various embodiments of the present invention.
[0117] The embodiments of the present invention have been described above with reference to the accompanying drawings. However, the present invention is not limited to the specific embodiments described above. The specific embodiments described above are merely illustrative and not restrictive. Those skilled in the art can make many other forms under the guidance of the present invention without departing from the spirit and scope of the claims, and all of these forms are within the protection scope of the present invention.
[0118] 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 invention 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 implementations should not be considered beyond the scope of this invention.
[0119] Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the specific working processes of the systems, devices, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here.
[0120] In the embodiments provided in this application, it should be understood that the disclosed apparatus and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative. For instance, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between apparatuses or units may be electrical, mechanical, or other forms.
[0121] The units described as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.
[0122] In addition, the functional units in the various embodiments of the present invention can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit.
[0123] If the aforementioned functions are implemented as software functional units and sold or used as independent products, they can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this invention, essentially, or the part that contributes to the prior art, or a portion of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods described in the various embodiments of this invention. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, ROM, RAM, magnetic disks, or optical disks.
[0124] The above description is merely a specific embodiment of the present invention, but the scope of protection of the present invention is not limited thereto. Any variations or substitutions that can be easily conceived by those skilled in the art within the technical scope disclosed in the present invention should be included within the scope of protection of the present invention. Therefore, the scope of protection of the present invention should be determined by the scope of the claims.
Claims
1. A data display method, characterized in that, The method includes: Collision detection is performed on the view window, wherein the first data displayed in the view window is compiled from functional data, the functional data is translated from excess data, and the position information in the attribute field of the functional data is the first position node; The second position node is determined based on the collision operation and the first position node; The location information is updated based on the second location node; The functional data is compiled to obtain second data, so that the second data is displayed in the view window; The attribute field also includes the currently displayed segment data, wherein, Prior to detecting the collision operation acting on the view window, the method further includes: The excessive data is hijacked and an early warning is issued; The excessive data is processed for features and translated for types to obtain the functional data; The initial position node corresponding to the functional data is determined based on the viewport parameters, and the position information is determined as the initial position node; then, the functional data is segmented based on the initial position node to obtain initial display data, and the current display segment data is determined as the initial display data; The functional data is template-compiled according to the preset template of the view window to obtain third data, so that the third data is displayed in the view window; The initial position node includes a first initial coordinate and a second initial coordinate, wherein, The step of segmenting the functional data according to the initial position node to obtain initial display data, and determining the current display segment data as the initial display data, includes: The first initial coordinates and the second initial coordinates are determined based on the height of the view window, the height of the list item, and the height of the buffer. The functional data is segmented based on the first initial coordinates and the second initial coordinates to obtain the initial display data; The attribute field also includes a collision detection function, wherein, The collision detection operation applied to the view window includes: The functional data is template-compiled according to the preset template of the view window to obtain third data. After the third data is displayed in the view window, the collision detection function is started to perform collision detection on the user operation applied to the view window. If the boundary of the view window overlaps with the first position node, then the user operation is determined to be a collision operation.
2. The method according to claim 1, characterized in that, The hijacking and warning of the excessive data includes: Listen to the input data; If the number of data points in the input data exceeds a preset threshold, then the input data is determined to be excessive data. The excess data is then transmitted to the data processing module.
3. The method according to claim 1, characterized in that, Determining the second position node based on the collision operation and the first position node includes: The movement direction of the view window is determined based on the collision operation; The second position node is determined based on the movement direction, the preset distance, and the first position node.
4. The method according to claim 3, characterized in that, The second location node includes a first coordinate and a second coordinate, wherein, The step of updating the location information based on the second location node includes: The position information is updated based on the first coordinate and the second coordinate; After updating the position information based on the first coordinate and the second coordinate, the method further includes: The functional data is segmented based on the first coordinate and the second coordinate to update the currently displayed segmented data.
5. A data display device, characterized in that, The device includes: The detection module is used to detect collision operations applied to the view window. The first data displayed in the view window is compiled from functional data, which is translated from excess data. The position information in the attribute field of the functional data is the first position node. The determining module is used to determine the second position node based on the collision operation and the first position node; An update module is used to update the location information based on the second location node; The display module is used to compile the functional data to obtain second data, so that the second data is displayed in the view window; The attribute field also includes currently displayed segmented data, wherein the detection module is further used to intercept the excessive data and issue an early warning; The excessive data is processed for features and translated for types to obtain the functional data; The initial position node corresponding to the functional data is determined based on the viewport parameters, and the position information is determined as the initial position node; then, the functional data is segmented based on the initial position node to obtain initial display data, and the current display segment data is determined as the initial display data; The functional data is template-compiled according to the preset template of the view window to obtain third data, so that the third data is displayed in the view window; The initial position node includes a first initial coordinate and a second initial coordinate, wherein, The step of segmenting the functional data according to the initial position node to obtain initial display data, and determining the current display segment data as the initial display data, includes: The first initial coordinates and the second initial coordinates are determined based on the height of the view window, the height of the list item, and the height of the buffer. The functional data is segmented based on the first initial coordinates and the second initial coordinates to obtain the initial display data; The attribute field also includes a collision detection function. The detection module is further configured to perform template compilation on the functional data according to the preset template of the view window to obtain third data, so that after the third data is displayed in the view window, the collision detection function is started to perform collision detection on the user operation applied to the view window. If the boundary of the view window overlaps with the first position node, then the user operation is determined to be a collision operation.
6. 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 computer program, when executed by the processor, implements the steps of the data display method as described in any one of claims 1 to 4.
7. A readable storage medium, characterized in that, The readable storage medium stores a computer program that, when executed by a processor, implements the steps of the data display method as described in any one of claims 1 to 4.