A display interaction method, device and equipment
By responding to scaling operations on the visualization page, calculating and performing horizontal offsets, and generating new ranges of coordinate axis values, the visual distortion problem during coordinate axis scaling is solved, resulting in a better display effect.
Patent Information
- Application Number
- CN202310355744.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2023-04-04
- Publication Date
- 2026-02-24
- Estimated Expiration
- 2043-04-04
AI Technical Summary
Existing visualizations are prone to causing visual confusion and poor display quality when users adjust the display page, especially when the coordinate axes are zoomed or moved, the data changes drastically, making it difficult for users to view the data smoothly.
By using a focus scaling method, in response to the user's zoom trigger operation within the page, the display position on the coordinate axis is obtained, the position deviation is calculated, and a horizontal offset is made to generate a new range of coordinate axis values. This ensures that the target coordinate axis values remain unchanged in the display position, achieving the scaling of the coordinate axis without causing visual confusion.
The visualization page display effect has been improved, ensuring that the target data remains in its original position after the range of coordinate axis values changes, thus avoiding visual confusion and improving the user experience.
Smart Images

Figure CN116302289B_ABST
Abstract
Description
Technical Field
[0001] This application relates to the field of data visualization technology, specifically to a display interaction method, apparatus, and device. Background Technology
[0002] Currently, various types of data and information can be displayed visually to aid in their analysis. During visualization, users typically need to adjust the display page, such as zooming. However, current visualization methods may cause visual confusion and poor display quality when users adjust the page. Summary of the Invention
[0003] In view of this, embodiments of this application provide a display interaction method, apparatus, and device to improve the display effect of a visual page.
[0004] To address the above problems, the technical solutions provided in this application are as follows:
[0005] In a first aspect, embodiments of this application provide a display interaction method, the method comprising:
[0006] In response to a zoom trigger operation in the first area of the page, the first display position corresponding to the zoom trigger operation on the displayed coordinate axis is obtained, and the first display position is converted into a target coordinate axis value;
[0007] The original coordinate axis value range is enlarged or reduced to obtain the scaled coordinate axis value range;
[0008] Obtain the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values;
[0009] Calculate the positional deviation between the first display position and the second display position;
[0010] Based on the positional deviation, the range of scaled coordinate axis values is horizontally offset to generate a first offset coordinate axis value range.
[0011] The coordinate axes are then re-displayed according to the numerical range of the first offset coordinate axis.
[0012] Secondly, according to an embodiment of this application, a display interaction device is provided, the device comprising:
[0013] The first acquisition unit is used to respond to a zoom trigger operation in the first area of the page, acquire the first display position corresponding to the zoom trigger operation on the display coordinate axis, and convert the first display position into a target coordinate axis value.
[0014] The scaling unit is used to enlarge or reduce the original coordinate axis value range to obtain the scaled coordinate axis value range.
[0015] The second acquisition unit is used to acquire the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values;
[0016] The calculation unit is used to calculate the positional deviation between the first display position and the second display position;
[0017] The first generation unit is used to horizontally offset the range of scaled coordinate axis values according to the position deviation, and generate a first offset coordinate axis value range.
[0018] The first display unit is used to re-display the coordinate axis according to the numerical range of the first offset coordinate axis.
[0019] Thirdly, an embodiment of this application provides a display interaction 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 display interaction method as described above.
[0020] Fourthly, an embodiment of this application provides a computer-readable storage medium storing instructions that, when executed on a terminal device, cause the terminal device to perform the display interaction method described above.
[0021] Therefore, the embodiments of this application have the following beneficial effects:
[0022] In this embodiment, in response to a zoom trigger operation within the first area of the page, the first display position corresponding to the zoom trigger operation on the displayed coordinate axis is obtained, and the first display position is converted into a target coordinate axis value. Simultaneously, in response to the zoom trigger operation, the original coordinate axis value range can be enlarged or reduced to obtain a scaled coordinate axis value range. Within the scaled coordinate axis value range, the target coordinate axis value will correspond to a new position, namely a second display position, and there is a positional deviation between the first and second display positions. Based on this positional deviation, the scaled coordinate axis value range is horizontally offset as a whole, generating a first offset coordinate axis value range, and the coordinate axis is re-displayed according to the first offset coordinate axis value range. Thus, even after the coordinate axis value range changes, the target coordinate axis value remains displayed in the first display position. This achieves a focused zoom effect, centered on the zoom trigger operation, keeping the data at the trigger operation position unchanged while the displayed coordinate axis is scaled, thus avoiding visual confusion for the user and improving the display effect. Attached Figure Description
[0023] Figure 1 A schematic diagram illustrating an exemplary application scenario provided in this application embodiment;
[0024] Figure 2 A flowchart illustrating a display interaction method provided in an embodiment of this application;
[0025] Figure 3 This is a schematic diagram showing the result of visualizing event statistics in an embodiment of this application;
[0026] Figure 4 This is a flowchart illustrating the display of event information in an embodiment of this application;
[0027] Figure 5 This is a schematic diagram showing the result of visualizing event information in an embodiment of this application;
[0028] Figure 6 This is a schematic diagram showing the result of visualizing the event connection lines in the embodiments of this application;
[0029] Figure 7 This is a schematic diagram of the visual interface in the embodiments of this application;
[0030] Figure 8 A schematic diagram of a display interaction device provided in an embodiment of this application;
[0031] Figure 9 This is a schematic diagram of an electronic device provided in an embodiment of this application. Detailed Implementation
[0032] To make the above-mentioned objectives, features and advantages of this application more apparent and understandable, the embodiments of this application will be further described in detail below with reference to the accompanying drawings and specific implementation methods.
[0033] To facilitate understanding and explanation of the technical solutions provided in the embodiments of this application, the background technology of this application will be described first.
[0034] Currently, various types of data and information can be displayed visually to aid in analysis. During visualization, users typically need to adjust the display page, such as zooming. However, current visualization methods can cause visual confusion and poor display quality when users adjust the page. This is especially true for data displayed using axes; if the data on the axes changes drastically when users zoom or move them, the data becomes difficult to view.
[0035] Based on this, embodiments of this application provide a display interaction method, apparatus, and device. When a user triggers a zoom operation, the data at the trigger zoom operation position remains unchanged by focusing and zooming, while the displayed coordinate axis is stretched or contracted. This avoids visual confusion for the user and improves the display effect.
[0036] To facilitate understanding of the display interaction method provided in the embodiments of this application, the following is combined with... Figure 1 The example scenario is shown below. See also... Figure 1 As shown in the figure, this figure is a schematic diagram of an exemplary application scenario provided in the embodiments of this application.
[0037] In this embodiment, data can be displayed on a visualization page based on coordinate axes. Users viewing the visualization page may need to zoom, move, or perform other operations. When a user performs a zoom-triggered operation within the first area of the page, such as the area corresponding to the coordinate axis, the first display position corresponding to the zoom-triggered operation on the displayed coordinate axis can be obtained. The first display position corresponds to a certain value on the coordinate axis, i.e., the target coordinate axis value, for example... Figure 1 The mouse cursor position is the first display position corresponding to the zoom trigger operation, and the corresponding target coordinate axis value is 4.
[0038] Because of the scaling trigger operation, the original coordinate axis value range will be converted into a scaled coordinate axis value range. For example, if the zoom trigger operation is performed, the original coordinate axis value range will be reduced, and the original coordinate axis value range (1,10) will be converted into a scaled coordinate axis value range (3,8). At this time, the target coordinate axis value will have a new display position, i.e., a second display position, within the scaled coordinate axis value range.
[0039] There is a positional deviation between the first and second display positions. Based on this deviation, the entire range of scaled coordinate axis values is horizontally shifted to generate a first offset coordinate axis value range. For example, the scaled coordinate axis value range (3,8) is shifted to the first offset coordinate axis value range (2,7). Finally, the coordinate axes are re-displayed according to the first offset coordinate axis value range.
[0040] Therefore, even after the range of coordinate axis values changes, the target coordinate axis value remains displayed in the first position; for example, the target coordinate axis value of 4 remains displayed in its original position. This achieves a focused scaling effect, centered on the scaling trigger operation. The data at the trigger operation location remains unchanged, while the displayed coordinate axis expands or contracts. This avoids visual confusion for the user and improves the display effect.
[0041] Those skilled in the art will understand that Figure 1The schematic diagram shown is merely one example in which embodiments of this application can be implemented. The scope of application of the embodiments of this application is not limited by any aspect of this framework.
[0042] To facilitate understanding of this application, a display interaction method provided by an embodiment of this application will be described below with reference to the accompanying drawings.
[0043] See Figure 2 As shown, this figure is a flowchart of a display interaction method provided in an embodiment of this application. Figure 2 As shown, the method may include S201-S206:
[0044] S201: In response to a zoom trigger operation in the first area of the page, obtain the first display position corresponding to the zoom trigger operation on the display coordinate axis, and convert the first display position into a target coordinate axis value.
[0045] This application's embodiments can be applied to electronic devices displaying visual pages. Data can be displayed based on coordinate axes on the visual page. For example, the coordinate axis can be a time axis, allowing the display of time-series data. The displayed coordinate axis has a numerical range; for example, the displayed coordinate axis corresponds to data with a numerical range of 1-10. Simultaneously, each point on the coordinate axis has a corresponding display position. For example, if the left boundary of the current coordinate axis is 1 and the right boundary is 10, the point with a value of 1 on the coordinate axis corresponds to the display position at x-coordinate 0, and the point with a value of 10 corresponds to the display position at x-coordinate 100. Thus, each point on the coordinate axis has a corresponding display position.
[0046] Users often need to zoom in and out when viewing visualizations. This zooming can be triggered within the first area of the page, such as the area corresponding to the coordinate axes. In practice, the mouse wheel and touchpad can be used for zooming; for example, scrolling up or down with the mouse wheel or sliding in or out with the touchpad. For users, using the mouse wheel and touchpad minimizes the interaction path, eliminating the need for additional clicks or drags.
[0047] After detecting a zoom-in trigger operation by the user within the first area of the page, the first display position corresponding to the zoom-in trigger operation on the displayed coordinate axis can be obtained. For example, if a zoom-in trigger operation is performed using the mouse wheel, the current display position of the mouse cursor on the coordinate axis, such as the position at the horizontal coordinate 10, can be determined as the first display position.
[0048] When displaying coordinate axes, the display position and corresponding coordinate axis value of each point on the axis are known. Therefore, the first display position can be further converted into the target coordinate axis value corresponding to that position. For example, the scale.invert() function can be used to map the display position to the coordinate axis value, then mouseFocusData = scale.invert(mousePosition), where mouseFocusData is the target coordinate axis value and mousePosition is the first display position.
[0049] S202: Scale up or down the original coordinate axis value range to obtain the scaled coordinate axis value range.
[0050] In response to a zoom-triggered operation, the original range of coordinate axis values needs to be enlarged or reduced. Understandably, with the displayed length of the coordinate axis remaining constant, if the zoom-triggered operation is an enlargement operation, the original range of coordinate axis values needs to be reduced to achieve the effect of enlarging the coordinate axis by displaying less data; conversely, if the zoom-triggered operation is a reduction operation, the original range of coordinate axis values needs to be enlarged to achieve the effect of shrinking the coordinate axis by displaying more data.
[0051] As the zoom-triggered operation proceeds, the original coordinate axis value range can be continuously enlarged or reduced. When the zoom-triggered operation stops, the scaled coordinate axis value range is obtained. In practical applications, the original coordinate axis value range can be continuously enlarged or reduced at a preset time frequency until the zoom-triggered operation stops. For example, if the zoom-in operation is triggered by scrolling the mouse wheel upwards, when the mouse wheel is detected scrolling upwards within the first area of the page, the original coordinate axis value range is continuously reduced at a preset time frequency until the mouse wheel stops scrolling upwards. The preset time frequency can be set according to actual conditions; this application embodiment does not limit the value of the preset time frequency.
[0052] In one possible implementation, S202 enlarges or reduces the original coordinate axis value range to obtain the scaled coordinate axis value range. Specific implementations of this can include:
[0053] A1: When the scaling trigger operation is a zoom-in operation, the left boundary value of the original coordinate axis value range is multiplied by the first coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by the second coefficient to obtain the right boundary value of the scaled coordinate axis value range. The first coefficient is greater than 1, and the second coefficient is less than 1.
[0054] When the scaling trigger operation is a magnification operation, the scaled coordinate axis value range can be obtained by multiplying the left boundary value of the original coordinate axis value range by a first coefficient greater than 1 and multiplying the right boundary value of the original coordinate axis value range by a second coefficient less than 1. This achieves a reduction in the original coordinate axis value range; for example, the scaled coordinate axis value range (3, 8) can be obtained from the original coordinate axis value range (1, 10). The first and second coefficients can be set according to actual conditions, and the values of the first and second coefficients are not limited in this embodiment.
[0055] In practical applications, a two-dimensional array `scale.domain` can be set to store the coordinate axis values. Then, `scale.domain[0]` stores the left boundary value of the coordinate axis value range, and `scale.domain[1]` stores the right boundary value of the coordinate axis value range. When the scaling trigger operation is a magnification operation, for example, if the first coefficient is 1.00001 and the second coefficient is 0.99999, then `scale.domain[0] = scale.domain[0] * 1.00001, scale.domain[1] = scale.domain[1] * 0.99999` can be used to update `scale.domain[0]` and `scale.domain[1]`, thereby reducing the coordinate axis value range and obtaining the scaled coordinate axis value range from the original coordinate axis value range.
[0056] A2: When the scaling trigger operation is a shrinking operation, the left boundary value of the original coordinate axis value range is multiplied by the third coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by the fourth coefficient to obtain the right boundary value of the scaled coordinate axis value range. The third coefficient is less than 1, and the fourth coefficient is greater than 1.
[0057] When the scaling trigger operation is a shrinking operation, the scaled coordinate axis value range can be obtained by multiplying the left boundary value of the original coordinate axis value range by a third coefficient less than 1, and multiplying the right boundary value of the original coordinate axis value range by a fourth coefficient greater than 1. This enlarges the original coordinate axis value range; for example, the scaled coordinate axis value range (1, 11) can be obtained from the original coordinate axis value range (2, 10). The third and fourth coefficients can be set according to actual conditions; this embodiment does not limit the values of the third and fourth coefficients.
[0058] In practical applications, a two-dimensional array `scale.domain` can be set to store the coordinate axis values. Then, `scale.domain[0]` stores the left boundary value of the coordinate axis value range, and `scale.domain[1]` stores the right boundary value of the coordinate axis value range. When the scaling trigger operation is a shrinking operation, for example, if the third coefficient is 0.99999 and the fourth coefficient is 1.00001, then `scale.domain[0] = scale.domain[0] * 0.99999, scale.domain[1] = scale.domain[1] * 1.00001` can be used to update `scale.domain[0]` and `scale.domain[1]`, thereby enlarging the coordinate axis value range and obtaining the scaled coordinate axis value range from the original coordinate axis value range.
[0059] As the scaling trigger operation proceeds, A1-A2 can be executed repeatedly until the scaling trigger operation stops, thus obtaining the final range of scaled coordinate axis values.
[0060] S203: Obtain the second display position corresponding to the target coordinate axis value within the range of scaled coordinate axis values.
[0061] After obtaining the range of scaled coordinate axis values, the target coordinate axis value will have a new position within this range, which is the second display position. When displaying the coordinate axis, the coordinate axis values and corresponding display positions of each point on the axis are also known. Therefore, the target coordinate axis value can be converted into the corresponding second display position within the range of scaled coordinate axis values. For example, by setting the `scale.scale()` function to map the coordinate axis values to the display position, the second display position would be `scale.scale(mouseFocusData)`, where `mouseFocusData` is the target coordinate axis value.
[0062] S204: Calculate the positional deviation between the first display position and the second display position.
[0063] There is a positional deviation between the first display position and the second display position, which can be obtained by subtracting the two positions. For example, deltaOffset = scale.scale(mouseFocusData) - mousePosition, where deltaOffset is the positional deviation, scale.scale(mouseFocusData) is the second display position, and mousePosition is the first display position.
[0064] S205: Horizontally offset the range of values on the scaled coordinate axes based on the positional deviation to generate the first offset coordinate axis range.
[0065] S206: Redisplay the coordinate axes according to the numerical range of the first offset coordinate axis.
[0066] To eliminate positional deviations and move the target coordinate axis values from the second display position to the first display position, the entire range of scaled coordinate axis values is horizontally offset, thus redefining the coordinate axis value range—the first offset coordinate axis value range. Finally, the coordinate axis display is refreshed according to the first offset coordinate axis value range. Therefore, even after the coordinate axis value range changes, the target coordinate axis value can still be displayed in the first display position.
[0067] Based on the descriptions in S201-S206, in this embodiment, in response to a zoom trigger operation within the first area of the page, the first display position corresponding to the zoom trigger operation on the displayed coordinate axis is obtained, and the first display position is converted into a target coordinate axis value. Simultaneously, in response to the zoom trigger operation, the original coordinate axis value range can be enlarged or reduced to obtain a scaled coordinate axis value range. Within the scaled coordinate axis value range, the target coordinate axis value will correspond to a new position, namely a second display position, and there is a positional deviation between the first and second display positions. Based on this positional deviation, the scaled coordinate axis value range is horizontally offset as a whole, generating a first offset coordinate axis value range, and the coordinate axis is re-displayed according to the first offset coordinate axis value range. Thus, even after the coordinate axis value range changes, the target coordinate axis value remains displayed in the first display position. This achieves a focused zoom effect, centered on the zoom trigger operation, keeping the data at the trigger operation position unchanged while the displayed coordinate axis is scaled, thus avoiding visual confusion for the user and improving the display effect.
[0068] Users can also perform horizontal movement to trigger actions on the visual page. Therefore, in some possible implementations, the display interaction method provided in this application embodiment may further include:
[0069] B1: In response to a horizontal movement trigger operation within the first or second area of the page, the original coordinate axis value range is horizontally offset to generate a second offset coordinate axis value range.
[0070] Users often need to move horizontally across a visualized page. This movement can be triggered within either the first or second area of the page. The second area refers to the area on the page excluding the first area. In practice, horizontal movement can be triggered using the mouse or touchpad, such as by left-clicking or right-clicking with the mouse, or by sliding the touchpad left or right.
[0071] After detecting a user's horizontal movement trigger operation within the first or second area of the page, the original coordinate axis value range can be horizontally offset based on the movement direction indicated by the horizontal movement trigger operation, generating a second offset coordinate axis value range. For example, if the horizontal movement trigger operation indicates a rightward movement, the second offset coordinate axis value range (1,9) is obtained from the original coordinate axis value range (2,10); if the horizontal movement trigger operation indicates a rightward movement, the second offset coordinate axis value range (3,11) is obtained from the original coordinate axis value range (2,10).
[0072] B2: Redisplay the coordinate axes according to the numerical range of the second offset coordinate axis.
[0073] Finally, the coordinate axis display is refreshed according to the second offset coordinate axis value range, thereby achieving the display effect of coordinate axis translation.
[0074] In this embodiment of the application, the displayed coordinate axes can be horizontally shifted in response to a horizontal movement trigger operation.
[0075] In a typical application scenario, various applications generate time-series event information. For example, social applications generate event information recording user behavior. For instance, when user A logs in, event information recording user A's login event is generated; when user A sends a private message to user B, and user B simultaneously receives the private message from user A, event information recording the private message communication event between user A and user B is generated. Simultaneously, time-series event statistics are also generated, representing the total number of events of a certain type occurring within a specific time period. This application's embodiments can visualize user event information and / or event statistics. In the above embodiments, the coordinate axis can be a time coordinate axis, and the numerical range of the time coordinate axis corresponds to the range of time. That is, time can be converted into numerical values and displayed through the time coordinate axis.
[0076] In this embodiment, during the scaling and horizontal translation of the time axis, the bar charts corresponding to the event statistics and / or the event time axis corresponding to the event information can also be re-displayed along with the changes in the time axis. For ease of understanding, the display of the bar charts corresponding to the event statistics will be explained first.
[0077] In this embodiment, event statistics can be obtained, representing the total number of events of a certain type occurring within a certain time period. Therefore, the event statistics include event type, start time, end time, and total number of events. The start and end times refer to the start and end times of a time period, and the total number of events is the total number of events of a certain type generated by each user within that time period. For example, if the total number of registration events is 10,000 between 00:00 and 01:00 on a certain day, then the event statistics include: event type: registration event, start time: 00:00 on a certain day, end time: 01:00 on a certain day, and total number of events: 10,000.
[0078] In practical applications, multiple event statistics can represent the total number of events occurring for different event types within multiple time periods. For example, event statistics 1 includes the total number of registration events occurring within time period 1, event statistics 2 includes the total number of comment events occurring within time period 1, event statistics 3 includes the total number of registration events occurring within time period 2, event statistics 4 includes the total number of comment events occurring within time period 2, and so on.
[0079] Triggering the display of a time axis, which serves as the time basis for the displayed data. Simultaneously, it can also trigger the display of bar charts corresponding to event statistics, showing the event statistics through these bar charts. Each bar chart corresponds to the event statistics for the same event type, for example, [bar chart format missing]. Figure 1 Event statistics corresponding to the registered event type, in bars Figure 2 Event statistics corresponding to the comment event type.
[0080] Each bar chart includes at least one bar structure. The start point of the bar structure corresponds to the start time in the event statistics and is aligned with the corresponding time on the time axis. The end point of the bar structure corresponds to the end time in the event statistics and is also aligned with the corresponding time on the time axis. The height of the bar structure corresponds to the total number of events that occurred in the event statistics. In other words, the bar structure represents the total number of events of a certain type occurring within a certain time period. Specifically, each bar structure corresponds to a piece of event statistics. The start and end times in the event statistics are converted into the start and end points of the bar structure through a time mapping. The start point of the bar structure can be understood as its left boundary, and the end point as its right boundary. The start and end times of the bar structure are aligned with the corresponding times on the time axis. The total number of events that occurred in the event statistics is converted into the height of the bar structure through a linear mapping.
[0081] See Figure 3 The diagram illustrates the results of a visual display of event statistics. For example, when the time axis is displayed, two bar charts are shown, corresponding to event statistics for registered events and private message events, respectively. The bar structure within the bar charts allows for a visual representation of the total number of events occurring within the corresponding time period.
[0082] In this embodiment of the application, the event timeline corresponding to the event information can also be displayed, see [link to relevant documentation]. Figure 4 The diagram shows a flowchart for displaying event information, including:
[0083] S401: Obtain user event information, which includes user information and the time the event occurred.
[0084] This application embodiment can be applied to electronic devices that trigger the display of event information. In this application embodiment, it is first necessary to obtain the user's event information. Event information is used to record relevant information about various events that generate user behavior. The user's event information includes user information, such as user identifier and user IP address. The user's event information may also include the event type and the corresponding event occurrence time. A single event information entry can record the occurrence time of one or more events corresponding to a user. Multiple events can be of different types or of the same type. The event occurrence time can be represented using a timestamp.
[0085] When multiple different event messages for the same user are obtained, they can be merged according to the time of occurrence of the events, so that the same user corresponds to one event message.
[0086] In another possible implementation, the user's event information also includes relationship information between events. Different events from different users can be related. For example, a user's sending a private message event is related to another user's receiving a private message event.
[0087] Here's an example illustrating user event information. For instance, when user A logs in, event information 1 records user A's user information and the time the login event occurred. When user A sends a private message to user B, and user B simultaneously receives a private message from user A, event information 2 records user A's user information, the time the private message sending event occurred, and user B as the related user. Event information 3 records user B's user information, the time the private message receiving event occurred, and user A as the related user. Since both event information 1 and event information 2 contain user A's information, they can be merged into a single event information entry. The merged event information 1' records user A's user information, the time the login event occurred, the time the private message sending event occurred, and user B as the related user. The private message sending and receiving events can both belong to the same event type: private message communication events.
[0088] S402: Determine the display position of the event timeline corresponding to the user based on the user information.
[0089] The system differentiates user information within the user's event information and assigns a corresponding event timeline display position to each user. Generally, each user corresponds to one event timeline, which is used to identify the occurrence time of relevant events for that user.
[0090] In practical applications, the intervals between each event timeline can be determined based on the actual display conditions, thus determining the display position of the event timelines. For example, if the event timelines are parallel to the horizontal direction, arranged vertically, and spaced 5 display units (e.g., 5 pixels) apart, then the first event timeline will be displayed at position 0 on the vertical axis, the second at position 5, and so on. The position of each event timeline from left to right can be marked with a time marker, and the time marked on the event timeline corresponds to the time marked at the same position on the time axis.
[0091] S403: Based on the event occurrence time in the event information of the target user, determine the display position of the event node on the event timeline corresponding to the target user; the target user can be any user.
[0092] The target user can be any user. For each target user, based on the occurrence time of each event in their event information, the display position of the event node corresponding to each event can be determined on the target user's event timeline. The display position of the event node corresponds to the time marked at the same position on the time axis. In practical applications, the time marked at each position on the time axis can be set, thus determining the corresponding display position of the event node on the event timeline based on the event's occurrence time.
[0093] S404: Trigger the display of the time axis.
[0094] S405: Based on the display position of the event timeline and the display position of the event node, trigger the display of the event timeline and event node corresponding to the user; the time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time marked on the event timeline.
[0095] When visualization is required, the time axis, event timeline, and event nodes can be displayed simultaneously. In practical applications, based on the determined display positions of the event timeline and event nodes, the event timelines for each user and the event nodes on each event timeline are triggered for display. The event timeline is parallel to the time axis, and the time axis corresponds to the time marked at the same position on the event timeline; the time axis serves as the basis for the displayed time. The occurrence time of an event can be visualized by the position of its event node on the event timeline.
[0096] See Figure 5 The diagram illustrates the result of visualizing event information. Assuming four users, each user's corresponding event timeline is triggered and displayed based on their designated event timeline position, simultaneously displaying a time coordinate axis as the time base. In the diagram, black dots represent event nodes, each corresponding to one event. Event nodes are displayed on the event timeline based on their position. Thus, the time corresponding to each event node can be visualized using the time coordinate axis.
[0097] Since the user's event information may also include relationship information between events, the embodiments of this application can also visualize the relationship between events.
[0098] After triggering the display of the event timeline and event nodes, the relationship information between events can be used to determine the related event nodes between different users. Related event nodes between different users typically share the same event occurrence time. For example, if user A sends a private message to user B at 00:00 on a certain day, and user B simultaneously receives a private message from user A, then user A has a private message sending event node 'a', which occurs at 00:00 on the same day, and user B has a private message receiving event node 'b', which also occurs at 00:00 on the same day. Therefore, private message sending event node 'a' and private message receiving event node 'b' are related event nodes between different users.
[0099] Based on the positions of related event nodes, the start and end points of event connection lines can be determined, and these connection lines can then be used to link related event nodes. This triggers the display of the event connection lines between the related event nodes.
[0100] See Figure 6 The diagram illustrates the result of visualizing event connection lines. For example, the first event node of user id_1 and the first event node of user id_2 are related event nodes, and an event connection line is displayed between these two event nodes; the second event node of user id_2 and the first event node of user id_4 are related event nodes, and an event connection line is displayed between these two event nodes, and so on.
[0101] Based on the above description, in one possible implementation, the display interaction method provided in this application embodiment may further include:
[0102] As the coordinate axes are redisplayed, the corresponding bar charts for the displayed event statistics are also redisplayed.
[0103] When the coordinate axis is a time axis, and with zoom or horizontal movement trigger operations, the time axis is redisplayed, and the corresponding histogram for the event statistics also redisplays accordingly. In other words, when the time range corresponding to the time axis changes, the histogram for the event statistics changes accordingly, ensuring that the start point of the histogram aligns with the start time in the event statistics and the corresponding time on the time axis, and the end point aligns with the end time in the event statistics and the corresponding time on the time axis.
[0104] In one possible implementation, the display interaction method provided in this application embodiment may further include:
[0105] As the coordinate axes are redisplayed, the event timeline corresponding to the displayed event information is also redisplayed. The time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time indicated by the event timeline.
[0106] Similarly, when the coordinate axis is a time axis, and a zoom or horizontal movement trigger operation is performed, the displayed event timeline will also be redisplayed after the time axis changes. In other words, when the time range corresponding to the time axis changes, the time range corresponding to the event timeline also changes accordingly.
[0107] In one possible implementation, event nodes are displayed on the event timeline, with the display position of the event node corresponding to the event occurrence time in the event information.
[0108] In other words, when the time range corresponding to the time axis changes, the time range corresponding to the event time axis also changes accordingly, which can ensure that the event occurrence time corresponding to the event information on the event time axis remains aligned with the corresponding time in the time axis.
[0109] Thus, in this embodiment of the application, when a time axis is displayed, and the bar chart corresponding to the event statistics and / or the event time axis corresponding to the event information are displayed through the time axis, the bar chart corresponding to the event statistics and / or the event time axis corresponding to the event information can be re-displayed as the time axis is scaled or moved horizontally, thereby realizing the interactive display process of the visualization page.
[0110] Furthermore, due to the large number of event timelines, users can also perform vertical movement of the display area containing the event timelines on the visualization page to trigger operations. Therefore, in some possible implementations, the display interaction method provided in this application embodiment may further include:
[0111] C1: In response to a vertical movement trigger operation within the second area of the page, the vertical display position of the event timeline is vertically offset, and the vertical display position of the event timeline is redefined.
[0112] When viewing a visualization page, users may need to move vertically across the display area containing the event timeline. This vertical movement can be triggered within the second area of the page. Horizontal movement can be triggered using the mouse and touchpad; for example, scrolling the mouse wheel up or down or sliding the touchpad up or down can trigger vertical movement.
[0113] After detecting a user's vertical movement trigger operation within the second area of the page, the vertical display position of the event timeline can be shifted vertically according to the movement direction indicated by the vertical movement trigger operation, thus redetermining the vertical display position of the event timeline. For example, if the movement direction indicated by the vertical movement trigger operation is upward, then the vertical display position of each event timeline will be moved upward, thus redetermining the vertical display position of the event timeline.
[0114] C2: Redisplay the event timeline according to its vertical display position.
[0115] Finally, the event timeline is re-displayed according to the updated vertical display position, thus achieving the effect of vertically shifting the event timeline.
[0116] In this embodiment of the application, the displayed event timeline can be vertically shifted in response to a vertical movement trigger operation.
[0117] Since scrolling the mouse wheel up and down can trigger both zoom and vertical movement, to prevent both from triggering simultaneously, scrolling the mouse wheel up and down within the first area of the page will trigger zoom, and scrolling the mouse wheel up and down within the second area of the page will trigger vertical movement.
[0118] In scenarios where user event information and / or event statistics are displayed, see [link to relevant documentation]. Figure 7 The diagram illustrates a visualization interface. In this interface, the time axis is displayed in one area, each bar chart in its own area, and each event timeline in its own area. The display areas for the time axis and bar charts can be considered the first area of the page, while the display area for the event timelines can be considered the second area. Therefore, zooming can only be triggered in the first area of the page, and vertical movement can only be triggered in the second area.
[0119] Based on the display interaction method provided in the above-described method embodiments, this application also provides a display interaction device, which will be described below with reference to the accompanying drawings.
[0120] See Figure 8 As shown, this figure is a schematic diagram of the structure of a display interaction device provided in an embodiment of this application. Figure 8 As shown, the display interaction device includes:
[0121] The first acquisition unit 801 is used to respond to a zoom trigger operation in the first area of the page, acquire the first display position corresponding to the zoom trigger operation on the display coordinate axis, and convert the first display position into a target coordinate axis value.
[0122] The scaling unit 802 is used to enlarge or reduce the original coordinate axis value range of the coordinate axis to obtain the scaled coordinate axis value range.
[0123] The second acquisition unit 803 is used to acquire the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis value;
[0124] Calculation unit 804 is used to calculate the positional deviation between the first display position and the second display position;
[0125] The first generation unit 805 is used to horizontally offset the scaled coordinate axis value range according to the position deviation, and generate a first offset coordinate axis value range.
[0126] The first display unit 806 is used to re-display the coordinate axis according to the numerical range of the first offset coordinate axis.
[0127] In one possible implementation, the scaling unit includes:
[0128] The magnification subunit is used to, when the scaling trigger operation is a magnification operation, multiply the left boundary value of the original coordinate axis value range of the coordinate axis by a first coefficient to obtain the left boundary value of the scaled coordinate axis value range, and multiply the right boundary value of the original coordinate axis value range of the coordinate axis by a second coefficient to obtain the right boundary value of the scaled coordinate axis value range, wherein the first coefficient is greater than 1 and the second coefficient is less than 1.
[0129] The shrinking subunit is used to, when the scaling trigger operation is a shrinking operation, multiply the left boundary value of the original coordinate axis value range of the coordinate axis by a third coefficient to obtain the left boundary value of the scaled coordinate axis value range, and multiply the right boundary value of the original coordinate axis value range of the coordinate axis by a fourth coefficient to obtain the right boundary value of the scaled coordinate axis value range, wherein the third coefficient is less than 1 and the fourth coefficient is greater than 1.
[0130] In one possible implementation, the device further includes:
[0131] The second generation unit is used to respond to a horizontal movement trigger operation in the first area or the second area of the page, and to horizontally offset the original coordinate axis value range of the coordinate axis to generate a second offset coordinate axis value range.
[0132] The second display unit is used to re-display the coordinate axis according to the numerical range of the second offset coordinate axis.
[0133] In one possible implementation, the coordinate axis is a time coordinate axis, and the range of values for the time coordinate axis corresponds to a range of time. The device further includes:
[0134] The third display unit is used to redisplay the bar charts corresponding to the displayed event statistics information as the coordinate axis is redisplayed. Each bar chart corresponds to event statistics information of the same event type. The bar chart includes at least one bar structure. The starting point of the bar structure corresponds to the start time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The ending point of the bar structure corresponds to the end time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The height of the bar structure corresponds to the total number of events in the event statistics information.
[0135] In one possible implementation, the coordinate axis is a time coordinate axis, and the range of values for the time coordinate axis corresponds to a range of time. The device further includes:
[0136] The fourth display unit is used to redisplay the event timeline corresponding to the displayed event information as the coordinate axis is redisplayed. The time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time indicated by the event timeline.
[0137] In one possible implementation, event nodes are displayed on the event timeline, and the display position of the event nodes corresponds to the event occurrence time in the event information.
[0138] In one possible implementation, the device further includes:
[0139] The determining unit is configured to, in response to a vertical movement trigger operation within the second area of the page, vertically offset the vertical display position of the event timeline and redetermine the vertical display position of the event timeline.
[0140] The fifth display unit is used to re-display the event timeline according to its vertical display position.
[0141] Based on the display interaction method provided in the above-described method embodiments, this application also provides an electronic device, including: one or more processors; a storage device storing one or more programs thereon, wherein when the one or more programs are executed by the one or more processors, the one or more processors implement the display interaction method described in any of the above embodiments.
[0142] The following is for reference. Figure 9 The diagram illustrates a structural schematic of an electronic device 1300 suitable for implementing embodiments of this application. The terminal devices in these embodiments may include, but are not limited to, mobile terminals such as mobile phones, laptops, digital broadcast receivers, PDAs (Personal Digital Assistants), PADs (Portable Android Devices), PMPs (Portable Media Players), in-vehicle terminals (e.g., in-vehicle navigation terminals), and fixed terminals such as digital TVs (televisions), desktop computers, etc. Figure 9 The electronic device shown is merely an example and should not impose any limitation on the functionality and scope of use of the embodiments of this application.
[0143] like Figure 9 As shown, electronic device 1300 may include a processing device (e.g., a central processing unit, a graphics processor, etc.) 1301, which can perform various appropriate actions and processes according to a program stored in read-only memory (ROM) 1302 or a program loaded from storage device 1306 into random access memory (RAM) 1303. RAM 1303 also stores various programs and data required for the operation of electronic device 1300. Processing device 1301, ROM 1302, and RAM 1303 are interconnected via bus 1304. Input / output (I / O) interface 1305 is also connected to bus 1304.
[0144] Typically, the following devices can be connected to I / O interface 1305: input devices 1306 including, for example, touchscreens, touchpads, keyboards, mice, cameras, microphones, accelerometers, gyroscopes, etc.; output devices 1307 including, for example, liquid crystal displays (LCDs), speakers, vibrators, etc.; storage devices 1306 including, for example, magnetic tapes, hard disks, etc.; and communication devices 1309. Communication device 1309 allows electronic device 1300 to communicate wirelessly or wiredly with other devices to exchange data. Although Figure 9 An electronic device 1300 with various devices is shown; however, it should be understood that it is not required to implement or possess all of the devices shown. More or fewer devices may be implemented or possessed alternatively.
[0145] Specifically, according to embodiments of this application, the processes described above with reference to the flowcharts can be implemented as computer software programs. For example, embodiments of this application include a computer program product comprising a computer program carried on a non-transitory computer-readable medium, the computer program containing program code for performing the methods shown in the flowcharts. In such embodiments, the computer program can be downloaded and installed from a network via communication device 1309, or installed from storage device 1306, or installed from ROM 1302. When the computer program is executed by processing device 1301, it performs the functions defined in the methods of embodiments of this application.
[0146] The electronic device provided in this application embodiment and the display interaction method provided in the above embodiment belong to the same inventive concept. Technical details not described in detail in this embodiment can be found in the above embodiment, and this embodiment has the same beneficial effects as the above embodiment.
[0147] Based on the display interaction method provided in the above method embodiments, this application provides a computer-readable medium storing a computer program thereon, wherein the program, when executed by a processor, implements the display interaction method as described in any of the above embodiments.
[0148] It should be noted that the computer-readable medium described above in this application can be a computer-readable signal medium, a computer-readable storage medium, or any combination thereof. A computer-readable storage medium can be, for example,—but not limited to—an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination thereof. More specific examples of a computer-readable storage medium may include, but are not limited to: an electrical connection having one or more wires, a portable computer disk, a hard disk, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination thereof. In the embodiments of this application, a computer-readable storage medium can be any tangible medium containing or storing a program that can be used by or in conjunction with an instruction execution system, apparatus, or device. In this application, a computer-readable signal medium can include a data signal propagated in baseband or as part of a carrier wave, carrying computer-readable program code. Such propagated data signals can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium can be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in connection with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any suitable medium, including but not limited to: wires, optical fibers, RF (radio frequency), etc., or any suitable combination thereof.
[0149] In some implementations, clients and servers can communicate using any currently known or future-developed network protocol such as HTTP (Hypertext Transfer Protocol) and can interconnect with digital data communication (e.g., communication networks) of any form or medium. Examples of communication networks include local area networks (“LANs”), wide area networks (“WANs”), the Internet (e.g., the Internet of Things), and peer-to-peer networks (e.g., ad hoc peer-to-peer networks), as well as any currently known or future-developed networks.
[0150] The aforementioned computer-readable medium may be included in the aforementioned electronic device; or it may exist independently and not assembled into the electronic device.
[0151] The aforementioned computer-readable medium carries one or more programs, which, when executed by the electronic device, cause the electronic device to perform the aforementioned display interaction method.
[0152] Computer program code for performing the operations of the embodiments of this application can be written in one or more programming languages or a combination thereof. These programming languages include, but are not limited to, object-oriented programming languages such as Java, Smalltalk, and C++, as well as conventional procedural programming languages such as the "C" language or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a standalone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving remote computers, the remote computer can be connected to the user's computer via any type of network—including a local area network (LAN) or a wide area network (WAN)—or can be connected to an external computer (e.g., via the Internet using an Internet service provider).
[0153] The flowcharts and block diagrams in the accompanying drawings illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various embodiments of this application. In this regard, each block in a flowchart or block diagram may represent a module, segment, or portion of code containing one or more executable instructions for implementing a specified logical function. It should also be noted that in some alternative implementations, the functions indicated in the blocks may occur in a different order than those indicated in the drawings. For example, two consecutively indicated blocks may actually be executed substantially in parallel, and they may sometimes be executed in reverse order, depending on the functions involved. It should also be noted that each block in the block diagrams and / or flowcharts, and combinations of blocks in the block diagrams and / or flowcharts, can be implemented using a dedicated hardware-based system that performs the specified function or operation, or using a combination of dedicated hardware and computer instructions.
[0154] The units described in the embodiments of this application can be implemented in software or hardware. The names of the units / modules do not necessarily limit the specific unit itself.
[0155] The functions described above in this document can be performed, at least in part, by one or more hardware logic components. For example, exemplary types of hardware logic components that can be used, without limitation, include: Field Programmable Gate Arrays (FPGAs), Application-Specific Integrated Circuits (ASICs), Application Standard Products (ASSPs), System-on-Chip (SoCs), Complex Programmable Logic Devices (CPLDs), and so on.
[0156] In the context of embodiments of this application, a machine-readable medium can be a tangible medium that may contain or store a program for use by or in conjunction with an instruction execution system, apparatus, or device. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. Machine-readable media can include, but are 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 machine-readable 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.
[0157] According to one or more embodiments of this application, [Example 1] provides a display interaction method, the method comprising:
[0158] In response to a zoom trigger operation in the first area of the page, the first display position corresponding to the zoom trigger operation on the displayed coordinate axis is obtained, and the first display position is converted into a target coordinate axis value;
[0159] The original coordinate axis value range is enlarged or reduced to obtain the scaled coordinate axis value range;
[0160] Obtain the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values;
[0161] Calculate the positional deviation between the first display position and the second display position;
[0162] Based on the positional deviation, the range of scaled coordinate axis values is horizontally offset to generate a first offset coordinate axis value range.
[0163] The coordinate axes are then re-displayed according to the numerical range of the first offset coordinate axis.
[0164] According to one or more embodiments of this application, [Example 2] provides a display interaction method, wherein scaling up or down the original coordinate axis value range to obtain a scaled coordinate axis value range includes:
[0165] When the scaling trigger operation is a zoom-in operation, the left boundary value of the original coordinate axis value range is multiplied by a first coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by a second coefficient to obtain the right boundary value of the scaled coordinate axis value range. The first coefficient is greater than 1, and the second coefficient is less than 1.
[0166] When the scaling trigger operation is a shrinking operation, the left boundary value of the original coordinate axis value range is multiplied by a third coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by a fourth coefficient to obtain the right boundary value of the scaled coordinate axis value range. The third coefficient is less than 1, and the fourth coefficient is greater than 1.
[0167] According to one or more embodiments of this application, [Example 3] provides a display interaction method, the method further comprising:
[0168] In response to a horizontal movement trigger operation within the first or second area of the page, the original coordinate axis value range of the coordinate axis is horizontally offset to generate a second offset coordinate axis value range.
[0169] The coordinate axes are then re-displayed according to the second offset coordinate axis value range.
[0170] According to one or more embodiments of this application, [Example 4] provides a display interaction method, wherein the coordinate axis is a time coordinate axis, and the coordinate axis value range of the time coordinate axis corresponds to a time range, and the method further includes:
[0171] As the coordinate axis is redisplayed, the bar charts corresponding to the displayed event statistics are redisplayed. Each bar chart corresponds to event statistics of the same event type. Each bar chart includes at least one bar structure. The starting point of the bar structure corresponds to the start time in the event statistics and is aligned with the corresponding time in the time coordinate axis. The ending point of the bar structure corresponds to the end time in the event statistics and is aligned with the corresponding time in the time coordinate axis. The height of the bar structure corresponds to the total number of events in the event statistics.
[0172] According to one or more embodiments of this application, [Example 5] provides a display interaction method, wherein the coordinate axis is a time coordinate axis, and the coordinate axis value range of the time coordinate axis corresponds to a time range, and the method further includes:
[0173] As the coordinate axis is redisplayed, the event timeline corresponding to the displayed event information is also redisplayed. The time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time indicated by the event timeline.
[0174] According to one or more embodiments of this application, [Example Six] provides a display interaction method in which event nodes are displayed on an event timeline, and the display position of the event nodes corresponds to the event occurrence time in the event information.
[0175] According to one or more embodiments of this application, [Example Seven] provides a display interaction method, the method further comprising:
[0176] In response to a vertical movement trigger operation within the second area of the page, the vertical display position of the event timeline is vertically offset, and the vertical display position of the event timeline is redefined.
[0177] The event timeline is re-displayed according to its vertical display position.
[0178] According to one or more embodiments of this application, [Example Eight] provides a display interaction device, the device comprising:
[0179] The first acquisition unit is used to respond to a zoom trigger operation in the first area of the page, acquire the first display position corresponding to the zoom trigger operation on the display coordinate axis, and convert the first display position into a target coordinate axis value.
[0180] The scaling unit is used to enlarge or reduce the original coordinate axis value range to obtain the scaled coordinate axis value range.
[0181] The second acquisition unit is used to acquire the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values;
[0182] The calculation unit is used to calculate the positional deviation between the first display position and the second display position;
[0183] The first generation unit is used to horizontally offset the range of scaled coordinate axis values according to the position deviation, and generate a first offset coordinate axis value range.
[0184] The first display unit is used to re-display the coordinate axis according to the numerical range of the first offset coordinate axis.
[0185] According to one or more embodiments of this application, [Example Nine] provides a display interaction device, wherein the scaling unit includes:
[0186] The magnification subunit is used to, when the scaling trigger operation is a magnification operation, multiply the left boundary value of the original coordinate axis value range of the coordinate axis by a first coefficient to obtain the left boundary value of the scaled coordinate axis value range, and multiply the right boundary value of the original coordinate axis value range of the coordinate axis by a second coefficient to obtain the right boundary value of the scaled coordinate axis value range, wherein the first coefficient is greater than 1 and the second coefficient is less than 1.
[0187] The shrinking subunit is used to, when the scaling trigger operation is a shrinking operation, multiply the left boundary value of the original coordinate axis value range of the coordinate axis by a third coefficient to obtain the left boundary value of the scaled coordinate axis value range, and multiply the right boundary value of the original coordinate axis value range of the coordinate axis by a fourth coefficient to obtain the right boundary value of the scaled coordinate axis value range, wherein the third coefficient is less than 1 and the fourth coefficient is greater than 1.
[0188] According to one or more embodiments of this application, [Example 10] provides a display interaction device, the device further comprising:
[0189] The second generation unit is used to respond to a horizontal movement trigger operation in the first area or the second area of the page, and to horizontally offset the original coordinate axis value range of the coordinate axis to generate a second offset coordinate axis value range.
[0190] The second display unit is used to re-display the coordinate axis according to the numerical range of the second offset coordinate axis.
[0191] According to one or more embodiments of this application, [Example 11] provides a display interaction device, wherein the coordinate axis is a time coordinate axis, and the coordinate axis value range of the time coordinate axis corresponds to a time range, and the device further includes:
[0192] The third display unit is used to redisplay the bar charts corresponding to the displayed event statistics information as the coordinate axis is redisplayed. Each bar chart corresponds to event statistics information of the same event type. The bar chart includes at least one bar structure. The starting point of the bar structure corresponds to the start time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The ending point of the bar structure corresponds to the end time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The height of the bar structure corresponds to the total number of events in the event statistics information.
[0193] According to one or more embodiments of this application, [Example Twelve] provides a display interaction device, wherein the coordinate axis is a time coordinate axis, and the coordinate axis value range of the time coordinate axis corresponds to a time range, and the device further includes:
[0194] The fourth display unit is used to redisplay the event timeline corresponding to the displayed event information as the coordinate axis is redisplayed. The time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time indicated by the event timeline.
[0195] According to one or more embodiments of this application, [Example Thirteen] provides a display interaction device in which event nodes are displayed on an event timeline, and the display position of the event nodes corresponds to the event occurrence time in the event information.
[0196] According to one or more embodiments of this application, [Example Fourteen] provides a display interaction device, the device further comprising:
[0197] The determining unit is configured to, in response to a vertical movement trigger operation within the second area of the page, vertically offset the vertical display position of the event timeline and redetermine the vertical display position of the event timeline.
[0198] The fifth display unit is used to re-display the event timeline according to its vertical display position.
[0199] According to one or more embodiments of this application, Example 15 provides a display interaction device, including: 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 the display interaction method as described in any one of Examples 1 to 7.
[0200] According to one or more embodiments of this application, [Example Example] provides a computer-readable storage medium storing instructions that, when executed on a terminal device, cause the terminal device to perform the display interaction method as described in any one of [Example 1] to [Example 7].
[0201] It should be noted that the various embodiments in this specification are described in a progressive manner, with each embodiment focusing on the differences from other embodiments. Similar or identical parts between embodiments can be referred to interchangeably. For the systems or apparatus disclosed in the embodiments, since they correspond to the methods disclosed in the embodiments, the descriptions are relatively simple, and relevant parts can be referred to the method section.
[0202] It should be understood that in this application, "at least one (item)" means one or more, and "more than" means two or more. "And / or" is used to describe the relationship between related objects, indicating that three relationships can exist. For example, "A and / or B" can represent three cases: only A exists, only B exists, and both A and B exist simultaneously, where A and B can be singular or plural. The character " / " generally indicates that the preceding and following related objects are in an "or" relationship. "At least one (item) of the following" or similar expressions refer to any combination of these items, including any combination of single or plural items. For example, at least one (item) of a, b, or c can represent: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, and c can be single or multiple.
[0203] It should also be noted that, in this document, relational terms such as "first" and "second" are used only to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.
[0204] The steps of the methods or algorithms described in conjunction with the embodiments disclosed herein can be implemented directly by hardware, a software module executed by a processor, or a combination of both. The software module can be located in random access memory (RAM), main memory, read-only memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, hard disk, removable disk, CD-ROM, or any other form of storage medium known in the art.
[0205] The above description of the disclosed embodiments enables those skilled in the art to make or use this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features disclosed herein.
Claims
1. A display interaction method, characterized in that, The method includes: Obtain user event information, which includes user information and the time of event occurrence; The display position of the event timeline corresponding to the user is determined based on the user information; Based on the event occurrence time in the event information of the target user, determine the display position of the event node on the event timeline corresponding to the target user; the target user can be any one of the users. Trigger the display of the time axis; Based on the display position of the event timeline and the display position of the event node, the event timeline and event node corresponding to the user are triggered for display; the time coordinate axis is parallel to the event timeline, and the time coordinate axis corresponds to the time marked by the event timeline; In response to a zoom trigger operation within the first area of the page, the first display position corresponding to the zoom trigger operation on the displayed time coordinate axis is obtained, and the first display position is converted into a target coordinate axis value; the range of coordinate axis values corresponds to the range of time. The original coordinate axis value range of the time coordinate axis is enlarged or reduced to obtain the scaled coordinate axis value range; Obtain the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values; Calculate the positional deviation between the first display position and the second display position; Based on the positional deviation, the range of scaled coordinate axis values is horizontally offset to generate a first offset coordinate axis value range. The coordinate axes are re-displayed according to the numerical range of the first offset coordinate axis; As the coordinate axis is redisplayed, the event timeline corresponding to the displayed event information is redisplayed, and the bar charts corresponding to the displayed event statistics are redisplayed. Each bar chart corresponds to event statistics of the same event type. Each bar chart includes at least one bar structure. The starting point of the bar structure corresponds to the start time in the event statistics and is aligned with the corresponding time in the time coordinate axis. The ending point of the bar structure corresponds to the end time in the event statistics and is aligned with the corresponding time in the time coordinate axis. The height of the bar structure corresponds to the total number of events in the event statistics.
2. The method according to claim 1, characterized in that, The process of scaling up or down the original coordinate axis value range to obtain the scaled coordinate axis value range includes: When the scaling trigger operation is a zoom-in operation, the left boundary value of the original coordinate axis value range is multiplied by a first coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by a second coefficient to obtain the right boundary value of the scaled coordinate axis value range. The first coefficient is greater than 1, and the second coefficient is less than 1. When the scaling trigger operation is a shrinking operation, the left boundary value of the original coordinate axis value range is multiplied by a third coefficient to obtain the left boundary value of the scaled coordinate axis value range, and the right boundary value of the original coordinate axis value range is multiplied by a fourth coefficient to obtain the right boundary value of the scaled coordinate axis value range. The third coefficient is less than 1, and the fourth coefficient is greater than 1.
3. The method according to claim 1, characterized in that, The method further includes: In response to a horizontal movement trigger operation within the first or second area of the page, the original coordinate axis value range of the coordinate axis is horizontally offset to generate a second offset coordinate axis value range. The coordinate axes are then re-displayed according to the second offset coordinate axis value range.
4. The method according to claim 1, characterized in that, Event nodes are displayed on the event timeline, and the display position of the event node corresponds to the event occurrence time in the event information.
5. The method according to claim 1, characterized in that, The method further includes: In response to a vertical movement trigger operation within the second area of the page, the vertical display position of the event timeline is vertically offset, and the vertical display position of the event timeline is redefined. The event timeline is re-displayed according to its vertical display position.
6. A display interaction device, characterized in that, The device includes: A first display unit is configured to acquire user event information, including user information and event occurrence time; determine the display position of the event timeline corresponding to the user based on the user information; determine the display position of an event node on the event timeline corresponding to the target user based on the event occurrence time in the target user's event information; the target user can be any one of the users; trigger the display of a time coordinate axis; and trigger the display of the event timeline and event node corresponding to the user based on the display position of the event timeline and the display position of the event node; the time coordinate axis is parallel to the event timeline and corresponds to the time indicated by the event timeline. The first acquisition unit is configured to, in response to a zoom trigger operation in a first area of the page, acquire the first display position corresponding to the zoom trigger operation on the displayed time coordinate axis, and convert the first display position into a target coordinate axis value; the range of coordinate axis values of the time coordinate axis corresponds to the range of time. The scaling unit is used to enlarge or reduce the original coordinate axis value range of the time coordinate axis to obtain the scaled coordinate axis value range. The second acquisition unit is used to acquire the second display position corresponding to the target coordinate axis value within the range of the scaled coordinate axis values; The calculation unit is used to calculate the positional deviation between the first display position and the second display position; The first generation unit is used to horizontally offset the range of scaled coordinate axis values according to the position deviation, and generate a first offset coordinate axis value range. The first display unit is also configured to re-display the time axis according to the numerical range of the first offset coordinate axis; The fourth display unit is used to redisplay the event timeline corresponding to the displayed event information and the bar chart corresponding to the displayed event statistics information as the coordinate axis is redisplayed. Each bar chart corresponds to the event statistics information of the same event type. The bar chart includes at least one bar structure. The starting point of the bar structure corresponds to the start time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The ending point of the bar structure corresponds to the end time in the event statistics information and is aligned with the corresponding time in the time coordinate axis. The height of the bar structure corresponds to the total number of events in the event statistics information.
7. A display interaction 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 the display interaction method as described in any one of claims 1-5.
8. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores instructions that, when executed on a terminal device, cause the terminal device to perform the display interaction method as described in any one of claims 1-5.
Citation Information
Patent Citations
Method and system for zooming map, terminal and computer equipment
CN112801869A