Method and system for displaying real-time vehicle track with controllable refresh rate

Abstract

The invention discloses a method and a system for displaying a real-time vehicle track with a controllable refresh rate, and relates to the technical field of intelligent networked automobiles, and the method comprises the following steps: receiving real-time data of a vehicle; setting a rendering refresh rate f1; performing interpolation frame compensation on all adjacent data points in the real-time data, and recording a corresponding frame rate during frame compensation; setting a count value as 0; executing a callback function, and adding 1 to a count value; judging whether the current count value meets the requirement or not, if so, executing a method for rendering interpolation point locations, drawing the interpolation point locations into the browser by adopting a frame rate corresponding to frame supplementation, and clearing the count at the same time; and if the requirement is not met, returning to execute the function callback step. By customizing the rendering refresh rate, interpolation processing under different refresh rates is realized, and the problem of inconsistent movement speeds of vehicles on a map caused by fluctuation of the refresh rate of a Web browser in the prior art is solved, so that the accuracy and coherence of track display are improved.

Description

Technical Field

[0001] The present invention relates to the technical field of intelligent connected vehicles, and in particular to a method and system for displaying real-time vehicle trajectories with a controllable refresh rate. Background Art

[0002] Intelligent connected car technology is developing rapidly, and one of the key areas is real-time vehicle trajectory display. Usually, the real-time data of the vehicle is uploaded by the on-board unit (OBU), and the back-end service pushes the data to the web browser through WebSocket for display.

[0003] In the prior art, some systems directly use the real-time data uploaded by the vehicle-side OBU to display the trajectory without interpolation processing. The advantage of this method is that it is highly real-time and directly displays the most realistic data, because it reflects the position change of the vehicle almost immediately. However, due to the limitation of the push frequency, not using interpolation may cause the trajectory display to be not smooth enough, especially when the frequency of pushing data to the browser is unstable. Therefore, some systems have added interpolation algorithms, but interpolation and display are performed at a fixed refresh rate, that is, after interpolation processing is performed at a fixed screen refresh rate, the trajectory data is displayed at a fixed refresh rate. Although this method can improve the smoothness of the trajectory, it may cause other problems. For example, since the browser refresh rate is not fixed and there will be fluctuations, when interpolation is performed at a high refresh rate, but when the interpolated trajectory is displayed at a low refresh rate, the vehicle's movement speed on the map will be inconsistent; in addition, the display screen with a fixed high refresh rate will consume more computing resources when interpolating and playing the trajectory, causing unnecessary performance loss. When the displayed vehicle reaches a certain order of magnitude, it may even drop frames and fail to achieve a normal display effect. Summary of the invention

[0004] The present invention provides a method and system for displaying real-time vehicle trajectories with a controllable refresh rate, so as to overcome at least one technical problem existing in the prior art.

[0005] In one aspect, the present invention provides a method for displaying real-time vehicle trajectories with a controllable refresh rate, comprising:

[0006] Receive real-time data from vehicles;

[0007] Setting the rendering refresh rate f1 so that the browser refresh rate f2 is an integer multiple of the rendering refresh rate f1;

[0008] According to the rendering refresh rate f1, interpolation and frame supplementation are performed on all adjacent data points in the real-time data, and the corresponding frame rate during frame supplementation is recorded to obtain interpolation points between all adjacent data points;

[0009] Set the count value to 0;

[0010] Utilize the requestAnimationFrame method provided by the browser to execute the callback function and increase the count value by 1;

[0011] Based on the browser's refresh rate f2 and the rendering refresh rate f1, determine whether the current count value meets the requirements. If so, execute the method of rendering the interpolation points, use the frame rate corresponding to the frame supplementation, draw the interpolation points into the browser, and clear the count at the same time; if not, return to the requestAnimationFrame method provided by the browser to execute the callback function step.

[0012] Optionally, interpolation and frame filling are performed on all adjacent data points in the real-time data, specifically:

[0013] A linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data.

[0014] Optionally, a linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data, specifically:

[0015] Assume that the adjacent data points are px and py, and the receiving times are tx and ty respectively, then the time difference between the data points px and py is Δt = ty-tx;

[0016] According to the rendering refresh rate f, the time interval of each frame is calculated to be 1 / f;

[0017] Starting from tx, the time interval 1 / f of each frame is superimposed in sequence to calculate the time t of each interpolation point i ;

