WO2016192546A1

WO2016192546A1 - Method and device for updating data point of dynamic curve

Info

Publication number: WO2016192546A1
Application number: PCT/CN2016/083083
Authority: WO
Inventors: 黄淞
Original assignee: 阿里巴巴集团控股有限公司
Priority date: 2015-06-01
Filing date: 2016-05-24
Publication date: 2016-12-08
Also published as: CN106294463B; CN106294463A

Abstract

The object of the present application is to provide a method and device for updating a data point of a dynamic curve. The method specifically comprises: at each update moment, if there is a data point on a currently displayed dynamic curve, acquiring a first data point of a previous update moment in the data point; generating a second data point according to data at a current update moment in a data source; and when the second data point and the first data point belong to the same data cycle, eliminating the first data point at a display location of the data cycle and displaying the second data point. Compared with the prior art, a data point of the latest recent update moment on a curve can be acquired and then is compared with a data point generated at a current update moment; if the two data points belong to the same data cycle, the newly generated data point is replaced with the original data point, thereby realizing the continuous updating and displaying of the data point in a data cycle, so that information such as an accumulated amount of a certain piece of data in a certain cycle, etc. can be displayed more intuitively.

Description

Method and device for updating data point of dynamic curve

The present application claims the priority of the Chinese Patent Application No. 201510293409.1, the disclosure of which is incorporated herein by reference. .

Technical field

The present application relates to the field of computers, and in particular to a data point update technique for a dynamic curve.

Background technique

With the development of the Internet, more and more data service products are being introduced to the market. These products often require the development of real-time reports, and users can visually view various types of data while browsing the graphs in these reports through a web browser. In order to better reflect the real-time nature of the data, it is common practice to dynamically update the graph so that users can keep abreast of changes in the data. At present, the commonly used dynamic curve is in the form of: data points representing stock prices at a certain moment and connecting lines connecting the data points, and each data point is not updated once generated, such as a stock market curve. Since the data points are not updated as soon as they are generated, it is not conducive to intuitively displaying the accumulated amount in a certain data period. For example, if the user needs to check the accumulated amount of a certain data within one hour, then the above curve cannot be obtained intuitively. a message.

Summary of the invention

It is an object of the present application to provide a method and apparatus for updating data points of a dynamic curve so that a user can intuitively obtain information.

To achieve the above objective, the present application provides a data point update method for a dynamic curve, the method comprising:

At each update time, if there is a data point in the currently displayed dynamic curve, the first data point of the previous update time in the data point is acquired;

Generating a second data point according to data of a current update time in the data source;

When the second data point and the first data point belong to the same data period, the first data point is cleared and the second data point is displayed at a display position of the data period.

Further, generating the second data point according to the data of the current update time in the data source, including:

Obtaining data of the current update time asynchronously from the data source according to the pre-configured path;

Generating a second data point according to the data of the current update time.

Further, after acquiring the first data point of the previous update time in the data point, the method further includes:

The first data point is highlighted.

Further, after generating the second data point according to the data of the current update time in the data source, the method further includes:

When the second data point and the first data point do not belong to the same data period, the second data point is displayed at a display position of a data period corresponding to the second data point.

When the second data point and the first data point do not belong to the same data period, the highlighting of the first data point is cancelled, and the display position of the data period corresponding to the second data point is displayed. The second data point is described.

Further, before the displaying the second data point in the display position of the data period corresponding to the second data point, the method further includes:

Determining whether the emptying condition is satisfied. If the emptying condition is met, the starting position of the currently displayed dynamic curve is used as the display position of the data period corresponding to the second data point, and the currently displayed dynamic curve is cleared.

Further, the clearing the currently displayed dynamic curve includes:

Saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the currently displayed dynamic curve;

After saving the currently displayed dynamic curve as a historical dynamic curve and clearing the currently displayed dynamic curve, the method further includes:

When the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed;

Suspending updates to the data points at subsequent update times.

Further, when the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed, including:

When the switching operation is acquired, the currently displayed dynamic curve is saved as a first dynamic curve according to the switching operation, and the currently displayed dynamic curve is cleared, and the historical dynamic curve is displayed;

After suspending the update of the data point at the time of subsequent update, the method further includes:

When the recovery operation is acquired, the currently displayed historical dynamic curve is cleared according to the recovery operation, and the first dynamic curve is displayed;

The update of the data points is resumed at a subsequent update time.

Further, after the displaying the second data point in the display position of the data period corresponding to the second data point, the method further includes:

Generating and displaying a connection between the first data point and the second data point.

Further, the method further includes:

Detecting a location of a user operation point, and when the user operation point coincides with the data point, displaying data corresponding to the data point at a location of the user operation point.

The present application also provides another method for updating data points of a dynamic curve, the method comprising:

Obtaining a real-time component for generating the dynamic curve;

Writing configuration information to the real-time component;

Initializing the real-time component, and performing the above method according to configuration information of the real-time component.

Further, the real-time component includes a graphic display unit and a function calling unit;

Initializing the real-time component, and performing any one of the foregoing methods according to the configuration information of the real-time component, including:

Generating data of the initial data point by the function calling unit according to the configuration information, and generating a dynamic curve including the initial data point, the graphic display unit generating a display area and displaying the dynamic curve in the display area;

The graphic display unit and the function invoking unit perform any of the foregoing methods to update data points in the dynamic curve.

Further, the configuration information includes display parameter information and call parameter information;

Generating data of the initial data point by the function calling unit according to the configuration information, and generating a dynamic curve including the initial data point, generating a display area by the graphic display unit and displaying the dynamic curve in the display area, including :

The function invoking unit acquires data for generating an initial data point according to the invoking parameter information, and generates a dynamic curve including the initial data point, and the graphic display unit generates a display area according to the display parameter information and displays the display area The dynamic curve is displayed in the area.

According to another aspect of the present application, there is also provided a dynamic curve data point update device, wherein the device comprises:

a first device, configured to acquire, at each update time, a first data point of a previous update time in the data point if a data point exists in the currently displayed dynamic curve;

a second device, configured to generate a second data point according to data of a current update time in the data source;

And a third device, configured to: when the second data point and the first data point belong to the same data period, clear the first data point and display the second data point at a display position of the data period.

Further, the second device includes:

a second module, configured to asynchronously acquire data of a current update time from a data source according to a pre-configured path;

And a second module, configured to generate a second data point according to the data of the current update time.

Further, the first device is further configured to:

After acquiring the first data point of the previous update time in the data point, the first data point is highlighted.

Further, the device further includes:

And a fourth device, configured to: when the second data point and the first data point do not belong to the same data period, display the second data point at a display position of a data period corresponding to the second data point.

Further, the fourth device is further configured to:

Further, the device further includes:

a fifth device, configured to determine whether the clearing condition is met before the second data point is displayed at a display position of the data period corresponding to the second data point, and if the clearing condition is met, the currently displayed dynamic curve is The starting position is used as a display position of the data period corresponding to the second data point, and the currently displayed dynamic curve is cleared.

Further, the fifth device is configured to save the currently displayed dynamic curve as a historical dynamic curve, and clear the currently displayed dynamic curve;

The device also includes a sixth device, the sixth device comprising:

a sixth module, configured to: after saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the currently displayed dynamic curve, when acquiring the switching operation, clearing the currently displayed dynamic curve according to the switching operation Displaying the historical dynamic curve;

The sixth module is configured to suspend updating the data point at a subsequent update time.

Further, the sixth module is configured to:

After saving the currently displayed dynamic curve as a historical dynamic curve and clearing the currently displayed dynamic curve, when the switching operation is acquired, the currently displayed dynamic curve is saved as the first dynamic according to the switching operation. Curve and clear the currently displayed dynamic curve to display the historical dynamic curve;

The sixth device further includes:

a sixth module, configured to: after the update of the data point is paused at a time of suspending the subsequent update, when the recovery operation is acquired, clear the currently displayed historical dynamic curve according to the recovery operation, and display the first dynamic Curve

The sixth four module is configured to restore the update of the data point at a subsequent update time.

Further, the device further includes:

a seventh device, configured to generate and display a connection between the first data point and the second data point after displaying the second data point at a display position of a data period corresponding to the second data point .

Further, the device further includes:

