Web-based experimental waveform inversion method

Abstract

The application discloses a Web-based experimental waveform inversion method and belongs to the technical field of web platform teaching, and aims to solve the problem that the teaching effect of the waveform data inversion mode of a Web end is poor in online experimental teaching. The drawing process of the experimental waveform is inverted through the simulation of the acquisition of experimental waveform data. Meanwhile, only the experimental waveform of the visible area is drawn on the Canvas, so as to reduce the rendering pressure of the Web end. When there are multiple experimental waveform data points on the same vertical direction pixel line of the experimental waveform curve, only the maximum and minimum values are drawn, so as to reduce the rendering pressure of the Web end and ensure that the shape of the experimental waveform is unchanged. The time and amplitude of the experimental waveform interval are measured through the experimental waveform measurement tool, and the interactive events and examination questions are triggered in the experimental waveform drawing process, so as to facilitate the insertion of knowledge points and the examination. The inversion process is combined with experimental videos and animations for teaching and demonstration and the data of students are recorded, so as to facilitate the teaching statistics. The application is suitable for the Web-based experimental waveform inversion method.

Description

Technical Field

[0001] This invention belongs to the field of web platform teaching technology, specifically involving a web-based experimental waveform inversion method. Background Technology

[0002] The development of the internet age has greatly promoted the informatization of education. Many schools have established information-based teaching systems. Online experimental teaching, as an emerging teaching model, has become a beneficial supplement to traditional offline teaching. Teachers upload experimental videos and waveform files to online experimental courses. Students learn experimental courses online, train their thinking skills, master relevant experimental knowledge, and improve their experimental operation skills.

[0003] Currently, the main method for waveform data inversion on the web is based on the HTML5 Canvas API. This involves requesting waveform configuration and data from the server, drawing time and amplitude scales on the Canvas according to the waveform configuration, calculating waveform data points based on the currently visible area of ​​the waveform, connecting them to form a curve, and then drawing it onto the Canvas. The waveform can be panned and scaled using the waveform control area. However, this current web-based method of waveform data inversion is not very effective for online experimental teaching. Specifically:

[0004] 1. The process of drawing experimental waveforms cannot be reversed. Like a line graph, all experimental waveform data points are directly displayed, preventing students from experiencing the real-time changes of the waveforms and resulting in a weak sense of immersion.

[0005] 2. The inability to add interactive events and test questions results in a lack of student engagement, and the teaching fails to achieve its training objectives.

[0006] 3. Experimental waveforms, videos, and animations need to be opened separately, requiring students to switch back and forth between videos, animations, and waveforms during the learning process, which is extremely inconvenient.

[0007] 4. The lack of experimental waveform measurement tools makes it inconvenient for students to measure waveforms.

[0008] 5. Without tracking students' learning progress, teachers are unable to ascertain students' learning status. Summary of the Invention

[0009] The purpose of this invention is to overcome the shortcomings of existing online experimental teaching technologies and provide a Web-based experimental waveform inversion method.

[0010] The technical solution adopted in this invention is as follows:

[0011] A web-based experimental waveform inversion method includes the following steps:

[0012] (1) Import the experimental waveform file into the Web client, and use JavaScript to parse the waveform channels, waveform sampling rate, waveform data points, and waveform label data contained in the file; calculate the interval sampling time of the waveform data points based on the waveform sampling rate to obtain the original sampling speed of the waveform;

[0013] (2) Generate identical waveform drawing areas on the Canvas according to the number of waveform channels, and distribute them vertically on the Canvas; the waveform drawing areas include, but are not limited to, rulers, waveform curves, and waveform labels;

[0014] (3) By configuring waveform parameters, the style and content display of the ruler, waveform curve, and waveform label can be customized; the actual sampling speed of the waveform can be calculated based on the original sampling speed and sampling speed multiplier value; the waveform drawing speed can be controlled by modifying the sampling speed multiplier value.

[0015] (4) Based on the configuration parameters of the time scale and amplitude scale, calculate the mapping relationship between the pixels on the Canvas and the scale values, and realize the conversion of waveform data point coordinates into pixel coordinates on the Canvas;

[0016] (5) The current time increment is used to drive the simulation acquisition of waveform data and the updating of waveform drawing through requestAnimationFrame, thereby realizing the inversion of the experimental waveform drawing process;