[0018] According to the time t of the interpolation point i The proportion of the time difference Δt between data points p1 and p2 is calculated to obtain the corresponding interpolation point i.

[0019] Optionally, according to the time t of the interpolation point i The proportion of the time difference Δt between the data points px and py is calculated to obtain the corresponding interpolation point i, specifically:

[0020] px i =(t i -t x )÷(Δt)×(py-px)

[0021] Among them, t i =t i-1 +1 / f, when i=1, t0=tx.

[0022] Optionally, based on the browser refresh rate f2 and the rendering refresh rate f1, it is determined whether the current count value meets the requirement, specifically:

[0023] It is determined whether the current count value is equal to the ratio of the browser refresh rate f2 to the rendering refresh rate f1. If so, it indicates that the current count value meets the requirement; if not, it indicates that the current count value does not meet the requirement.

[0024] On the other hand, the present invention also provides a system for displaying real-time vehicle trajectories with a controllable refresh rate, comprising:

[0025] A receiving module, used for receiving real-time data of the vehicle;

[0026] A setting module, used to set a rendering refresh rate f1, wherein the rendering refresh rate f1 is less than a browser refresh rate f2;

[0027] An interpolation module is used to interpolate and supplement frames for all adjacent data points in the real-time data according to the rendering refresh rate f1, and record the corresponding frame rate during the supplementation to obtain interpolation points between all adjacent data points;

[0028] Setting module, used to set the count value to 0;

[0029] An execution module, used for executing the callback function by using the requestAnimationFrame method provided by the browser, and adding 1 to the count value;

[0030] The judgment module is used to judge whether the current count value meets the requirements based on the browser refresh rate f2 and the rendering refresh rate f1. If it meets the requirements, the method of rendering the interpolation points is executed, and the interpolation points are drawn to the browser using the frame rate corresponding to the frame supplementation, and the count is cleared at the same time; if it does not meet the requirements, it returns to the requestAnimationFrame method provided by the browser to execute the callback function step.

[0031] Optionally, the interpolation module is specifically used for:

[0032] A linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data.

[0033] Optionally, the interpolation module includes:

[0034] The first calculation module is used to set adjacent data points to be px and py, and the receiving times to be tx and ty, and calculate the time difference between the data points px and py to be Δt=ty-tx;

[0035] A second calculation module is used to calculate the time interval of each frame as 1 / f according to the rendering refresh rate f;

[0036] The third calculation module is used to start from tx, sequentially superimpose each frame time interval 1 / f, and calculate the time t of each interpolation point i ;

[0037] The fourth calculation module is used to calculate the time t of the interpolation point according to the time t i The proportion of the time difference Δt between data points p1 and p2 is calculated to obtain the corresponding interpolation point i.

[0038] Optionally, the fourth calculation module is specifically configured to:

[0039] px i =(t i -t x )÷(Δt)×(py-px)

[0040] Among them, t i =t i-1 +1 / f, when i=1, t0=tx.

[0041] Optionally, when judging whether the current count value meets the requirement, the judging module is specifically used to:

[0042] It is determined whether the current count value is equal to the ratio of the browser refresh rate f2 to the rendering refresh rate f1. If so, it indicates that the current count value meets the requirement; if not, it indicates that the current count value does not meet the requirement.

[0043] The innovative features of the embodiments of the present invention include:

[0044] 1. In this embodiment, interpolation points are generated by an interpolation algorithm. When the vehicle-side data push frequency is lower than the refresh rate, the trajectory points generated after interpolation are used. Compared with directly using the vehicle-side data for trajectory rendering, the real-time trajectory of the vehicle can be rendered more smoothly, which is one of the innovations of the embodiment of the present invention.

[0045] 2. In this embodiment, the interpolation processing at different refresh rates is implemented by customizing the rendering refresh rate, which solves the problem of inconsistent vehicle movement speed on the map caused by fluctuations in the refresh rate of the Web browser in the prior art, thereby improving the accuracy and consistency of the trajectory display, which is one of the innovations of the embodiment of the present invention.

[0046] 3. In this embodiment, by customizing the rendering refresh rate, the performance burden of the Web browser can also be reduced, which is beneficial to reducing the use of computing and network resources. Especially in large-scale vehicle monitoring systems, it can reduce the server burden, which is one of the innovative points of the embodiment of the present invention.