The eighth device is configured to detect a location of the user operation point, and when the user operation point coincides with the data point, display data corresponding to the data point at the location of the user operation point.

The present application also provides another dynamic curve data point updating device, the device comprising:

a ninth device, configured to acquire a real-time component for generating the dynamic curve;

a tenth device, configured to write configuration information to the real-time component;

The eleventh device is configured to initialize the real-time component, and control the operation of any one of the foregoing devices according to the configuration information of the real-time component.

The eleventh device is configured to:

Determining, according to the configuration information, the function invoking unit to acquire data of the initial data point, and generating a dynamic curve including the initial data point, instructing the graphic display unit to generate a display area and displaying the dynamic curve in the display area;

Instructing the graphic display unit and the function calling unit to control any one of the foregoing devices to perform updating of data points in the dynamic curve.

The eleventh device is configured to:

Instructing the function invoking unit to acquire data for generating an initial data point according to the invoking parameter information, and generating a dynamic curve including the initial data point, instructing the graphic display unit to generate a display area according to the display parameter information and Displaying the dynamic curve in the display area;

Compared with the prior art, the technical solution provided by the present application can acquire the data points of the latest update time on the curve, and then compare with the data points generated by the current update time. If they belong to the same data cycle, the newly generated data will be newly generated. The data points replace the original data points, so that the data points are continuously updated and displayed in one data period, and the information such as the accumulated amount of a certain data in a certain period can be more intuitively displayed. In addition, the present application provides In another solution, the real-time component only needs to write a small amount of code, such as some custom configuration information, etc., to realize the function of updating the data point. Since most of the program code adopts a modular form, the code can be improved. Readability and maintainability reduce the developer's reliance on programming knowledge and improve development efficiency.

DRAWINGS

Other features, objects, and advantages of the present application will become more apparent from the detailed description of the accompanying drawings.

1 is a flowchart of a method for updating a data point of a first dynamic curve according to an embodiment of the present application;

2 is a processing flowchart of step S102 in the data point updating method of the first dynamic curve;

3(a) to 3(b) are schematic diagrams showing display effects when data points are updated;

4 is a flowchart of a method for updating a data point of a second dynamic curve according to an embodiment of the present application;

FIG. 5 is a flowchart of a method for updating a data point of a third dynamic curve according to an embodiment of the present application;

6 is a schematic diagram of a dynamic curve chart involved in an embodiment of the present application;

Figure 7 is a flowchart of initialization of a real-time component;

FIG. 8 is a flowchart of monitoring a listener of an arrow in a real-time component initialization process;

FIG. 9 is a schematic structural diagram of a data point update device of a first dynamic curve according to an embodiment of the present disclosure;

10 is a schematic structural diagram of a second device in a data point updating device of a dynamic curve;

FIG. 11 is a schematic structural diagram of a data point update device of a second dynamic curve according to an embodiment of the present disclosure;

12 is a schematic structural diagram of a data point update device of a third dynamic curve according to an embodiment of the present application;

FIG. 13 is a schematic structural diagram of a fourth dynamic curve data point updating device according to an embodiment of the present disclosure;

FIG. 14 is a schematic diagram of a preferred structure of a sixth device in a data point updating device of a dynamic curve according to an embodiment of the present disclosure;

15 is a schematic structural diagram of a fifth dynamic curve data point updating device according to an embodiment of the present application;

16 is a schematic structural diagram of a sixth dynamic curve data point updating device according to an embodiment of the present disclosure;

FIG. 17 is a schematic structural diagram of a data point update device of a seventh dynamic curve according to an embodiment of the present disclosure;

The same or similar reference numerals in the drawings denote the same or similar components.

detailed description

The present application is further described in detail below with reference to the accompanying drawings.

In a typical configuration of the present application, the terminal, the device of the service network, and the trusted party each include one or more Processor (CPU), input/output interface, network interface, and memory.

The memory may include non-persistent memory, random access memory (RAM), and/or non-volatile memory in a computer readable medium, such as read only memory (ROM) or flash memory. Memory is an example of a computer readable medium.

Computer readable media includes both permanent and non-persistent, removable and non-removable media. Information storage can be implemented by any method or technology. The information can be computer readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read only memory. (ROM), electrically erasable programmable read only memory (EEPROM), flash memory or other memory technology, compact disk read only memory (CD-ROM), digital versatile disk (DVD) or other optical storage, A magnetic tape cartridge, magnetic tape storage or other magnetic storage device or any other non-transportable medium that can be used to store information that can be accessed by a computing device. As defined herein, computer readable media does not include non-transitory computer readable media, such as modulated data signals and carrier waves.

FIG. 1 is a flowchart of a method for updating a data point of a dynamic curve according to an embodiment of the present application, where the method specifically includes the following steps:

Step S101, at each update time, if there is a data point in the currently displayed dynamic curve, acquiring a first data point of the previous update time in the data point;

Step S102, generating a second data point according to data of a current update time in the data source;

Step S103, when the second data point and the first data point belong to the same data period, clear the first data point and display the second data point at a display position of the data period.

Here, those skilled in the art should understand that the first data point and the second data point are respectively used to refer to specific data points of each stage in the dynamic curve updating process. For example, the first data point updates the displayed data point for the previous update time, and the second data point is the data point generated for the current update time and is about to be updated. At the next update time, the second data point at the time of this update becomes the first data point at the time of the next update.

The technical solution provided by the present application acquires the data points updated at the latest update time on the curve, and then compares the data points generated at the current update time. If the two data points belong to the same data period, the newly generated data points will be generated. Replacing the original data points, so that the data points are continuously updated in one data cycle, thereby providing a data presentation manner different from the existing dynamic curves, which can more intuitively display, for example, the accumulation of a certain data in a certain period. Quantity and other information.

In this embodiment, the data period may be set to different durations according to actual requirements, for example, set to one. Hours, fifteen minutes, etc. There are a plurality of update times in each data cycle. Each time the update time is performed, the above steps S101 to S103 are performed to complete the update of the data points. Similarly, the interval of the update time may also be set according to actual needs, such as a user. The real-time requirements of the data are high, so the interval of the update time can be set to be shorter, such as 1 second. In a practical application, the trigger of each update time can be implemented by using a timer, and the trigger interval of the timer logic is set to 1 second. Each time the trigger is performed: the data point update of step S101 to step S103 is performed once. Here, those skilled in the art should be able to understand that the above description about the data period, the interval of the update time, and the trigger of each update time are merely examples, and other existing or future possible manners may be applied to the present application as well. It is intended to be included within the scope of this application and is hereby incorporated by reference.

Here, the dynamic curve consists of data points and connections between adjacent two data points, wherein each data point (including the first data point and the second data point) represents data within a corresponding data period. For example, in an application scenario, the data points on the dynamic curve are used to indicate the number of newly registered users in an hour, and the data points are updated every second, so each hour is a data. Cycles, such as 12:00:01 to 13:00:00, 13:00:01 to 14:00:00, 14:00:01 to 15:00:00, etc., where the X and Y coordinates of the dynamic curve The axes can represent the time and the number of newly registered users, respectively. In this embodiment, the definition of 12:00:01 to 13:00:00 is data cycle A, 13:00:01 to 14:00:00 is data cycle B, 14:00:01 to 15:00:00 For the data period C, wherein the display position of the data period is a specific position on the X coordinate axis of the dynamic curve, for example, the display positions of the data periods A to C can be respectively set to 13:00:00, 14 on the X coordinate axis. : 00:00, 15:00:00 location. If the current time is 13:15:16, then the data point at 13:00:00 indicates 12:00:01~13:00:00, the number of newly registered users, since the current time has passed 13:00:00 , then the data point has not been updated, and the data point at 14:00:00 indicates the number of new users in the 13:00:01 to the previous update time (ie 13:15:15), the data point is Is the first data point mentioned above. Assume that there are already 5,000 newly registered users between 13:00:01 and 13:15:15, and there are 3 newly registered users in the 13:15:16 second, then the second data point indicates new The number of registered users is 5003. Since 13:15:15 and 13:15:16 belong to the data period B, the first data point (14:00:00, 5000) at the display position of the data period B is cleared, and the second data is displayed. Point (14:00:00, 5003), thus completing the update of the data points.