[0017] (6) The time and amplitude of the experimental waveform interval are measured by the experimental waveform measurement tool; the time difference between the two auxiliary lines perpendicular to the time scale is automatically calculated by horizontally shifting the two auxiliary lines, so as to realize the measurement of the waveform interval time; the amplitude difference between the two auxiliary lines is automatically calculated by vertically shifting the two auxiliary lines perpendicular to the amplitude scale, so as to realize the measurement of the waveform interval amplitude.

[0018] (7) Monitor the current waveform acquisition progress. When the waveform acquisition progress reaches the preset value, a preset event is triggered. When the event is triggered, the waveform acquisition and drawing are paused. When the event ends, the waveform acquisition and drawing are resumed. Interactive events and test questions are interspersed during the experimental waveform drawing process to realize the addition and assessment of knowledge points.

[0019] (8) Import experimental video and animation resources into the Web terminal, and trigger the playback of experimental video and animation by setting the playback events of the video and animation when the waveform acquisition progress reaches the preset value or by other events; listen for the video and animation playback end event, and trigger the preset event when the playback ends;

[0020] (9) After the experimental waveform is drawn, the start time, end time, event record, and test score of this learning experiment waveform are processed into JSON format by clicking the submit button and sent back to the platform via AJAX to generate learning records and realize teaching statistics.

[0021] Furthermore, step (5) also includes:

[0022] (5.1) Simulated sampling: According to the actual sampling speed of the waveform, the waveform data is collected sequentially from the first point to the next at regular intervals. After each collection, the position of the most recent collection point is updated, i.e. the waveform collection progress. The waveform data that has been collected is obtained according to the waveform collection progress.

[0023] (5.2) Waveform drawing: In order to reduce the rendering pressure of waveforms on the Web, only the waveform within the current visible area is drawn. The number of waveform data points required for the current visible area is calculated by the sampling rate and the time range of the visible area. The required waveform data points are obtained from the collected waveform data in order of sampling time from near to far, and converted into coordinate points on the Canvas. These points are connected in sequence to form a continuous curve by drawing line segments on the Canvas. Only the two waveform data points with the largest and smallest amplitudes are drawn on the same vertical pixel line, which reduces the rendering pressure on the Web and ensures that the shape of the waveform remains unchanged.

[0024] (5.3) Waveform Labels: Waveform labels mark the waveform curves, record the current marked time and label content. Based on the time value marked by the waveform label, the waveform data points with the same time value as the waveform label are associated together. When the associated waveform data point is drawn, a dashed line perpendicular to the time scale will be drawn on the current time value. The label content will be drawn next to the dashed line by drawing text using Canvas.

[0025] (5.4) Waveform control: The waveform drawing is controlled by controlling the start, pause, continue and reset of the waveform data simulation sampling. The waveform translation and scaling are controlled by adjusting the range of the waveform scale.

[0026] In summary, due to the adoption of the above technical solution, the beneficial effects of the present invention are:

[0027] 1. In this invention, the experimental waveform drawing process is inverted by simulating the acquisition of experimental waveform data. Simultaneously, only the visible area of ​​the experimental waveform is drawn on the Canvas, effectively reducing the rendering pressure on the web client. When there are multiple experimental waveform data points on the same vertical pixel line, only the maximum and minimum values ​​are drawn, reducing the rendering pressure on the web client while ensuring the shape of the experimental waveform remains unchanged. The experimental waveform measurement tool measures the time and amplitude of the experimental waveform interval. Interactive events and quizzes can be triggered during the experimental waveform drawing process, facilitating the insertion and assessment of knowledge points. Simultaneously with the experimental waveform inversion process, experimental videos and animations are used for teaching and demonstrations to students, and data such as the start time, end time, operation steps, and scores of each student's learning session are recorded for convenient teaching statistics. Detailed Implementation

[0028] To make the objectives, technical solutions, and advantages of this invention clearer, the invention will be further described in detail below with reference to embodiments. It should be understood that the specific embodiments described herein are merely illustrative and not intended to limit the invention.

[0029] A web-based experimental waveform inversion method includes the following steps:

[0030] (1) Import the experimental waveform file into the Web client, and use JavaScript to parse the waveform channels, waveform sampling rate, waveform data points, and waveform label data contained in the file; calculate the interval sampling time of the waveform data points based on the waveform sampling rate to obtain the original sampling speed of the waveform;

[0031] (2) Generate identical waveform drawing areas on the Canvas according to the number of waveform channels, and distribute them vertically on the Canvas; the waveform drawing areas include, but are not limited to, rulers, waveform curves, and waveform labels;