[0047] 4. In this embodiment, by customizing the rendering refresh rate, the user is allowed to adjust the refresh rate according to his or her own needs to achieve personalized trajectory display, which can meet the different needs of different users for real-time and smoothness of trajectory display, and realize flexible support for user personalized needs, which is one of the innovations of the embodiment of the present invention. BRIEF DESCRIPTION OF THE DRAWINGS

[0048] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, the drawings described below are only some embodiments of the present invention. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying creative work.

[0049] Figure 1 A flow chart of a method for displaying a trajectory provided by an embodiment of the present invention;

[0050] Figure 2 A flow chart of interpolation frame filling provided by an embodiment of the present invention;

[0051] Figure 3 A schematic diagram of a structure of a system for displaying a trajectory provided by an embodiment of the present invention;

[0052] Figure 4 A schematic diagram of the structure of an interpolation module provided in an embodiment of the present invention. DETAILED DESCRIPTION

[0053] The following will be combined with the drawings in the embodiments of the present invention to clearly and completely describe the technical solutions in the embodiments of the present invention. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0054] It should be noted that the terms "including" and "having" and any variations thereof in the embodiments of the present invention and the accompanying drawings are intended to cover non-exclusive inclusions. For example, a process, method, system, product or device including a series of steps or units is not limited to the listed steps or units, but may optionally include steps or units not listed, or may optionally include other steps or units inherent to these processes, methods, products or devices.

[0055] The embodiments of the present invention disclose a method and system for displaying real-time vehicle trajectories with a controllable refresh rate, which are described in detail below.

[0056] Figure 1For a flow chart of a method for displaying a trajectory provided by an embodiment of the present invention, please refer to Figure 1 , the method for displaying real-time vehicle trajectories with controllable refresh rate provided by an embodiment of the present invention includes:

[0057] Step 1: Receive real-time data from the vehicle;

[0058] Step 2: Set the rendering refresh rate f1 so that the browser refresh rate f2 is an integer multiple of the rendering refresh rate f1;

[0059] Step 3: According to the rendering refresh rate f1, interpolate and supplement frames for all adjacent data points in the real-time data, and record the corresponding frame rate during the supplementation to obtain the interpolation points between all adjacent data points;

[0060] Step 4: Set the count value to 0;

[0061] Step 5: Use the requestAnimationFrame method provided by the browser to execute the callback function and add 1 to the count value;

[0062] Step 6: Based on the browser's refresh rate f2 and rendering refresh rate f1, determine whether the current count value meets the requirements. If so, execute the method of rendering the interpolation points, use the frame rate corresponding to the frame supplementation, draw the interpolation points into the browser, and clear the count at the same time; if not, return to the requestAnimationFrame method provided by the browser to execute the callback function step.

[0063] Specifically, please refer to Figure 1 The method for displaying real-time vehicle trajectories with controllable refresh rate provided in an embodiment of the present invention first receives real-time data pushed by a back-end WebSocket through step 1, that is, real-time data of the vehicle, such as latitude, longitude, heading angle and other information.

[0064] Usually, when the refresh rate is higher than 30 frames, the human eye can feel smooth playback. Based on this, the present invention customizes the rendering refresh rate f1 through step 2, and makes the browser refresh rate f2 an integer multiple of the rendering refresh rate f1. For example, assuming that the browser refresh rate f2 is 60hz, the rendering refresh rate f1 can be customized to 60hz or 30hz according to the specific needs of the user. In this way, the problem of a fixed high refresh rate display screen consuming more computing resources can be avoided, thereby reducing the performance burden on the browser side and avoiding the problem of wasting resources.

[0065] Generally, the frequency of real-time data upload is low. If it is displayed directly, there will be a problem that the trajectory display is not smooth enough. Therefore, the present invention performs interpolation processing in step 3. The interpolation processing can use linear interpolation or nonlinear interpolation (such as spline interpolation or Bezier curve interpolation, etc.).

[0066] In order to ensure that all trajectories can be displayed smoothly, during the interpolation process, all adjacent data points in the real-time data need to be interpolated and supplemented to obtain the interpolation points between all adjacent data points. For example, the part between the first data point and the second data point in the real-time data is interpolated and supplemented to obtain the interpolation points between the first data point and the second data point; the part between the second data point and the third data point is interpolated and supplemented to obtain the interpolation points between the second data point and the third data point, and so on and so forth, until the interpolation processing of all adjacent data points is completed. At the same time, in order to ensure that the rendering frame rate is consistent with the generation frame rate of the interpolation points, each time an interpolation point is generated here, the generation frame rate of the corresponding interpolation point needs to be recorded, so that the same frame rate can be used when rendering the points, so that on the basis of realizing controllable and variable refresh rate, it can be displayed with consistent trajectory and speed, thereby improving the accuracy and consistency of trajectory display.