For data at an update time in the data source, when data points are generated according to the data, the data may be processed to a certain extent, for example, by filtering to screen out some potentially inaccurate data. For example, in the application scenario of the above example, the physical address of the device used by the user can be filtered. For example, the user registers five accounts with the terminal of the same physical address, and when the data point is generated, the five registrations can be performed according to the physical address. The information is filtered, and only one user is newly registered, thereby ensuring the accuracy of the data represented by the data points. Here, those skilled in the art should understand that the above description about data processing is merely an example, other existing or future may occur. The manner in which the data is processed, as applicable to the present application, is also included in the scope of the present application and is hereby incorporated by reference.

Preferably, the method for generating the second data point according to the data of the current update time in the data source in step S102 can be implemented by using the processing flow shown in FIG. 2, and the specific steps include:

S201. Acquire, according to the pre-configured path, the data of the current update time by the data source asynchronously;

S202. Generate a second data point according to the data of the current update time.

Wherein, in the graph of the dynamic curve through the webpage display scenario, the asynchronous acquisition may adopt AJAX (Asynchronous Javascript And XML, asynchronous Javascript and XML technology). The AJAX is a technology for creating a fast dynamic webpage, which can exchange certain parts of a webpage (ie, data points that need to be updated) without reloading the entire webpage by performing a small amount of data exchange with the server in the background of the browser. ) Updates to speed up data point updates.

In order to enable the user to view the update of the data point more intuitively, after acquiring the first data point of the previous update time in the data point in step S101, the method further includes highlighting the first data point. Here, the manner of highlighting includes, but is not limited to, zooming in, changing the color of the data point, changing the transparency of the data point, adding a border, and the like. Taking the enlarged display as an example, the actual display effect of the first data point 3A in step S101 is as shown in FIG. 3(a), when the first data point 3A is cleared and the second is displayed at the display position of the data cycle. After the data point 3B, since the second data point 3B is not highlighted, the second data point 3B is displayed as a normal size, as shown in FIG. 3(b), and the data is enlarged and displayed normally throughout the process. The change process of the point presents a flickering effect, which makes the dynamic effect of the data point update more intuitive and convenient for the user to view. Herein, those skilled in the art should understand that the above description about the highlighting is only an example, and other existing or future possible highlighting manners, as applicable to the present application, are also included in the protection scope of the present application. It is hereby incorporated by reference.

The data point update method of the preferred dynamic curve is also provided in the embodiment of the present application, because the second data point and the first data point do not belong to the same data period. The processing flow is shown in Figure 4, specifically including:

Step S103, when the second data point and the first data point belong to the same data period, clearing the first data point and displaying the second data point at a display position of the data period;

Step S104, when the second data point and the first data point do not belong to the same data period, in the The display position of the data period corresponding to the two data points displays the second data point.

As shown in FIG. 1, after the method generates the second data point according to the data of the current update time in the data source, if it is determined that the second data point and the first data point do not belong to the same data period, The display position of the data period corresponding to the second data point displays the second data point, that is, the first data point is not updated, but a new data point is newly inserted in the dynamic curve. For example, the current time is 14:00:01, and the generated second data point at the update time belongs to the data period C (14:00:01 to 15:00:00), and the first data point generated by the previous update time Then, in the data period B (13:00:01 to 14:00:00), the display position of the data period corresponding to the second data point is the position of 15:00:00 on the X coordinate axis, thereby the current update time. The first data point at the 14:00:00 position will not be cleared, but the second data point will be displayed directly at the 15:00:00 position. At the subsequent update time 14:00:02 to 15:00:00, since the data points generated by them all belong to the same data cycle C, the steps described in step S103 are performed, and the new data points are no longer inserted, but Is to update the original data points;

After the first data point of the previous update time in the data point is obtained in step S101, the first data point is highlighted. Accordingly, the step S104 may specifically include: when the second When the data point and the first data point do not belong to the same data period, the highlighting of the first data point is cancelled, and the second data point is displayed at a display position of the data period corresponding to the second data point. . Taking the above-mentioned enlarged highlighting method as an example, the first data of the previous data period is canceled immediately after being enlarged, forming a flickering effect, and the second data point is normally displayed at the display position of the current data period, so that the user can clearly know. The data has been entered for the next data cycle, and the data of the previous data cycle is no longer updated.

Further, the embodiment of the present application further provides a data point update method of a more preferred dynamic curve, where the method further includes before the displaying the second data point in the display position of the data period corresponding to the second data point. And determining whether the clearing condition is met. If the clearing condition is met, the starting position of the currently displayed dynamic curve is used as the display position of the data period corresponding to the second data point, and the currently displayed dynamic curve is cleared.

The clearing condition may be set according to requirements in an actual application. For example, the clearing condition may be that the current time reaches 00:00:01 of the next day, and the starting position of the currently displayed dynamic curve is the first day. The position of 00:00:01, that is, the dynamic curve only shows the data of one day, and the curve is automatically cleared at the beginning of the next day, and the drawing is restarted. The emptying period can be set according to actual needs, and can be set to 4 hours, 12 hours, etc. in addition to the aforementioned 24 hours.

In addition, the emptying condition may also be some specific operations input by the user, such as switching operation of viewing historical curve data. In this case, because the historical curve data needs to be acquired, the foregoing clearing the currently displayed dynamic curve specifically includes: saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the current display. Dynamic curve. At this time, when the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and then the saved historical dynamic curve is displayed. The switching operations include, but are not limited to, a click or slide operation of the operating point at a specific location, a textual instruction input through the interactive interface, and the like. For example, a left arrow button can be set on the left side of the graph interface of the dynamic curve. When the user's operation point clicks the left arrow, it is a switching operation, and once clicked, it switches to the dynamic curve of the previous day; for example, the switching operation is Slide to the left in the chart area of the dynamic curve, slide once to switch to the dynamic curve of the previous day or switch to different historical dynamic curves according to the sliding distance; for example, enter the number of the historical dynamic curve in the provided interactive interface. You can switch to the corresponding historical dynamic curve. Herein, those skilled in the art should understand that the above description about the handover operation is only an example, and other existing or future possible handover operations, as applicable to the present application, are also included in the scope of protection of the present application, and This is hereby incorporated by reference.

The current displayed dynamic curve is saved as a historical dynamic curve, including but not limited to the following manner: only information of each data point in the historical dynamic curve is saved, or information of each data point and the connection between the data points is saved. Wait. If only the information of each data point in the historical dynamic curve is saved, the specific steps of displaying the historical dynamic curve are as follows: First, each data point is generated and displayed according to the saved information, and then a connection between the data points is generated and displayed according to the data point. To show the complete dynamic curve. Of course, in order to ensure that data points and connections can be displayed simultaneously, data points and their connections can be displayed simultaneously after data points and connections are generated based on the saved information. If you save each data point and the information of the connection between the data points at the same time, you only need to obtain the information and generate and display it based on the information. Herein, those skilled in the art should understand that the above description about the preservation history dynamic curve is only an example, and other existing or future possible storage methods, as applicable to the present application, should also be included in the scope of protection of the present application. It is hereby incorporated by reference.

Since the curve displayed after the switching operation is a historical dynamic curve, the data points of the dynamic curve of the current time need not be updated after the update time is reached, so after the historical dynamic curve is displayed, the subsequent update time is suspended. The update of the data points. Here, the update refers only to the update of the data point displayed in the dynamic curve, but the data record is not stopped in the data source. For example, the application scenario of the number of newly registered users in an hour is taken as an example. Assume that the data of the historical dynamic curve and the number of newly registered users in the data source are saved in the cloud server, and the dynamic curve is passed. The browser on the update device displays that the information of the number of newly registered users is sent to the server by the mobile terminal on which the application is installed and saved in the data source. At the current time of 13:15:16, if the update device obtains the switching operation of the user input, the update device will clear the currently displayed dynamic curve, and according to the configured path information, the saved historical dynamic curve will be obtained by the server and browsed. This historical dynamic curve is displayed in the device. At this point, the mobile terminal with the application installed will still send a new registration to the server. The number of households, for example, between 13:00:01 and 13:15:15, there are already 5,000 newly registered users, and the newly registered users are in the period of 13:15:16 to 13:16:11. With an increase of 20 people, the data source will still receive this information and save it so that the update device can still get the latest data when it needs to be updated, but the dynamic curve displayed at this time will not change.