[0032] (3) By configuring waveform parameters, the style and content display of the ruler, waveform curve, and waveform label can be customized; the actual sampling speed of the waveform can be calculated based on the original sampling speed and sampling speed multiplier value; the waveform drawing speed can be controlled by modifying the sampling speed multiplier value.

[0033] (4) Based on the configuration parameters of the time scale and amplitude scale, calculate the mapping relationship between the pixels on the Canvas and the scale values, and realize the conversion of waveform data point coordinates into pixel coordinates on the Canvas;

[0034] (5) The current time increment is used to drive the simulation acquisition of waveform data and the updating of waveform drawing through requestAnimationFrame, thereby realizing the inversion of the experimental waveform drawing process;

[0035] (6) The time and amplitude of the experimental waveform interval are measured by the experimental waveform measurement tool; the time difference between the two auxiliary lines perpendicular to the time scale is automatically calculated by horizontally shifting the two auxiliary lines, so as to realize the measurement of the waveform interval time; the amplitude difference between the two auxiliary lines is automatically calculated by vertically shifting the two auxiliary lines perpendicular to the amplitude scale, so as to realize the measurement of the waveform interval amplitude.

[0036] (7) Monitor the current waveform acquisition progress. When the waveform acquisition progress reaches the preset value, a preset event is triggered. When the event is triggered, the waveform acquisition and drawing are paused. When the event ends, the waveform acquisition and drawing are resumed. Interactive events and test questions are interspersed during the experimental waveform drawing process to realize the addition and assessment of knowledge points.

[0037] (8) Import experimental video and animation resources into the Web terminal, and trigger the playback of experimental video and animation by setting the playback events of the video and animation when the waveform acquisition progress reaches the preset value or by other events; listen for the video and animation playback end event, and trigger the preset event when the playback ends;

[0038] (9) After the experimental waveform is drawn, the start time, end time, event record, and test score of this learning experiment waveform are processed into JSON format by clicking the submit button and sent back to the platform via AJAX to generate learning records and realize teaching statistics.

[0039] Furthermore, step (5) also includes:

[0040] (5.1) Simulated sampling: According to the actual sampling speed of the waveform, the waveform data is collected sequentially from the first point to the next at regular intervals. After each collection, the position of the most recent collection point is updated, i.e. the waveform collection progress. The waveform data that has been collected is obtained according to the waveform collection progress.

[0041] (5.2) Waveform drawing: In order to reduce the rendering pressure of waveforms on the Web, only the waveform within the current visible area is drawn. The number of waveform data points required for the current visible area is calculated by the sampling rate and the time range of the visible area. The required waveform data points are obtained from the collected waveform data in order of sampling time from near to far, and converted into coordinate points on the Canvas. These points are connected in sequence to form a continuous curve by drawing line segments on the Canvas. Only the two waveform data points with the largest and smallest amplitudes are drawn on the same vertical pixel line, which reduces the rendering pressure on the Web and ensures that the shape of the waveform remains unchanged.

[0042] (5.3) Waveform Labels: Waveform labels mark the waveform curves, record the current marked time and label content. Based on the time value marked by the waveform label, the waveform data points with the same time value as the waveform label are associated together. When the associated waveform data point is drawn, a dashed line perpendicular to the time scale will be drawn on the current time value. The label content will be drawn next to the dashed line by drawing text using Canvas.

[0043] (5.4) Waveform control: The waveform drawing is controlled by controlling the start, pause, continue and reset of the waveform data simulation sampling. The waveform translation and scaling are controlled by adjusting the range of the waveform scale.

[0044] In its implementation, this invention simulates the acquisition of experimental waveform data and inverts the waveform drawing process. Simultaneously, only the visible area of ​​the experimental waveform is drawn on the Canvas, effectively reducing the rendering pressure on the web client. When there are multiple experimental waveform data points on the same vertical pixel line, only the maximum and minimum values ​​are drawn, reducing the rendering pressure on the web client while ensuring the shape of the experimental waveform remains unchanged. Experimental waveform measurement tools are used to measure the time and amplitude of the experimental waveform intervals. Interactive events and quizzes can be triggered during the waveform drawing process, facilitating the insertion and assessment of knowledge points. Simultaneously with the waveform inversion process, experimental videos and animations are used for teaching and demonstrations to students, and data such as the start and end times, operation steps, and scores of each student's learning session are recorded for convenient teaching statistics.