[0067] After obtaining the interpolated points, the requestAnimationFrame provided by the browser is used as the basis to achieve controllable refresh rate point rendering. When rendering points, the callback is used to accumulate counts to determine whether to draw points. Therefore, the count value is first initialized to 0 through step 4. In step 5, the requestAnimationFrame method provided by the browser is used to execute the callback function, and the count value is increased by 1 in the callback requestAnimationFrame of each rendering frame to obtain the current count value.

[0068] Then, step 6 is used to determine whether the current count value meets the requirements of the browser refresh rate f2 and the rendering refresh rate f1. For example, it is determined whether the current count value is equal to the ratio of the browser refresh rate f2 and the rendering refresh rate f1. Assuming that the display hardware refresh rate is 60hz, the upper limit of the browser refresh rate is 60hz. If the custom rendering refresh rate is 30hz, when the count value is equal to 2, it means that the current count value meets the requirements, otherwise, it means that the current count value does not meet the requirements.

[0069] When the current count value meets the requirements, the method of rendering the interpolated points is executed. In order to achieve the uniformity of the refresh rate of the generated and rendered points, when executing the method of rendering the interpolated points, the frame rate recorded when the interpolated points are generated is used to draw the corresponding interpolated points to the browser to achieve a smooth display of the trajectory. After each trajectory display is completed, the current count value needs to be cleared so that the cumulative count can be restarted at the next drawing. When the current count value does not meet the requirements, it means that it is necessary to wait for the next callback to continue accumulating the count value. Therefore, return to step 5 and continue to use the requestAnimationFrame method provided by the browser to execute the callback function. It should be noted that when the count value does not meet the requirements and the next callback is executed, the new state is executed.

[0070] The method for displaying real-time vehicle trajectories with controllable refresh rates provided by the present invention generates interpolation points through an interpolation algorithm. When the vehicle-side data push frequency is lower than the refresh rate, the trajectory points generated after interpolation are used. Compared with directly using the vehicle-side data for trajectory rendering, the real-time trajectory of the vehicle can be rendered more smoothly. The present invention realizes interpolation processing at different refresh rates by customizing the rendering refresh rate. On the one hand, it solves the problem of inconsistent vehicle movement speed on the map caused by the refresh rate fluctuation of the Web browser in the prior art, thereby improving the accuracy and consistency of trajectory display; on the other hand, it can also reduce the performance burden of the Web browser side, which is conducive to reducing the use of computing and network resources, especially in large-scale vehicle monitoring systems, which can reduce the burden on the server.

[0071] In addition, the present invention allows users to adjust the refresh rate according to their own needs through custom rendering refresh rate to achieve personalized trajectory display, which can meet the different needs of different users for real-time and smoothness of trajectory display, and realize flexible support for user personalized needs.

[0072] Optionally, Figure 2 For a flowchart of interpolation frame filling provided by an embodiment of the present invention, please refer to Figure 1 and Figure 2 In step 3, a linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data. Specifically, in step 31, suppose that the adjacent data points are px and py, and the receiving times are tx and ty, respectively. Then the time difference between the data points px and py is Δt=ty-tx; in step 32, according to the rendering refresh rate f, the time interval of each frame is calculated to be 1 / f; in step 33, starting from tx, the time interval of each frame is superimposed in sequence 1 / f to calculate the time t of each interpolation point. i ; Step 34, according to the time t of the interpolation point i The proportion of the time difference Δt between the data points px and py is calculated to obtain the corresponding interpolation point i.

[0073] Specifically, please refer to Figure 2 In this embodiment, a linear interpolation method is used to interpolate and fill frames for all adjacent data points in real-time data. First, two adjacent data points are taken through step 31. Assume that the adjacent data points are px and py, and the receiving times of the data points px and py are tx and ty, respectively. According to the receiving time, the time difference between the data points px and py can be calculated as Δt=ty-tx. Then, the time interval of each frame is calculated through step 32. According to the rendering refresh rate f, the time interval of each frame can be calculated as 1 / f.