Further, when the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed, including: when the switching operation is acquired, the currently displayed dynamic according to the switching operation The curve is saved as a first dynamic curve, and the currently displayed dynamic curve is cleared, and the historical dynamic curve is displayed. After the update of the data point is performed, the method further includes: when the recovery operation is acquired, clearing the currently displayed historical dynamic curve according to the recovery operation, displaying the first dynamic curve; and recovering The update of the data points is performed at a subsequent update time.

In the above manner, if the user wants to continue to view the dynamic curve of the current time after switching to the historical dynamic curve, it can be conveniently implemented by the recovery operation. Corresponding to the switching operation, the recovery operation includes, but is not limited to, a click or slide operation of the operation point at a specific position, a text instruction input through the interactive interface, and the like. For example, click the operation of the right arrow, swipe right in the chart area of the dynamic curve, or enter the number of the first dynamic curve. In the above example, when the current time is 13:16:12, the recovery operation input by the user is obtained, and the update device clears the currently displayed historical dynamic curve according to the recovery operation, and displays the first dynamic in the browser. The curve, while recovering the update of the data points at the time of subsequent update. Since the data point displayed by the first dynamic curve is 13:15:15 updated data point (14:00:00,5000), 13:16:12 when switching to the historical dynamic curve (ie 13:15:16) The update of the data point is resumed at a subsequent update time. If there is another newly registered user in 13:16:12, the data points in the data cycle will be updated to (14:00:00, 5021).

Preferably, after displaying the second data point in the display position of the data period corresponding to the second data point, the method further includes: generating and displaying a connection between the first data point and the second data point . During the data point update process, new data points are inserted after another data cycle is reached, and the connection between the data points needs to be increased to form a complete dynamic curve. Specifically, when the time reaches 14:00:01, since the next data cycle is entered, a new data point is inserted into the display position of the next data cycle of the dynamic curve (ie, at 15:00:00), and Generates and displays a line between the data point at 14:00:00 and the data point at 15:00:00. In addition, in order to ensure the real-time nature of the dynamic curve, the connection between the two data points will be updated in real time as the data points are updated. For example, at 14:00:01, the data points at 14:00:00 are not updated, assuming data point coordinates (14:00:00, 5350), data points at 15:00:00 The coordinates are (15:00:00, 5352). When the time passes one second to reach 14:00:02, the data point at the 15:00:00 data point at 15:00:00 is more (15:00:00,5352) after the update. New (15:00:00, 5356), then, the connection between (14:00:00, 5350) and (15:00:00, 5352) will be updated in real time (14:00:00, 5350) ) and the connection between (15:00:00, 5356). The line between the two data points can only represent the trend of change between the data represented by the data points, without representing specific data, for example, the closer to the position of the two data points, the closer the tangent of the line is to the horizontal level, the more Near the center of the two data points, the tangent to the line is closer to vertical.

Further, the foregoing dynamic curve data point updating method further includes: detecting a location of a user operation point, and displaying, when the user operation point coincides with the data point, displaying, at a position of the user operation point, the data point corresponding to the data point data. Thereby, the user can accurately obtain the accurate value of the data in addition to the change trend of the data.

FIG. 5 shows a method for updating a data point of a dynamic curve according to an embodiment of the present application, the method includes:

Step S501, acquiring a real-time component for generating the dynamic curve;

Step S502, writing configuration information to the real-time component;

Step S503, initializing the real-time component, and performing the foregoing method according to the configuration information of the real-time component, thereby completing the data point.

With real-time components, only a small amount of code needs to be written, such as some custom configuration information, so that the data point update function can be realized. Since most of the program code adopts a modular form, the code is readable and can be improved. Maintainability reduces the developer's dependence on programming knowledge and improves development efficiency.

The real-time component includes a graphic display unit and a function calling unit. In practical applications, the graphic display unit and the function calling unit may be pre-program code, for example, using HTML (Hyper Text Markup Language) and JavaScript (Java scripting language), since JavaScript can be inserted into an HTML page. It is executed by any browser and has good versatility. The Highcharts chart library written in JavaScript can easily and conveniently add interactive charts to HTML pages to facilitate the drawing of dynamic curves. The configuration information includes display parameter information and call parameter information. In this embodiment, the display parameter information includes, but is not limited to, related parameters for adjusting the display style of the chart, such as the style of the data point, the color, the color of the line, the style, the position of the chart in the page, etc., and the calling parameter information includes However, it is not limited to parameters that need to be used when implementing function calls, such as information about data sources, control parameters of functions, and so on.

Specifically, the step S503 includes: the function calling unit acquires data for generating an initial data point according to the calling parameter information, and generates a dynamic curve including the initial data point, where the graphic display unit generates according to the display parameter information. Displaying the area and displaying the dynamic curve in the display area; and the graphic display unit and the function invoking unit performing any of the foregoing methods to update the data points in the dynamic curve.

In this embodiment, the program code of the HTML part is mainly used to display the external style of the chart, including the bits of the chart. Set, size, etc., the JavaScript part of the program code is mainly used to implement the background function of the chart, such as acquiring data, generating Highcharts graphics, calling functions, etc. Figure 6 shows a schematic diagram of a dynamic curve chart, the corresponding dynamic components of the chart The program code is as follows, where the HTML part is:

Here, "chart1" is an HTML DOM (HTML Document Object Model) node, which is presented as the entire area of FIG. 6, which is equivalent to the outermost container of FIG. 6, and the other contents shown in FIG. Included in the area. "realTimeArrow" is a class of internal elements in the figure, and is used to specify the partial display effect of the chart display area 6A and the left and

right arrows

6B, 6C in FIG. 6; in addition, the left arrow 6B, the right arrow 6C, and the chart display area are separately defined separately. The 6A class, "wdm-left leftArrow-on arrow-icon", "wdm-right rightArrow arrow-icon", and "Chart_area", respectively display the part of the chart display area 6A, the left arrow 6B, and the right arrow 6C. The effects were individually specified. "margin-right: 25px;" indicates that the right margin of the chart display area 6A is 25 pixels. "J_Chart_area" is an HTML DOM node for presenting Highcharts graphics (ie, dynamic curve 6D), where the HTML DOM is used to provide an interface that enables programs to dynamically access and update the content, structure, and style of HTML pages. In practical applications, "chart1", "realTimeArrow", "wdm-left leftArrow-on arrow-icon", "wdm-right rightArrow arrow-icon", "J_Chart_area", and "chart-area" are not required in the program code. The other sections are defined separately and can be automatically scanned and bound by the JavaScript code below.

The program code of the JavaScript call part is:

Here, in the variable rtConfig, type represents a curve type, such as hour, min, etc., wherein hour and min respectively indicate that a data point is displayed for 1 hour or 5 minutes on the X coordinate axis, that is, the aforementioned data period is 1 hour or 5 minutes. .

lineParams represents the set of parameters that need to be passed to the background of the browser when the curve is acquired. The parameters in the parameter set include date, version information, and so on.

pointParams represents a set of parameters that need to be passed to the background when the data point of the current update time is obtained. The parameters in the parameter set include date, version information, and the like.

lineDS represents the data source for the acquisition curve.

pointDS represents the data source of the data point at the current update time.

clickLeftCallBack indicates that the callback function after clicking the left arrow to get the data, which points to the function leftOneCallBack, is valid when the arrow is true.

clickRightCallBack indicates the callback function after clicking the right arrow to get the data. This points to the function rightOneCallBack, which is valid when the arrow is true.

offLeftArrow indicates that the processing function is clicked when the left arrow is clicked. This points to the function leftOne, which is valid when the arrow is true.

offRightArrow represents the processing function when clicking the right arrow, which points to the function rightOne, which is valid when the arrow is true.

Arrow, which can be true or false, when true, means that the aforementioned left or right arrow can be clicked and the related function is called.

The configuration information (config) written to the real-time component includes but is not limited to the curve type type, the color of the curve, Line width and data point color, size, the aforementioned lineParams, pointParams, lineDS, pointDS, JavaScript related processing functions, axis color, point shape and other information.