[0045] Example 1

[0046] A web-based experimental waveform inversion method includes the following steps:

[0047] (1) Import the experimental waveform file into the Web client, and use JavaScript to parse the waveform channels, waveform sampling rate, waveform data points, and waveform label data contained in the file; calculate the interval sampling time of the waveform data points based on the waveform sampling rate to obtain the original sampling speed of the waveform;

[0048] (2) Generate identical waveform drawing areas on the Canvas according to the number of waveform channels, and distribute them vertically on the Canvas; the waveform drawing areas include, but are not limited to, rulers, waveform curves, and waveform labels;

[0049] (3) By configuring waveform parameters, the style and content display of the ruler, waveform curve, and waveform label can be customized; the actual sampling speed of the waveform can be calculated based on the original sampling speed and sampling speed multiplier value; the waveform drawing speed can be controlled by modifying the sampling speed multiplier value.

[0050] (4) Based on the configuration parameters of the time scale and amplitude scale, calculate the mapping relationship between the pixels on the Canvas and the scale values, and realize the conversion of waveform data point coordinates into pixel coordinates on the Canvas;

[0051] (5) The current time increment is used to drive the simulation acquisition of waveform data and the updating of waveform drawing through requestAnimationFrame, thereby realizing the inversion of the experimental waveform drawing process;

[0052] (6) The time and amplitude of the experimental waveform interval are measured by the experimental waveform measurement tool; the time difference between the two auxiliary lines perpendicular to the time scale is automatically calculated by horizontally shifting the two auxiliary lines, so as to realize the measurement of the waveform interval time; the amplitude difference between the two auxiliary lines is automatically calculated by vertically shifting the two auxiliary lines perpendicular to the amplitude scale, so as to realize the measurement of the waveform interval amplitude.

[0053] (7) Monitor the current waveform acquisition progress. When the waveform acquisition progress reaches the preset value, a preset event is triggered. When the event is triggered, the waveform acquisition and drawing are paused. When the event ends, the waveform acquisition and drawing are resumed. Interactive events and test questions are interspersed during the experimental waveform drawing process to realize the addition and assessment of knowledge points.

[0054] (8) Import experimental video and animation resources into the Web terminal, and trigger the playback of experimental video and animation by setting the playback events of the video and animation when the waveform acquisition progress reaches the preset value or by other events; listen for the video and animation playback end event, and trigger the preset event when the playback ends;

[0055] (9) After the experimental waveform is drawn, the start time, end time, event record, and test score of this learning experiment waveform are processed into JSON format by clicking the submit button and sent back to the platform via AJAX to generate learning records and realize teaching statistics.

[0056] Example 2

[0057] Based on Example 1, step (5) further includes:

[0058] (5.1) Simulated sampling: According to the actual sampling speed of the waveform, the waveform data is collected sequentially from the first point to the next at regular intervals. After each collection, the position of the most recent collection point is updated, i.e. the waveform collection progress. The waveform data that has been collected is obtained according to the waveform collection progress.

[0059] (5.2) Waveform drawing: In order to reduce the rendering pressure of waveforms on the Web, only the waveform within the current visible area is drawn. The number of waveform data points required for the current visible area is calculated by the sampling rate and the time range of the visible area. The required waveform data points are obtained from the collected waveform data in order of sampling time from near to far, and converted into coordinate points on the Canvas. These points are connected in sequence to form a continuous curve by drawing line segments on the Canvas. Only the two waveform data points with the largest and smallest amplitudes are drawn on the same vertical pixel line, which reduces the rendering pressure on the Web and ensures that the shape of the waveform remains unchanged.

[0060] (5.3) Waveform Labels: Waveform labels mark the waveform curves, record the current marked time and label content. Based on the time value marked by the waveform label, the waveform data points with the same time value as the waveform label are associated together. When the associated waveform data point is drawn, a dashed line perpendicular to the time scale will be drawn on the current time value. The label content will be drawn next to the dashed line by drawing text using Canvas.

[0061] (5.4) Waveform control: The waveform drawing is controlled by controlling the start, pause, continue and reset of the waveform data simulation sampling. The waveform translation and scaling are controlled by adjusting the range of the waveform scale.