[0074] According to the time interval Δt between data points and the time interval 1 / f of each frame, the total number of interpolation points that need to be generated between data points px and py can be calculated as follows: After the number of interpolation points is obtained, in step 33, starting from tx, the time t of each interpolation point can be calculated by sequentially superimposing the time interval 1 / f of each frame. i For example, t1 represents the time of the first interpolation point, t2 represents the time of the second interpolation point, and so on. i It can be obtained by i-1 Add a time interval 1 / f to get, that is, t i =t i-1 +1 / f. It should be noted that t1 represents the time of the first interpolation point, and the previous interpolation point of the first interpolation point is the data point px, that is, when i=1, t1=t0+1 / f, where t0=tx.

[0075] Get the time t of each interpolation point i After that, each interpolation point can be calculated by step 34. When calculating the interpolation point, first calculate the time t of the interpolation point i The proportion of time difference Δt Then, according to the proportion, the corresponding interpolation point i between px and py can be obtained as px i =(t i -t x )÷(Δt)×(py-px). Through this method, all interpolation points can be calculated.

[0076] It should be noted that the use of linear interpolation to interpolate all adjacent data points in real-time data is only an implementation in this embodiment and is not intended to limit the present invention. In other embodiments, other interpolation methods, such as spline interpolation, may also be used.

[0077] When using the spline interpolation method, assume that there are three data points P a , Pb and P c , and the corresponding times are t a ,t b and t c Calculate t a and t c When the interpolation point P(t) between b ) 2 +n(tt b )+k, where m, n and k are the coefficients to be determined.

[0078] In order to find the above coefficients, the formula of quadratic spline interpolation needs to satisfy P(t a )=P a , P(t b )=P b , P(t c )=P c By solving the above three-variable equation group, we can get the coefficients m, n and k, that is, we get the formula for quadratic spline interpolation. According to this formula, we can solve the interpolation point P(t) at any time t.

[0079] Based on the same inventive concept, the present invention also provides a system for displaying real-time vehicle trajectories with a controllable refresh rate. Figure 3 For a schematic diagram of a system for displaying a trajectory provided by an embodiment of the present invention, please refer to Figure 3 The system 100 for displaying real-time vehicle trajectories with a controllable refresh rate provided by an embodiment of the present invention includes:

[0080] A receiving module 101 is used to receive real-time data of the vehicle;

[0081] The setting module 102 is used to set a rendering refresh rate f1, which is smaller than a browser refresh rate f2;

[0082] The interpolation module 103 is used to interpolate and supplement frames for all adjacent data points in the real-time data according to the rendering refresh rate f1, and record the corresponding frame rate during the supplementation to obtain the interpolation points between all adjacent data points;

[0083] A setting module 104, used to set the count value to 0;

[0084] An execution module 105 is used to execute the callback function using the requestAnimationFrame method provided by the browser and increase the count value by 1;

[0085] The judgment module 106 is used to judge whether the current count value meets the requirements based on the browser's refresh rate f2 and the rendering refresh rate f1. If it meets the requirements, the method of rendering the interpolation points is executed, and the interpolation points are drawn to the browser using the frame rate corresponding to the frame supplementation, and the count is cleared at the same time; if it does not meet the requirements, it returns to the requestAnimationFrame method provided by the browser to execute the callback function step.

[0086] Specifically, please refer to Figure 3 The system for displaying real-time vehicle trajectories with controllable refresh rate provided by an embodiment of the present invention first receives real-time data pushed by a back-end WebSocket through a receiving module 101, that is, real-time data of the vehicle, such as latitude, longitude, heading angle and other information.

[0087] Usually, when the refresh rate is higher than 30 frames, the human eye can feel smooth playback. Based on this, the present invention customizes the rendering refresh rate f1 through the setting module 102, and makes the browser refresh rate f2 an integer multiple of the rendering refresh rate f1. For example, assuming that the browser refresh rate f2 is 60hz, the rendering refresh rate f1 can be customized to 60hz or 30hz according to the specific needs of the user. In this way, the problem of a fixed high refresh rate display screen consuming more computing resources can be avoided, thereby reducing the performance burden on the browser side and avoiding the problem of waste of resources.

[0088] Generally, the frequency of real-time data upload is low. If it is displayed directly, there will be a problem that the trajectory display is not smooth enough. Therefore, the present invention performs interpolation processing through the interpolation module 103. The interpolation processing can use linear interpolation or nonlinear interpolation (such as spline interpolation or Bezier curve interpolation, etc.).