FIG. 7 shows an initialization process of the real-time component, including the following steps:

Step S701, loading a corresponding curve type profile according to the type in the config of the real-time component, for example, the loaded type is hour. Config is the configuration of the real-time component, specifying the relevant configuration information for use when initializing the real-time component. The profile is a concrete instance of the real-time component, and the relevant attribute information in the config is written to the profile at each initialization.

In step S702, the corresponding attribute in the current profile is overwritten by the related attribute in the config, where the related attribute may include the color of the curve, the line width, and the color, size, and the like of the data point.

In step S703, the initLine method is called to initialize the data. The initLine method includes: if a chart already exists in the current HTML page (such as the first dynamic curve mentioned in the foregoing method, a historical dynamic curve, etc.), the chart is cleared, and then the related attributes (such as coordinates) of the current instance are used. The axis configuration information, including the color, point shape), initialize the chart object, and then asynchronously obtain the corresponding curve data according to lineDS and lineParams in the config, and then draw the curve according to the data. In practical applications, when the user clicks the left arrow to obtain the historical dynamic curve of the previous day, due to the current dynamic curve of the current day, the dynamic curve of the current day is cleared, the data of the historical dynamic curve is acquired, and the history is displayed. Dynamic curve.

Step S704, calling the current openTimer method to update the data point. The trigger of the openTimer method is implemented by using a timer, and the trigger interval of the timer logic is set to 1 second. Each time the trigger is triggered, it is determined whether the timer is empty. If the timer is not empty, the timer is cleared, and the timer is newly created. The processing steps of the data point update shown in FIG. 1 or FIG. 4 are performed once.

In step S705, it is determined whether the arrow is turned on, that is, whether the left and right arrows are clickable. If it is turned on, step S706 is performed, and if not, the initialization of the real-time component is completed.

Step S706, adding a listener to the arrow, so that the relevant processing logic can be triggered when the click is clicked.

Figure 8 shows the listening process of the arrow's listener, including the following steps:

Step S801, obtaining a click operation;

Step S802, determining whether the arrow is in a non-clickable state, if yes, ending the listening process; if not, executing step S803;

In step S803, the function clickLeftCallBack or clickRightCallBack is called to perform processing. In the embodiment of the present application, the clickLeftCallBack function can implement the foregoing switching operation function, that is, for turning the page forward and displaying the historical dynamic curve, and clickRightCallBack can implement the function of the recovery operation, turning the page backwards until returning Shows the dynamic curve of the day.

In step S804, the function offLeftArrow or offRightArrow is called to perform processing. If the value of the current arrow is true, then the function of calling the above two functions is to click the left (or right) arrow and set it to be unclickable. If the value of arrow is false, click the left (or right) arrow. It is placed in a clickable state.

In step S805, the initLine method is called to initialize the data. Since the curve needs to be cleared and displayed after using the clickLeftCallBack or clickRightCallBack function, the curve can be switched by the initLine method.

Step S806, if the left arrow is clicked, the closeTimer method is called. If the right arrow is clicked, it is necessary to determine whether the right arrow is clickable after the offRightArrow function is processed. If clickable, the closeTimer method is called, if not clickable, Then call the openTimer method. The openTimer method is used to update the data points. It has been described in the initialization process of the real-time component. It will not be described here. The closeTimer method is used to clear the timer, that is, stop updating the data points to reduce the data processing and reduce the processing load. .

FIG. 9 is a schematic structural diagram of a data point updating device 1 of a dynamic curve provided by an embodiment of the present application. The device 1 specifically includes a first device 910, a second device 920, and a third device 930. Specifically, the first device 910 acquires a first data point of the previous update time in the data point if the currently displayed dynamic curve has a data point at each update time; the second device 920 is updated according to the current data source. The data of the time generates a second data point; when the second data point belongs to the same data cycle as the first data point, the third device 930 clears the first data point and displays the display position at the display position of the data cycle The second data point is described.

Here, the device 1 includes, but is not limited to, a device formed by a network device, a touch terminal, or a network device integrated with a touch terminal through a network. Here, the network device includes, but is not limited to, an implementation such as a network host, a single network server, a plurality of network server sets, or a cloud computing-based computer collection; or is implemented by a user equipment. Here, the cloud is composed of a large number of host or network servers based on Cloud Computing, which is a kind of distributed computing, a super virtual computer composed of a group of loosely coupled computers. Preferably, the device 1 can also be a software program running on a network device or a touch terminal. Here, the touch terminal is any electronic product that can perform human-computer interaction through a touch screen, such as a smart phone, a PDA, a portable game machine, a handheld computer PPC, a portable device, or a tablet computer; among them, a touch screen ( Touch Screen), including capacitive touch screen. Technology in the field The operator should be able to understand that the above-mentioned device 1 and the touch terminal are only examples, and other existing or future devices 1 or touch terminals may be applicable to the present invention, and should also be included in the scope of protection of the present invention. This is hereby incorporated by reference.

In this embodiment, the data period may be set to different durations according to actual requirements, for example, set to one hour, fifteen minutes, and the like. There are a plurality of update moments in each data period. Whenever the update time is met, the first device 910, the second device 920, and the third device 930 perform processing once to complete the update of the data points, and similarly update the time. The interval can also be set according to actual needs. For example, if the user has high requirements on the real-time performance of the data, the interval of the update time can be set to be shorter, such as 1 second. In an actual application, the trigger of each update time can be implemented by using a timer, and the trigger interval of the timer logic is set to 1 second. Each time the trigger is: whether the timer is empty or not, if the timer is not empty, The timer is cleared, and a new timer is created, and the data point update is performed by the first device 910, the second device 920, and the third device 930. Here, those skilled in the art should be able to understand that the above description about the data period, the interval of the update time, and the trigger of each update time are merely examples, and other existing or future possible manners may be applied to the present application as well. It is intended to be included within the scope of this application and is hereby incorporated by reference.

Here, the dynamic curve consists of data points and connections between adjacent two data points, wherein each data point (including the first data point and the second data point) represents data within a corresponding data period. For example, in an application scenario, the data points on the dynamic curve are used to indicate the number of newly registered users in an hour, and the data points are updated every second, so each hour is a data. Cycles, such as 12:00:01 to 13:00:00, 13:00:01 to 14:00:00, 14:00:01 to 15:00:00, etc., where the X and Y coordinates of the dynamic curve The axes can represent the time and the number of newly registered users, respectively. In this embodiment, the definition of 12:00:01 to 13:00:00 is data cycle A, 13:00:01 to 14:00:00 is data cycle B, 14:00:01 to 15:00:00 For the data period C, wherein the display position of the data period is a specific position on the X coordinate axis of the dynamic curve, for example, the display positions of the data periods A to C can be respectively set to 13:00:00, 14 on the X coordinate axis. : 00:00, 15:00:00 location. If the current time is 13:15:16, then the data point at 13:00:00 indicates 12:00:01~13:00:00, the number of newly registered users, since the current time has passed 13:00:00 , then the data point has not been updated, and the data point at 14:00:00 indicates 13:00:01 The number of new users in the previous update time (ie, 13:15:15) is the first data point mentioned above. Assume that there are already 5,000 newly registered users between 13:00:01 and 13:15:15, and there are 3 newly registered users in the 13:15:16 second, then the second data point indicates new The number of registered users is 5003. Since 13:15:15 and 13:15:16 belong to the data period B, the first data point (14:00:00, 5000) at the display position of the data period B is cleared, and the second data is displayed. Point (14:00:00, 5003), thus completing the update of the data points.

For data at an update time in the data source, when data points are generated according to the data, the data may be processed to a certain extent, for example, by filtering to screen out some potentially inaccurate data. For example, in the application scenario of the above example, the physical address of the device used by the user can be filtered. For example, the user registers five accounts with the terminal of the same physical address, and when the data point is generated, the five registrations can be performed according to the physical address. The information is filtered, and only one user is newly registered, thereby ensuring the accuracy of the data represented by the data points. Herein, those skilled in the art should understand that the above description about the data processing is only an example, and other existing or future data processing methods may be applicable to the present application, and should also be included in the scope of the present application. It is hereby incorporated by reference.