[0062] The above description constitutes an embodiment of the present invention. The foregoing descriptions are preferred embodiments of the present invention. Unless there is a clear contradiction or a prerequisite for a particular preferred embodiment, the preferred embodiments can be arbitrarily combined and used. The embodiments and specific parameters described are merely for clearly illustrating the verification process of the invention and are not intended to limit the scope of patent protection of the present invention. The scope of patent protection of the present invention is still determined by its claims. Similarly, any equivalent structural changes made using the content of the present invention should also be included within the scope of protection of the present invention.

Claims

1. A Web-based experimental waveform inversion method, characterized in that, Includes the following steps (1) Import the experimental waveform file into the Web client, and use JavaScript to parse the waveform channels, waveform sampling rate, waveform data points, and waveform label data contained in the file; calculate the interval sampling time of the waveform data points based on the waveform sampling rate to obtain the original sampling speed of the waveform; (2) Generate identical waveform drawing areas on the Canvas according to the number of waveform channels, and distribute them vertically on the Canvas; the waveform drawing areas include, but are not limited to, rulers, waveform curves, and waveform labels; (3) By configuring waveform parameters, the style and content display of the ruler, waveform curve, and waveform label can be customized; the actual sampling speed of the waveform can be calculated based on the original sampling speed and sampling speed multiplier value; the waveform drawing speed can be controlled by modifying the sampling speed multiplier value. (4) Based on the configuration parameters of the time scale and amplitude scale, calculate the mapping relationship between the pixels on the Canvas and the scale values, and realize the conversion of waveform data point coordinates into pixel coordinates on the Canvas; (5) The current time increment is used to drive the simulation acquisition of waveform data and the updating of waveform drawing through requestAnimationFrame, thereby realizing the inversion of the experimental waveform drawing process; (6) The time and amplitude of the experimental waveform interval are measured by the experimental waveform measurement tool; the time difference between the two auxiliary lines perpendicular to the time scale is automatically calculated by horizontally shifting the two auxiliary lines, so as to realize the measurement of the waveform interval time; the amplitude difference between the two auxiliary lines is automatically calculated by vertically shifting the two auxiliary lines perpendicular to the amplitude scale, so as to realize the measurement of the waveform interval amplitude. (7) Monitor the current waveform acquisition progress. When the waveform acquisition progress reaches the preset value, a preset event is triggered. When the event is triggered, the waveform acquisition and drawing are paused. When the event ends, the waveform acquisition and drawing are resumed. Interactive events and test questions are interspersed during the experimental waveform drawing process to realize the addition and assessment of knowledge points. (8) Import experimental video and animation resources into the Web terminal, and trigger the playback of experimental video and animation by setting the playback events of the video and animation when the waveform acquisition progress reaches the preset value or by other events; listen for the video and animation playback end event, and trigger the preset event when the playback ends; (9) After the experimental waveform is drawn, the start time, end time, event record, and test score of this learning experiment waveform are processed into JSON format by clicking the submit button and sent back to the platform via AJAX to generate learning records and realize teaching statistics.

2. The Web-based experimental waveform inversion method according to claim 1, characterized in that, Step (5) also includes: (5.1) Simulated sampling: According to the actual sampling speed of the waveform, the waveform data is collected sequentially from the first point to the next at regular intervals. After each collection, the position of the most recent collection point is updated, i.e. the waveform collection progress. The waveform data that has been collected is obtained according to the waveform collection progress. (5.2) Waveform drawing: In order to reduce the rendering pressure of waveforms on the Web, only the waveform within the current visible area is drawn. The number of waveform data points required for the current visible area is calculated by the sampling rate and the time range of the visible area. The required waveform data points are obtained from the collected waveform data in order of sampling time from near to far, and converted into coordinate points on the Canvas. These points are connected in sequence to form a continuous curve by drawing line segments on the Canvas. Only the two waveform data points with the largest and smallest amplitudes are drawn on the same vertical pixel line, which reduces the rendering pressure on the Web and ensures that the shape of the waveform remains unchanged. (5.3) Waveform Labels: Waveform labels mark the waveform curves, record the current marked time and label content. Based on the time value marked by the waveform label, the waveform data points with the same time value as the waveform label are associated together. When the associated waveform data point is drawn, a dashed line perpendicular to the time scale will be drawn on the current time value. The label content will be drawn next to the dashed line by drawing text using Canvas. (5.4) Waveform control: The waveform drawing is controlled by controlling the start, pause, continue and reset of the waveform data simulation sampling. The waveform translation and scaling are controlled by adjusting the range of the waveform scale.