[0089] In order to ensure that all trajectories can be displayed smoothly, during the interpolation process, all adjacent data points in the real-time data need to be interpolated and supplemented to obtain the interpolation points between all adjacent data points. For example, the part between the first data point and the second data point in the real-time data is interpolated and supplemented to obtain the interpolation points between the first data point and the second data point; the part between the second data point and the third data point is interpolated and supplemented to obtain the interpolation points between the second data point and the third data point, and so on and so forth, until the interpolation processing of all adjacent data points is completed. At the same time, in order to ensure that the rendering frame rate is consistent with the generation frame rate of the interpolation points, each time an interpolation point is generated here, the generation frame rate of the corresponding interpolation point needs to be recorded, so that the same frame rate can be used when rendering the points, so that on the basis of realizing controllable and variable refresh rate, it can be displayed with consistent trajectory and speed, thereby improving the accuracy and consistency of trajectory display.

[0090] After obtaining the interpolation point, the requestAnimationFrame provided by the browser is used as a basis to realize the controllable refresh rate for point rendering. When rendering the point, the callback is used to accumulate the count to determine whether to draw the point. Therefore, the count value is first initialized to 0 by the setting module 104. The execution module 105 uses the requestAnimationFrame method provided by the browser to execute the callback function, and adds 1 to the count value in the callback requestAnimationFrame of each rendering frame to obtain the current count value.

[0091] Then, the judging module 106 judges whether the current count value meets the requirements of the browser refresh rate f2 and the rendering refresh rate f1, for example, whether the current count value is equal to the ratio of the browser refresh rate f2 and the rendering refresh rate f1. Assuming that the display hardware refresh rate is 60hz, the upper limit of the browser refresh rate is 60hz, and if the custom rendering refresh rate is 30hz, when the count value is equal to 2, it means that the current count value meets the requirements, otherwise, it means that the current count value does not meet the requirements.

[0092] When the current count value meets the requirements, the method of rendering the interpolated points is executed. In order to achieve the uniform refresh rate of the generated and rendered points, when executing the method of rendering the interpolated points, the frame rate recorded when the interpolated points are generated is used to draw the corresponding interpolated points to the browser to achieve a smooth display of the trajectory. After each trajectory display is completed, the current count value needs to be cleared so that the cumulative count can be restarted at the next drawing. When the current count value does not meet the requirements, it means that it is necessary to wait for the next callback to continue accumulating the count value. Therefore, it returns to continue to use the requestAnimationFrame method provided by the browser to execute the callback function. It should be noted that when the count value does not meet the requirements and the next callback is executed, the new state is executed.

[0093] The system for real-time vehicle trajectory display with controllable refresh rate provided by the present invention generates interpolation points through an interpolation algorithm. When the vehicle-side data push frequency is lower than the refresh rate, the trajectory points generated after interpolation are used. Compared with directly using the vehicle-side data for trajectory rendering, the real-time trajectory of the vehicle can be rendered more smoothly. The present invention realizes interpolation processing at different refresh rates by customizing the rendering refresh rate. On the one hand, it solves the problem of inconsistent vehicle movement speed on the map caused by the refresh rate fluctuation of the Web browser in the prior art, thereby improving the accuracy and consistency of the trajectory display; on the other hand, it can also reduce the performance burden of the Web browser side, which is conducive to reducing the use of computing and network resources, especially in large-scale vehicle monitoring systems, which can reduce the burden on the server.

[0094] In addition, the present invention allows users to adjust the refresh rate according to their own needs through custom rendering refresh rate to achieve personalized trajectory display, which can meet the different needs of different users for real-time and smoothness of trajectory display, and realize flexible support for user personalized needs.

[0095] Figure 4 For a schematic diagram of the structure of the interpolation module provided in an embodiment of the present invention, please refer to Figure 4 The interpolation module 103 includes: a first calculation module 1031, which is used to set adjacent data points to be px and py, and the receiving times to be tx and ty, and calculate the time difference between the data points px and py to be Δt=ty-tx; a second calculation module 1032, which is used to calculate the time interval of each frame to be 1 / f according to the rendering refresh rate f; a third calculation module 1033, which is used to start from tx, sequentially superimpose the time interval of each frame 1 / f, and calculate the time t of each interpolation point i The fourth calculation module 1034 is used to calculate the time t of the interpolation point i The proportion of the time difference Δt between data points p1 and p2 is calculated to obtain the corresponding interpolation point i.