Preferably, the specific structure of the second device 920 is as shown in FIG. 10, and includes a second module 921 and a second module 922. Specifically, the second module 921 acquires the data of the current update time asynchronously from the data source according to the pre-configured path; the second module 922 generates the second data point according to the data of the current update time.

In order to enable the user to view the update of the data point more intuitively, the first device 910 is further configured to: after acquiring the first data point of the previous update time in the data point, highlight the first data point display. Here, the manner of highlighting includes, but is not limited to, zooming in, changing the color of the data point, changing the transparency of the data point, adding a border, and the like. Taking the enlarged display as an example, the actual display effect of the first data point 3A obtained by the first device processing is as shown in FIG. 3(a), when the first data point 3A is cleared and displayed in the display position of the data period. After the second data point 3B, since the second data point 3B is not highlighted, the second data point 3B is displayed as a normal size, as shown in FIG. 3(b), by zooming in and displaying normally throughout the process. The change process of the data points presents a flickering effect, which makes the dynamic effect of the data point update more intuitive and convenient for the user to view. Here, those skilled in the art should understand that the above description about the highlighting is only an example, other existing or future possible protrusions. The manner in which the display is made is applicable to the present application and is also intended to be included within the scope of the present application and is hereby incorporated by reference.

The data point update device of the preferred dynamic curve is also provided in the embodiment of the present application, because the second data point and the first data point do not belong to the same data period. The structure is as shown in FIG. 11, and includes a fourth device 940 in addition to the first device 910, the second device 920, and the third device 930 as shown in FIG. Specifically, the fourth device 940 displays the second data at a display position of a data period corresponding to the second data point when the second data point and the first data point do not belong to the same data period. point. Here, it should be understood by those skilled in the art that the first device 910, the second device 920, and the third device 930 are the same as or substantially the same as the corresponding devices in the embodiment of FIG. 9, for brevity, and therefore will not be described herein. And is included here by reference.

After the method generates the second data point according to the data of the current update time in the data source, if it is determined that the second data point and the first data point do not belong to the same data period, the method corresponds to the second data point. The display position of the data period displays the second data point, ie, the first data point is not updated, but a new data point is inserted in the dynamic curve. For example, the current time is 14:00:01, and the generated second data point at the update time belongs to the data period C (14:00:01 to 15:00:00), and the first data point generated by the previous update time Then, in the data period B (13:00:01 to 14:00:00), the display position of the data period corresponding to the second data point is the position of 15:00:00 on the X coordinate axis, thereby the current update time. The first data point at the 14:00:00 position will not be cleared, but the second data point will be displayed directly at the 15:00:00 position. At the subsequent update time 14:00:02 to 15:00:00, since the data points generated by them all belong to the same data cycle C, the steps described in step S103 are performed, and the new data points are no longer inserted, but Is to update the original data points;

After the first device 910 obtains the first data point of the previous update time in the data point, the first data point is highlighted, and correspondingly, the fourth device 940 is specifically configured to: when When the second data point and the first data point do not belong to the same data period, canceling the highlighting of the first data point, and displaying the second at the display position of the data period corresponding to the second data point data point. Taking the above-mentioned enlarged highlighting method as an example, the first data of the previous data period is canceled immediately after being enlarged, forming a flickering effect, and the second data point is normally displayed at the display position of the current data period, so that the user can clearly know. The data has been entered for the next data cycle, and the data of the previous data cycle is no longer updated.

Further, the embodiment of the present application further provides a more preferred dynamic curve data point updating device. The structure of the device is as shown in FIG. 12, except for the first device 910, the second device 920, and the first device shown in FIG. In addition to the third device 930 and the fourth device 940, a fifth device 950 is also included. Specifically, the fifth device 950 is at the second data point Determining whether the clearing condition is satisfied before displaying the second data point in the display position of the corresponding data period, and if the clearing condition is satisfied, using the starting position of the currently displayed dynamic curve as the data corresponding to the second data point The position of the cycle is displayed and the currently displayed dynamic curve is cleared. Here, those skilled in the art should understand that the first device 910, the second device 920, the third device 930, and the fourth device 940 are respectively the same or substantially the same as the corresponding devices in the embodiment of FIG. 11, for the sake of brevity, It is not described here, and is hereby incorporated by reference.

In addition, the emptying condition may also be some specific operations input by the user, such as switching operation of viewing historical curve data. In this case, because the historical curve data needs to be acquired, the foregoing clearing the currently displayed dynamic curve specifically includes: saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the currently displayed dynamic curve. .

Therefore, the application embodiment further provides another preferred dynamic curve data point updating device. The structure of the device is as shown in FIG. 13, except for the first device 910, the second device 920, and the third device shown in FIG. In addition to the device 930, the fourth device 940, and the fifth device 950, a sixth device 960 is further included. Specifically, the sixth device 960 includes a sixth module 961 and a sixth module 962, wherein the sixth module 961 saves the currently displayed dynamic curve as a historical dynamic curve, and clears the currently displayed After the dynamic curve, when the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed; the sixth two module 962 suspends updating of the data point at the subsequent update time.

Here, the switching operation includes, but is not limited to, a click or slide operation of the operation point at a specific position, a text instruction input through the interactive interface, and the like. For example, a left arrow button can be set on the left side of the graph interface of the dynamic curve. When the user's operation point clicks the left arrow, it is a switching operation, and once clicked, it switches to the dynamic curve of the previous day; for example, the switching operation is Slide to the left in the chart area of the dynamic curve, slide once to switch to the dynamic curve of the previous day or switch to different historical dynamic curves according to the sliding distance; for example, enter the number of the historical dynamic curve in the provided interactive interface. You can switch to the corresponding historical dynamic curve. Herein, those skilled in the art should understand that the above description about the handover operation is only an example, and other existing or future possible handover operations, as applicable to the present application, are also included in the scope of protection of the present application, and This is hereby incorporated by reference.

The current displayed dynamic curve is saved as a historical dynamic curve, including but not limited to the following manners: Only the information of each data point in the historical dynamic curve is saved, or the information of each data point and the connection between the data points is saved. If only the information of each data point in the historical dynamic curve is saved, the specific steps of displaying the historical dynamic curve are as follows: First, each data point is generated and displayed according to the saved information, and then a connection between the data points is generated and displayed according to the data point. To show the complete dynamic curve. Of course, in order to ensure that data points and connections can be displayed simultaneously, data points and their connections can be displayed simultaneously after data points and connections are generated based on the saved information. If you save each data point and the information of the connection between the data points at the same time, you only need to obtain the information and generate and display it based on the information. Herein, those skilled in the art should understand that the above description about the preservation history dynamic curve is only an example, and other existing or future possible storage methods, as applicable to the present application, should also be included in the scope of protection of the present application. It is hereby incorporated by reference.

Since the curve displayed after the switching operation is a historical dynamic curve, the data points of the dynamic curve of the current time need not be updated after the update time is reached, so after the historical dynamic curve is displayed, the subsequent update time is suspended. The update of the data points. Here, the update refers only to the update of the data point displayed in the dynamic curve, but the data record is not stopped in the data source. For example, the application scenario of the number of newly registered users in an hour is taken as an example. Assume that the data of the historical dynamic curve and the number of newly registered users in the data source are saved in the cloud server, and the dynamic curve is passed. The browser on the update device displays that the information of the number of newly registered users is sent to the server by the mobile terminal on which the application is installed and saved in the data source. At the current time of 13:15:16, if the update device obtains the switching operation of the user input, the update device will clear the currently displayed dynamic curve, and according to the configured path information, the saved historical dynamic curve will be obtained by the server and browsed. This historical dynamic curve is displayed in the device. At this point, the mobile terminal with the application installed will still send the server the information of the number of newly registered users. For example, in 13:00:01 to 13:15:15, there are already 5,000 newly registered users at 13:15. The number of newly registered users has increased by 20 during the period from 16 to 13:16:11. The data source will still receive this information and save it so that the update device can still get the latest data when it needs to be updated, but this time. The displayed dynamic curve does not change.

