For a Canvas wave animation, give those two markers different jobs. Hold one marker at x = 1 and calculate its vertical displacement. Track a separate crest by following a constant phase. Put their coordinates beside the drawing so the distinction can be checked.
This original packet pairs a prescribed sine field and expected samples with a Canvas companion. It is not a numerical string, water, or audio solver. The companion displays the prescribed sine field; it does not supply a physical measurement.
Write the field and units first
Use this authored model:
y(x, t) = 0.3 sin((π/2)x − πt).
Here x is expressed in meters, t in seconds, and y in meters. The coefficients correspond to amplitude 0.3 m, wavelength 4 m, period 2 s, and initial phase zero.
| Model field | Authored value |
|---|---|
| Amplitude A | 0.3 m |
| Wavelength λ | 4 m |
| Period T | 2 s |
| Wave number k | π/2 rad/m |
| Angular frequency ω | π rad/s |
| Pattern speed λ/T | 2 m/s to the right |
| Proposed display interval | x from 0 to 8 m; t from 0 to 2 s |
OpenStax distinguishes medium-point motion from wave-pattern motion and describes the traveling sine form with speed λ/T. This packet uses those mathematical facts with its own parameters and sample records. It does not copy the textbook's diagrams or exercises. OpenStax's mathematics of waves.
The axis units are conceptual labels for this model. A screen distance is not a calibrated meter or a measured medium. The field is evaluated directly from x and t, not advanced by solving a physical differential equation.
Hold the tagged coordinate at x = 1
At x = 1:
y(1, t) = 0.3 sin(π/2 − πt).
Review these exact mathematical checkpoints:
| Time t, s | Tagged x, m | Phase | Expected y, m |
|---|---|---|---|
| 0 | 1 | π/2 | +0.3 |
| 0.5 | 1 | 0 | 0 |
| 1 | 1 | −π/2 | −0.3 |
| 2 | 1 | −3π/2 | +0.3 |
The marker's horizontal coordinate stays one. It moves from the upper displacement through zero to the lower displacement and back over the two-second period.
Do not update its x to follow the crest. Doing so would change the marker from a fixed-coordinate sample into a pattern tracker.
The sine evaluations give expected exact values for the authored model. Later floating-point checks need an explicit tolerance. For this packet, propose an absolute y tolerance of 10⁻⁹ m at these checkpoints; confirm the implementation uses and reports that criterion. Displaying a tiny residual as zero must not change the underlying calculation.
Track one crest by its phase
Choose the crest whose phase equals π/2:
(π/2)x − πt = π/2.
Solving gives:
x_c(t) = 1 + 2t.
This crest has y = +0.3 m throughout the chosen interval:
| Time t, s | Tracked crest x, m | Crest y, m |
|---|---|---|
| 0 | 1 | +0.3 |
| 0.5 | 2 | +0.3 |
| 1 | 3 | +0.3 |
| 2 | 5 | +0.3 |
At t = 0, the fixed marker and selected crest coincide. At t = 0.5, the crest is at x = 2, while the fixed marker remains at x = 1 with y = 0. That comparison is the central task.
There are other crests in the periodic field. Keep the selected crest's identity through x_c(t), rather than switching to whichever peak is nearest a screen edge.
The crest travels one meter in half a second, consistent with the authored 2 m/s pattern speed. That speed is not the fixed marker's horizontal speed, which is zero in this model.
Sample the shape at the same current time
At t = 0, the samples x = 0, 1, 2, 3, 4 have y values 0, +0.3, 0, −0.3, 0.
At t = 0.5, those same positions have y values −0.3, 0, +0.3, 0, −0.3. The crest shifts from x = 1 to x = 2.
Keep these samples in a native table and a textual reading alternative. A curve alone makes it harder to inspect the fixed coordinate. The full current curve, fixed marker, crest marker, readouts, and sample table should all derive from the same accepted t.
The later renderer may sample more x positions to draw a readable curve. Record the sampling step and rendering method separately from the model equation. A finite set of points connected on Canvas is a visual approximation, not proof of physical behavior or exact continuous rendering.
Review the prepared comparison
Put the two marker records and the t = 0.5 comparison next to the drawing: fixed x = 1, y = 0; tracked crest x = 2, y = 0.3.
Keep native formula, source revisions, expected samples, and actual tests authoritative. Saving and rendering a page does not establish that animation scripts, sliders, or hosted controls work. Test those functions again when adapting the companion.
The reading copy should make the marker labels visible without relying only on color. Show “Fixed coordinate x = 1” and “Tracked crest x_c” with their values. The textual samples remain useful when the drawing is unavailable.
Map upward model displacement to Canvas deliberately
Canvas screen y increases downward, while this model displays positive displacement upward. Define a mapping instead of changing the sine sign to make the drawing look right. MDN's Canvas coordinate grid.
pixel_y = baseline_y − vertical_scale × model_y.
Use a positive vertical scale with units pixels per model meter. Map x from 0 to 8 into the chosen drawing width using a separate horizontal scale. These display choices do not alter x, t, wavelength, or pattern speed.
Actual width, height, backing-store scaling, baseline and plot margins are implementation inputs to record later. Resizing the display should redraw the same current model state, not change its physical labels or advance time.
Verify the mapping with the fixed marker at t = 0 and t = 1: +0.3 should be above the baseline, −0.3 below. Use the companion’s fixed marker and numeric readouts to compare the two positions.
Make time state consistent
Start the companion paused at t = 0. Provide a labeled time slider over 0–2 s and snapshot buttons for 0, 0.5, 1, and 2. Manual time selection stops any clock before updating all outputs.
Optional Play/Pause would have one user-started clock and no autoplay. For this design, time advances at one model second per active real second and stops at t = 2. Play resumes a paused intermediate time; at the endpoint, a new user-started pass begins at zero.
Repeated Play cannot create extra loops. Pause freezes the accepted time. Hidden-page suspension pauses and requires manual resume. Old callbacks must not overwrite a scrubbed, reset, invalid, or revised source state.
Reset stops the clock, returns t = 0, restores the original model and clears validation messages. Reduced motion keeps the manual snapshots available and disables playback in this design. A preference change during playback stops the clock.
Invalid or nonfinite time, time outside the declared interval, or unvalidated model inputs must clear accepted output and stop playback. Formula or source changes need fresh sample checks before a revised view is accepted. Actual keyboard/focus, timing, reduced-motion, text-alternative, article-width, narrow layout and host observations remain pending.
Copy this prompt for the wave packet
Create one complete, self-contained US-English HTML companion for “Traveling Wave · Fixed Point and Crest”. Return the full HTML document, with inline CSS and any JavaScript needed for the local interactions. Use the original scenario, named records, numbers and expected cases below.
Design the page for this task: use clearly labeled input or source records, a readable result or worked example, and an adjacent explanation of the evidence. Use a restrained visual hierarchy, left-aligned text, readable tables or stacked records, and a responsive layout at 720px and 360px. Provide meaningful labeled controls for 0 s; 0.5 s; 1 s; 2 s; Play; Pause; Reset. Use keyboard-accessible native controls and visible focus. Keep the complete content readable without an external dependency.
The following brief supplies the substantive content and constraints. Native-format requests describe the material to represent or copy manually; this HTML must not pretend to create DOCX, XLSX, PDF, PPTX, H5P or another native file, run Python/Flask/Django/Snowflake/Power BI, connect a live service, send messages, or perform an authorized real-world action. Where the task requires a native source, actual observation or separate approval, retain that requirement and leave unsupplied evidence blank.
Prepare an original English Canvas-wave authoring packet. Do not claim physical simulation or captured runtime results, record devices,
copy textbook art/examples, perform experiments, capture or publish.
Prescribed mathematical field only:
A = 0.3 m, wavelength = 4 m, period = 2 s, phase = 0.
y(x,t) = 0.3 sin((pi/2)x - pi*t). Rightward pattern speed = 4/2 = 2 m/s. Conceptual domain x = 0..8 m, time = 0..2 s. Not a PDE/string/water/audio solver or calibrated measurement.
Fixed-coordinate marker x = 1:
t = 0 -> y = +0.3.
t = 0.5 -> y = 0.
t = 1 -> y = -0.3.
t = 2 -> y = +0.3. Its x never changes. Selected crest at phase pi/2:
x_c(t) = 1 + 2t, y = +0.3.
t = 0 gives x = 1; t = 0.5 gives x = 2;
t = 1 gives x = 3; t = 2 gives x = 5. Do not move the fixed marker with the crest or switch crest identity.
Sample expectations:
x = 0/1/2/3/4 at t = 0 -> y = 0/+0.3/0/-0.3/0. Same positions at t = 0.5 -> y = -0.3/0/+0.3/0/-0.3. Proposed checkpoint absolute y tolerance 1e-9 m; actual tests pending. Keep raw values and display-zero normalization separate.
Deliver native formula/parameter/source record, fixed/crest sample tables,
textual reading alternative, expected-case matrix and blank actual output. All geometry and readouts derive from the same accepted x/t formula. Record drawing sample step separately from the continuous model.
Proposed Canvas mapping:
pixel_y = baseline_y - positive_vertical_scale * model_y. Horizontal scale maps x = 0..8 to display width. Record backing-store scaling/margins; resize redraws current time. No change to physical labels, speed or model merely to fit pixels.
Local controls to implement:
Paused at t = 0. Slider range 0..2 and buttons for 0/0.5/1/2. Manual selection stops the clock and refreshes all outputs. Optional Play/Pause: no autoplay, one clock, one model second per active
real second, stop at t = 2; resume intermediate time or restart at 0
when at the endpoint. Repeated Play cannot add loops. Hidden page pauses, manual resume. Stale callbacks cannot overwrite scrub/reset/invalid/revised state. Reset the original model at t = 0 with cleared messages. Reduced motion manual-only; preference change stops playback. Invalid/nonfinite/out-of-range time clears accepted output and stops. Changed formula/source requires fresh native acceptance.
Plan actual numerical, pixel direction, fixed/crest distinction, sampling,
clock, keyboard/focus, reduced-motion, text fallback, host, article-width
and narrow layout checks. No passed test or learning effect claimed.
Native sources/tests remain authoritative. No verified hosted animation, controls, saved state or physical solver. End with a CTA for the prepared comparison copy.
COMPLETE AUTHORED SCENARIO AND EXPECTED CASES
The following is the supplied reading/teaching/calculation record to represent in the companion. Preserve its particular content, examples, source references and unknowns. Wording about a future native implementation refers to that native task, not permission to omit this HTML companion.
# Canvas Wave Animation: Follow a Fixed Point and a Moving Crest
Your wave travels to the right, so you make the highlighted dot travel right too. The animation looks convincing, but it no longer shows the displacement at one fixed position. A learner cannot tell whether the dot represents the pattern or a tagged coordinate.
For a Canvas wave animation, give those two markers different jobs. Hold one marker at x = 1 and calculate its vertical displacement. Track a separate crest by following a constant phase. Put their coordinates beside the drawing so the distinction can be checked.
This original packet pairs a prescribed sine field and expected samples with a Canvas companion. It is not a numerical string, water, or audio solver. The companion displays the prescribed sine field; it does not supply a physical measurement.
## Write the field and units first
Use this authored model:
**y(x, t) = 0.3 sin((π/2)x − πt).**
Here x is expressed in meters, t in seconds, and y in meters. The coefficients correspond to amplitude 0.3 m, wavelength 4 m, period 2 s, and initial phase zero.
| Model field | Authored value |
| --- | --- |
| Amplitude A | 0.3 m |
| Wavelength λ | 4 m |
| Period T | 2 s |
| Wave number k | π/2 rad/m |
| Angular frequency ω | π rad/s |
| Pattern speed λ/T | 2 m/s to the right |
| Proposed display interval | x from 0 to 8 m; t from 0 to 2 s |
OpenStax distinguishes medium-point motion from wave-pattern motion and describes the traveling sine form with speed λ/T. This packet uses those mathematical facts with its own parameters and sample records. It does not copy the textbook's diagrams or exercises. [OpenStax's mathematics of waves](https://openstax.org/books/university-physics-volume-1/pages/16-2-mathematics-of-waves).
The axis units are conceptual labels for this model. A screen distance is not a calibrated meter or a measured medium. The field is evaluated directly from x and t, not advanced by solving a physical differential equation.
## Hold the tagged coordinate at x = 1
At x = 1:
**y(1, t) = 0.3 sin(π/2 − πt).**
Review these exact mathematical checkpoints:
| Time t, s | Tagged x, m | Phase | Expected y, m |
| --- | --- | --- | --- |
| 0 | 1 | π/2 | +0.3 |
| 0.5 | 1 | 0 | 0 |
| 1 | 1 | −π/2 | −0.3 |
| 2 | 1 | −3π/2 | +0.3 |
The marker's horizontal coordinate stays one. It moves from the upper displacement through zero to the lower displacement and back over the two-second period.
Do not update its x to follow the crest. Doing so would change the marker from a fixed-coordinate sample into a pattern tracker.
The sine evaluations give expected exact values for the authored model. Later floating-point checks need an explicit tolerance. For this packet, propose an absolute y tolerance of 10⁻⁹ m at these checkpoints; confirm the implementation uses and reports that criterion. Displaying a tiny residual as zero must not change the underlying calculation.
## Track one crest by its phase
Choose the crest whose phase equals π/2:
**(π/2)x − πt = π/2.**
Solving gives:
**x_c(t) = 1 + 2t.**
This crest has y = +0.3 m throughout the chosen interval:
| Time t, s | Tracked crest x, m | Crest y, m |
| --- | --- | --- |
| 0 | 1 | +0.3 |
| 0.5 | 2 | +0.3 |
| 1 | 3 | +0.3 |
| 2 | 5 | +0.3 |
At t = 0, the fixed marker and selected crest coincide. At t = 0.5, the crest is at x = 2, while the fixed marker remains at x = 1 with y = 0. That comparison is the central task.
There are other crests in the periodic field. Keep the selected crest's identity through x_c(t), rather than switching to whichever peak is nearest a screen edge.
The crest travels one meter in half a second, consistent with the authored 2 m/s pattern speed. That speed is not the fixed marker's horizontal speed, which is zero in this model.
## Sample the shape at the same current time
At t = 0, the samples x = 0, 1, 2, 3, 4 have y values 0, +0.3, 0, −0.3, 0.
At t = 0.5, those same positions have y values −0.3, 0, +0.3, 0, −0.3. The crest shifts from x = 1 to x = 2.
Keep these samples in a native table and a textual reading alternative. A curve alone makes it harder to inspect the fixed coordinate. The full current curve, fixed marker, crest marker, readouts, and sample table should all derive from the same accepted t.
The later renderer may sample more x positions to draw a readable curve. Record the sampling step and rendering method separately from the model equation. A finite set of points connected on Canvas is a visual approximation, not proof of physical behavior or exact continuous rendering.
## Review the prepared comparison in NOS
Put the two marker records and the t = 0.5 comparison next to the drawing: fixed x = 1, y = 0; tracked crest x = 2, y = 0.3.
Keep native formula, source revisions, expected samples, and actual tests authoritative. Saving and rendering a page does not establish that animation scripts, sliders, or hosted controls work. Test those functions again when adapting the companion.
The reading copy should make the marker labels visible without relying only on color. Show “Fixed coordinate x = 1” and “Tracked crest x_c” with their values. The textual samples remain useful when the drawing is unavailable.
## Map upward model displacement to Canvas deliberately
Canvas screen y increases downward, while this model displays positive displacement upward. Define a mapping instead of changing the sine sign to make the drawing look right. [MDN's Canvas coordinate grid](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Drawing_shapes).
**pixel_y = baseline_y − vertical_scale × model_y.**
Use a positive vertical scale with units pixels per model meter. Map x from 0 to 8 into the chosen drawing width using a separate horizontal scale. These display choices do not alter x, t, wavelength, or pattern speed.
Actual width, height, backing-store scaling, baseline and plot margins are implementation inputs to record later. Resizing the display should redraw the same current model state, not change its physical labels or advance time.
Verify the mapping with the fixed marker at t = 0 and t = 1: +0.3 should be above the baseline, −0.3 below. Use the companion’s fixed marker and numeric readouts to compare the two positions.
## Make time state consistent
Start the companion paused at t = 0. Provide a labeled time slider over 0–2 s and snapshot buttons for 0, 0.5, 1, and 2. Manual time selection stops any clock before updating all outputs.
Optional Play/Pause would have one user-started clock and no autoplay. For this design, time advances at one model second per active real second and stops at t = 2. Play resumes a paused intermediate time; at the endpoint, a new user-started pass begins at zero.
Repeated Play cannot create extra loops. Pause freezes the accepted time. Hidden-page suspension pauses and requires manual resume. Old callbacks must not overwrite a scrubbed, reset, invalid, or revised source state.
Reset stops the clock, returns t = 0, restores the original model and clears validation messages. Reduced motion keeps the manual snapshots available and disables playback in this design. A preference change during playback stops the clock.
Invalid or nonfinite time, time outside the declared interval, or unvalidated model inputs must clear accepted output and stop playback. Formula or source changes need fresh sample checks before a revised view is accepted. Actual keyboard/focus, timing, reduced-motion, text-alternative, article-width, narrow layout and host observations remain pending.
Implement the local companion rather than returning a text-only plan. Preserve every numerical fixture and the distinction between illustrative expectations and actual evidence. Any native-runtime or classroom tests mentioned above remain tests to perform in the proper environment; do not mark them passed. Keep edits and practice responses in this open page only, without claiming persistent storage. Provide invalid/missing-input feedback and reset behavior that agree with this specific brief. Do not claim accessibility certification, learning gains, real approvals or test results that were not observed.
At half a second, keep x = 1 on the baseline and the tracked crest at x = 2, and let that difference explain what is moving.