[0096] Specifically, please refer to Figure 4 In this embodiment, a linear interpolation method is used to interpolate and supplement frames for all adjacent data points in real-time data. First, two adjacent data points are taken through the first calculation module 1031. Assuming that the adjacent data points are px and py, and the receiving times of the data points px and py are tx and ty, respectively, the time difference between the data points px and py can be calculated as Δt=ty-tx according to the receiving time. Then, the time interval of each frame is calculated by the second calculation module 1032. According to the rendering refresh rate f, the time interval of each frame can be calculated as 1 / f.

[0097] According to the time interval Δt between data points and the time interval 1 / f of each frame, the total number of interpolation points that need to be generated between data points px and py can be calculated as follows: After obtaining the number of interpolation points, the third calculation module 1033 starts from tx and calculates the time t of each interpolation point by sequentially superimposing the time interval 1 / f of each frame. i For example, t1 represents the time of the first interpolation point, t2 represents the time of the second interpolation point, and so on. i It can be obtained by i-1 Add a time interval 1 / f to get, that is, t i =t i-1+1 / f. It should be noted that t1 represents the time of the first interpolation point, and the previous interpolation point of the first interpolation point is the data point px, that is, when i=1, t1=t0+1 / f, where t0=tx.

[0098] Get the time t of each interpolation point i After that, each interpolation point can be calculated by the fourth calculation module 1034. When calculating the interpolation point, first calculate the time t of the interpolation point i The proportion of time difference Δt Then, according to the proportion, the corresponding interpolation point i between px and py can be obtained as px i =(t i -t x )÷(Δt)×(py-px). Through this method, all interpolation points can be calculated.

[0099] It should be noted that the use of linear interpolation to interpolate all adjacent data points in real-time data is only an implementation in this embodiment and is not intended to limit the present invention. In other embodiments, other interpolation methods, such as spline interpolation, may also be used.

[0100] When using the spline interpolation method, assume that there are three data points P a , P b and P c , and the corresponding times are t a ,t b and t c Calculate t a and t c When the interpolation point P(t) between b ) 2 +n(tt b )+k, where m, n and k are the coefficients to be determined.

[0101] In order to find the above coefficients, the formula of quadratic spline interpolation needs to satisfy P(t a )=P a , P(t b )=P b , P(t c )=P c By solving the above three-variable equation group, we can get the coefficients m, n and k, that is, we get the formula for quadratic spline interpolation. According to this formula, we can solve the interpolation point P(t) at any time t.

[0102] Those skilled in the art can understand that the accompanying drawings are only schematic diagrams of an embodiment, and the modules or processes in the accompanying drawings are not necessarily required to implement the present invention.

[0103] Those skilled in the art can understand that the modules in the device in the embodiment can be distributed in the device in the embodiment according to the description of the embodiment, or can be changed accordingly and located in one or more devices different from the embodiment. The modules in the above embodiment can be combined into one module, or can be further divided into multiple sub-modules.

[0104] Finally, it should be noted that the above embodiments are only used to illustrate the technical solutions of the present invention, rather than to limit it. Although the present invention has been described in detail with reference to the aforementioned embodiments, those skilled in the art should understand that they can still modify the technical solutions described in the aforementioned embodiments, or make equivalent replacements for some of the technical features therein. However, these modifications or replacements do not deviate the essence of the corresponding technical solutions from the spirit and scope of the technical solutions of the embodiments of the present invention.

Claims

1. A method for displaying real-time vehicle trajectories with a controllable refresh rate, characterized in that: include: Receive real-time data from vehicles; Setting the rendering refresh rate f1 so that the browser refresh rate f2 is an integer multiple of the rendering refresh rate f1; According to the rendering refresh rate f1, interpolation and frame supplementation are performed on all adjacent data points in the real-time data, and the corresponding frame rate during frame supplementation is recorded to obtain interpolation points between all adjacent data points; Set the count value to 0; Utilize the requestAnimationFrame method provided by the browser to execute the callback function and increase the count value by 1; Based on the browser's refresh rate f2 and the rendering refresh rate f1, determine whether the current count value meets the requirements. If so, execute the method of rendering the interpolation points, use the frame rate corresponding to the frame supplementation, draw the interpolation points into the browser, and clear the count at the same time; if not, return to the requestAnimationFrame method provided by the browser to execute the callback function step.