Preferably, the sixth device further includes a sixth three module 963 and a sixth fourth module 964, and the specific structure thereof is as shown in FIG. 14. With reference to FIG. 13, the sixth module 961 saves the currently displayed dynamic curve as a historical dynamic curve and clears the currently displayed dynamic curve, and when the switching operation is acquired, according to the switching operation The currently displayed dynamic curve is saved as a first dynamic curve, and the currently displayed dynamic curve is cleared, and the historical dynamic curve is displayed. And the sixth dynamic module 963 clears the currently displayed historical dynamic curve according to the recovery operation, and displays the first dynamic curve, after the update of the data point is performed after the subsequent update is paused. The sixth quad module 964 resumes updating the data points at subsequent update times.

Preferably, the embodiment of the present application further provides a more preferred dynamic curve data point updating device. The structure of the device is as shown in FIG. 15, except for the first device 910, the second device 920, and the first device shown in FIG. In addition to the third device 930 and the fourth device 940, a seventh device 970 is also included. Specifically, the seventh device 970 generates and displays between the first data point and the second data point after displaying the second data point in a display position of a data period corresponding to the second data point. Connection. Here, those skilled in the art should understand that the first device 910, the second device 920, the third device 930, and the fourth device 940 are respectively the same or substantially the same as the corresponding devices in the embodiment of FIG. 10, and for the sake of brevity, It is not described here, and is hereby incorporated by reference. Of course, in addition to the first device 910, the second device 920, the third device 930, and the fourth device 940, the device may further include the aforementioned fifth device and/or sixth device.

Specifically, when the time reaches 14:00:01, since the next data cycle is entered, a new data point is inserted into the display position of the next data cycle of the dynamic curve (ie, at 15:00:00), and Generates and displays a line between the data point at 14:00:00 and the data point at 15:00:00. In addition, in order to ensure the real-time nature of the dynamic curve, the connection between the two data points will be updated in real time as the data points are updated. For example, at 14:00:01, the data points at 14:00:00 are not updated, assuming data point coordinates (14:00:00, 5350), data points at 15:00:00 The coordinates are (15:00:00, 5352). When the time reaches 14:00:02 in one second, the data point at the 15:00:00 data point at 14:00:00 is updated by (15:00:00,5352) after the update. For (15:00:00, 5356), then the connection between (14:00:00, 5350) and (15:00:00, 5352) will be updated in real time (14:00:00, 5350) Connection with (15:00:00, 5356). The line between the two data points can only represent the trend of change between the data represented by the data points, without representing specific data, for example, the closer to the position of the two data points, the closer the tangent of the line is to the horizontal level, the more Near the center of two data points, the connection The closer the tangent is to the vertical.

Further, the present application further provides another better dynamic curve data point updating device, the structure of which is shown in FIG. 16, except that the first device 910, the second device 920, and the third device 930 are as shown in FIG. In addition, an eighth device 980 is included. Specifically, the fourth device 940 detects a location of a user operation point, and when the user operation point coincides with the data point, displays data corresponding to the data point at a location of the user operation point. Thereby, the user can accurately obtain the accurate value of the data in addition to the change trend of the data. Here, it should be understood by those skilled in the art that the first device 910, the second device 920, and the third device 930 are the same as or substantially the same as the corresponding devices in the embodiment of FIG. 9, for brevity, and therefore will not be described herein. And is included here by reference. Of course, in addition to the first device 910, the second device 920, and the third device 930, the device may further include any one or more of the foregoing fourth device, fifth device, sixth device, and seventh device.

FIG. 17 shows that the embodiment of the present application further provides a dynamic curve data point updating device, which includes a ninth device 1710, a tenth device 1720, and an eleventh device 1730. Specifically, the ninth device 1710 acquires a real-time component for generating the dynamic curve; the tenth device 1720 writes configuration information to the real-time component; the eleventh device 1730 initializes the real-time component according to the real-time component The configuration information controls the operation of the aforementioned device to complete the data point.

Specifically, the eleventh device 1730 instructs the function invoking unit to acquire data for generating an initial data point according to the invoking parameter information, and generate a dynamic curve including the initial data point, indicating that the graphic display unit is Displaying parameter information to generate a display area and displaying the dynamic curve in the display area; and indicating The graphic display unit and the function calling unit control any one of the foregoing devices to perform updating of data points in the dynamic curve.

The program code of the HTML part in this embodiment is mainly used to express the external style of the chart, including the position and size of the chart, and the program code of the JavaScript part is mainly used to implement the background function of the chart, such as acquiring data, generating Highcharts graphics, and calling Function, etc., Figure 6 shows a schematic diagram of a dynamic curve chart, the program code of the dynamic component corresponding to the chart is as follows, wherein the HTML part is:

Here, "chart1" is an HTML DOM (HTML Document Object Model) node, which is presented as the entire area of FIG. 6, which is equivalent to the outermost container of FIG. 6, and other contents shown in the figure include In the area. "realTimeArrow" is a class of internal elements in the figure, and is used to specify the partial display effect of the chart display area 6A and the left and

right arrows

The program code of the JavaScript call part is:

lineDS represents the data source for the acquisition curve.

The configuration information (config) written to the real-time component includes but is not limited to the curve type type, the color of the curve, the line width and the color and size of the data point, the aforementioned lineParams, pointParams, lineDS, pointDS, and JavaScript related processing functions. , color of the axis, point shape and other information.

Step S702, the corresponding attribute in the current profile is overwritten by the related attribute in the config, wherein the related attribute may include the color of the curve, the line width, and the color, size, and the like of the data point.

Step S801, obtaining a click operation;

In step S803, the function clickLeftCallBack or clickRightCallBack is called to perform processing. In the embodiment of the present application, the clickLeftCallBack function can implement the function of the foregoing switching operation, that is, for turning the page forward and displaying the historical dynamic curve, and clickRightCallBack can implement the function of the recovery operation, turning the page backward until returning to display the dynamic of the day. curve.

In summary, the technical solution provided in the present application can acquire the data points of the latest update time on the curve, and then compare with the data points generated by the current update time. If they belong to the same data cycle, the newly generated data points will be generated. The original data point is replaced, so that the data point is continuously updated and displayed in one data cycle, and the information such as the accumulated amount of a certain data in a certain period can be more intuitively displayed. In addition, in another solution provided by the present application, only a small amount of code, such as customized configuration information, needs to be written by the real-time component to implement the function of updating the data point, since most of the program code adopts a modular form. Improves the readability and maintainability of the code, reduces the developer's dependence on programming knowledge, and improves development efficiency.

It should be noted that the present application can be implemented in software and/or a combination of software and hardware, for example, using an application specific integrated circuit (ASIC), a general purpose computer, or any other similar hardware device. In one embodiment, the software program of the present application can be executed by a processor to implement the steps or functions described above. Likewise, the software programs (including related data structures) of the present application can be stored in a computer readable recording medium such as a RAM memory, a magnetic or optical drive or a floppy disk and the like. In addition, some of the steps or functions of the present application may be implemented in hardware, for example, as a circuit that cooperates with a processor to perform various steps or functions.

In addition, a portion of the present application can be applied as a computer program product, such as computer program instructions, which, when executed by a computer, can invoke or provide a method and/or technical solution in accordance with the present application. The program instructions for invoking the method of the present application may be stored in a fixed or removable recording medium, and/or transmitted by a data stream in a broadcast or other signal bearing medium, and/or stored in a The working memory of the computer device in which the program instructions are run. Herein, an embodiment in accordance with the present application includes a device including a memory for storing computer program instructions and a processor for executing program instructions, wherein when the computer program instructions are executed by the processor, triggering The apparatus operates based on the aforementioned methods and/or technical solutions in accordance with various embodiments of the present application.

It is obvious to those skilled in the art that the present application is not limited to the details of the above-described exemplary embodiments, and the present invention can be implemented in other specific forms without departing from the spirit or essential characteristics of the present application. Therefore, the present embodiments are to be considered as illustrative and not restrictive, and the scope of the invention is defined by the appended claims instead All changes in the meaning and scope of equivalent elements are included in this application. Any reference signs in the claims should not be construed as limiting the claim. In addition, it is to be understood that the word "comprising" does not exclude other elements or steps. A plurality of units or devices recited in the device claims may also be implemented by a unit or device by software or hardware. The first, second, etc. words are used to denote names and do not denote any particular order.

Claims

A method for updating a data point of a dynamic curve, wherein the method comprises:

At each update time, if there is a data point in the currently displayed dynamic curve, the first data point of the previous update time in the data point is acquired;

Generating a second data point according to data of a current update time in the data source;

When the second data point and the first data point belong to the same data period, the first data point is cleared and the second data point is displayed at a display position of the data period.
The method of claim 1, wherein generating the second data point based on the data of the current update time in the data source comprises:

Obtaining data of the current update time asynchronously from the data source according to the pre-configured path;

Generating a second data point according to the data of the current update time.
The method according to claim 1 or 2, wherein after acquiring the first data point of the previous update time in the data point, the method further comprises:

The first data point is highlighted.
The method according to claim 1 or 2, wherein after generating the second data point according to the data of the current update time in the data source, the method further includes:

When the second data point and the first data point do not belong to the same data period, the second data point is displayed at a display position of a data period corresponding to the second data point.
The method of claim 3, wherein after generating the second data point according to the data of the current update time in the data source, the method further comprises:

When the second data point and the first data point do not belong to the same data period, the highlighting of the first data point is cancelled, and the display position of the data period corresponding to the second data point is displayed. The second data point is described.
The method according to claim 4 or 5, wherein before the displaying the second data point in the display position of the data period corresponding to the second data point, the method further comprises:

Determining whether the emptying condition is satisfied. If the emptying condition is met, the starting position of the currently displayed dynamic curve is used as the display position of the data period corresponding to the second data point, and the currently displayed dynamic curve is cleared.
The method of claim 6 wherein said clearing said currently displayed dynamic profile comprises:

Saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the currently displayed dynamic curve;

Saving the currently displayed dynamic curve as a historical dynamic curve and clearing the currently displayed dynamic curve After that, it also includes:

When the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed;

Suspending updates to the data points at subsequent update times.
The method according to claim 7, wherein when the switching operation is acquired, the currently displayed dynamic curve is cleared according to the switching operation, and the historical dynamic curve is displayed, including:

When the switching operation is acquired, the currently displayed dynamic curve is saved as a first dynamic curve according to the switching operation, and the currently displayed dynamic curve is cleared, and the historical dynamic curve is displayed;

After suspending the update of the data point at the time of subsequent update, the method further includes:

When the recovery operation is acquired, the currently displayed historical dynamic curve is cleared according to the recovery operation, and the first dynamic curve is displayed;

The update of the data points is resumed at a subsequent update time.
The method according to any one of claims 4 to 8, wherein after the displaying the second data point in the display position of the data period corresponding to the second data point, the method further comprises:

Generating and displaying a connection between the first data point and the second data point.
The method according to any one of claims 1 to 9, wherein the method further comprises:

Detecting a location of a user operation point, and when the user operation point coincides with the data point, displaying data corresponding to the data point at a location of the user operation point.
A method for updating a data point of a dynamic curve, wherein the method comprises:

Obtaining a real-time component for generating the dynamic curve;

Writing configuration information to the real-time component;

The real-time component is initialized, and the method according to any one of claims 1 to 10 is performed according to configuration information of the real-time component.
The method of claim 11 wherein said real time component comprises a graphical presentation unit and a function call unit;

Initializing the real-time component, performing the method according to any one of claims 1 to 10 according to the configuration information of the real-time component, comprising:

Generating data of the initial data point by the function calling unit according to the configuration information, and generating a dynamic curve including the initial data point, the graphic display unit generating a display area and displaying the dynamic curve in the display area;

The graphical display unit and the function invoking unit perform a method according to any one of claims 1 to 10 to update a data point in the dynamic curve.
The method of claim 12, wherein the configuration information comprises display parameter information and call parameter information;

Generating data of the initial data point by the function calling unit according to the configuration information, and generating a dynamic curve including the initial data point, generating the display area by the graphic display unit and displaying the dynamic curve in the display area includes:

The function invoking unit acquires data for generating an initial data point according to the invoking parameter information, and generates a dynamic curve including the initial data point, and the graphic display unit generates a display area according to the display parameter information and displays the display area The dynamic curve is displayed in the area.
A dynamic curve data point updating device, wherein the device comprises:

a first device, configured to acquire, at each update time, a first data point of a previous update time in the data point if a data point exists in the currently displayed dynamic curve;

a second device, configured to generate a second data point according to data of a current update time in the data source;

And a third device, configured to: when the second data point and the first data point belong to the same data period, clear the first data point and display the second data point at a display position of the data period.
The apparatus of claim 14 wherein said second means comprises:

a second module, configured to asynchronously acquire data of a current update time from a data source according to a pre-configured path;

And a second module, configured to generate a second data point according to the data of the current update time.
The device according to claim 14 or 15, wherein the first device is further configured to:

After acquiring the first data point of the previous update time in the data point, the first data point is highlighted.
The device according to claim 14 or 15, wherein the device further comprises:

And a fourth device, configured to: when the second data point and the first data point do not belong to the same data period, display the second data point at a display position of a data period corresponding to the second data point.
The apparatus of claim 16 wherein said fourth means is further for:

When the second data point and the first data point do not belong to the same data period, the highlighting of the first data point is cancelled, and the display position of the data period corresponding to the second data point is displayed. The second data point is described.
The device according to claim 17 or 18, wherein the device further comprises:

a fifth device, configured to display the second data point at a display position of a data period corresponding to the second data point Before determining whether the emptying condition is satisfied, if the emptying condition is met, the starting position of the currently displayed dynamic curve is used as the display position of the data period corresponding to the second data point, and the currently displayed dynamic curve is cleared. .
The apparatus according to claim 19, wherein said fifth means is configured to save said currently displayed dynamic curve as a historical dynamic curve and clear said currently displayed dynamic curve;

The device also includes a sixth device, the sixth device comprising:

a sixth module, configured to: after saving the currently displayed dynamic curve as a historical dynamic curve, and clearing the currently displayed dynamic curve, when acquiring the switching operation, clearing the currently displayed dynamic curve according to the switching operation Displaying the historical dynamic curve;

The sixth module is configured to suspend updating the data point at a subsequent update time.
The apparatus according to claim 20, wherein said sixth module is for:

After saving the currently displayed dynamic curve as a historical dynamic curve and clearing the currently displayed dynamic curve, when the switching operation is acquired, the currently displayed dynamic curve is saved as the first dynamic according to the switching operation. Curve and clear the currently displayed dynamic curve to display the historical dynamic curve;

The sixth device further includes:

a sixth module, configured to: after the update of the data point is paused at a time of suspending the subsequent update, when the recovery operation is acquired, clear the currently displayed historical dynamic curve according to the recovery operation, and display the first dynamic curve;

The sixth four module is configured to restore the update of the data point at a subsequent update time.
The device according to any one of claims 17 to 21, wherein the device further comprises:

a seventh device, configured to generate and display a connection between the first data point and the second data point after displaying the second data point at a display position of a data period corresponding to the second data point .
The device according to any one of claims 14 to 22, wherein the device further comprises:

The eighth device is configured to detect a location of the user operation point, and when the user operation point coincides with the data point, display data corresponding to the data point at the location of the user operation point.
A dynamic curve data point updating device, wherein the device comprises:

a ninth device, configured to acquire a real-time component for generating the dynamic curve;

a tenth device, configured to write configuration information to the real-time component;

An eleventh device for initializing the real-time component, and controlling operation of the device according to any one of claims 14 to 23 according to configuration information of the real-time component.
The device of claim 24, wherein the real-time component comprises a graphical display unit and a function call unit;

The eleventh device is configured to:

Determining, according to the configuration information, the function invoking unit to acquire data of the initial data point, and generating a dynamic curve including the initial data point, instructing the graphic display unit to generate a display area and displaying the dynamic curve in the display area;

The graphical display unit and the function invoking unit are instructed to control the device of any one of claims 14 to 23 to perform an update of the data points in the dynamic curve.
The device according to claim 25, wherein said configuration information comprises display parameter information and call parameter information;

The eleventh device is configured to:

Instructing the function invoking unit to acquire data for generating an initial data point according to the invoking parameter information, and generating a dynamic curve including the initial data point, instructing the graphic display unit to generate a display area according to the display parameter information and Displaying the dynamic curve in the display area;

The graphical display unit and the function invoking unit are instructed to control the device of any one of claims 14 to 23 to perform an update of the data points in the dynamic curve.