2. The method for displaying real-time vehicle trajectories with controllable refresh rate according to claim 1, characterized in that: Interpolation and frame filling are performed on all adjacent data points in the real-time data, specifically: A linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data.

3. The method for displaying real-time vehicle trajectories with controllable refresh rate according to claim 2, characterized in that: A linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data, specifically: Assume that the adjacent data points are px and py, and the receiving times are tx and ty respectively, then the time difference between the data points px and py is Δt = ty-tx; According to the rendering refresh rate f, the time interval of each frame is calculated to be 1 / f; Starting from tx, the time interval 1 / f of each frame is superimposed in sequence to calculate the time t of each interpolation point i ; According to the time t of the interpolation point i The proportion of the time difference Δt between data points p1 and p2 is calculated to obtain the corresponding interpolation point i.

4. The method for displaying real-time vehicle trajectories with controllable refresh rate according to claim 3, characterized in that: According to the time t of the interpolation point i The proportion of the time difference Δt between the data points px and py is calculated to obtain the corresponding interpolation point i, specifically: px i =(t i -t x )÷(Δt)×(py-px) Among them, t i =t i-1 +1 / f, when i=1, t0=tx.

5. The method for displaying real-time vehicle trajectories with controllable refresh rate according to claim 1, characterized in that: Based on the browser refresh rate f2 and the rendering refresh rate f1, it is determined whether the current count value meets the requirements, specifically: It is determined whether the current count value is equal to the ratio of the browser refresh rate f2 to the rendering refresh rate f1. If so, it indicates that the current count value meets the requirement; if not, it indicates that the current count value does not meet the requirement.

6. A system for displaying real-time vehicle trajectories with a controllable refresh rate, characterized in that: include: A receiving module, used for receiving real-time data of the vehicle; A setting module, used to set a rendering refresh rate f1, wherein the rendering refresh rate f1 is less than a browser refresh rate f2; An interpolation module is used to interpolate and supplement frames for all adjacent data points in the real-time data according to the rendering refresh rate f1, and record the corresponding frame rate during the supplementation to obtain interpolation points between all adjacent data points; Setting module, used to set the count value to 0; An execution module, used for executing the callback function by using the requestAnimationFrame method provided by the browser, and adding 1 to the count value; The judgment module is used to judge whether the current count value meets the requirements based on the browser refresh rate f2 and the rendering refresh rate f1. If it meets the requirements, the method of rendering the interpolation points is executed, and the interpolation points are drawn to the browser using the frame rate corresponding to the frame supplementation, and the count is cleared at the same time; if it does not meet the requirements, it returns to the requestAnimationFrame method provided by the browser to execute the callback function step.

7. The system for displaying real-time vehicle trajectories with controllable refresh rate according to claim 6, characterized in that: The interpolation module is specifically used for: A linear interpolation method is used to interpolate and fill frames for all adjacent data points in the real-time data.

8. The system for displaying real-time vehicle trajectories with controllable refresh rate according to claim 7, characterized in that: The interpolation module comprises: The first calculation module is used to set adjacent data points to be px and py, and the receiving times to be tx and ty, and calculate the time difference between the data points px and py to be Δt=ty-tx; A second calculation module is used to calculate the time interval of each frame as 1 / f according to the rendering refresh rate f; The third calculation module is used to start from tx, sequentially superimpose each frame time interval 1 / f, and calculate the time t of each interpolation point i ; The fourth calculation module is used to calculate the time t of the interpolation point according to the time t i The proportion of the time difference Δt between data points p1 and p2 is calculated to obtain the corresponding interpolation point i.

9. The system for displaying real-time vehicle trajectories with controllable refresh rate according to claim 8, characterized in that: The fourth calculation module is specifically used for: px i =(t i -t x )÷(Δt)×(py-px) Among them, t i =t i-1 +1 / f, when i=1, t0=tx.

10. The system for displaying real-time vehicle trajectories with controllable refresh rate according to claim 6, characterized in that: When judging whether the current count value meets the requirement, the judging module is specifically used to: It is determined whether the current count value is equal to the ratio of the browser refresh rate f2 to the rendering refresh rate f1. If so, it indicates that the current count value meets the requirement; if not, it indicates that the current count value does not meet the requirement.

Images