react-native-vroom-chart 0.16.0 → 0.17.0

package/cpp/_core_src/chart.h

@@ -92,6 +92,42 @@ struct VroomChart {
     // is_animating_now keeps the host's redraw loop alive (see tip_pulse.h).
     float tip_pulse_elapsed_s = 0.f;
 
+    // --- loading line -------------------------------------------------------
+    // See loading_line.h for the three stages this state drives.
+    //
+    // Authoritative, not inferred: the host tells us it's loading *and* that it
+    // has no data, because an empty `candles` alone can't be trusted here. The
+    // hosts' data effects skip pushing an empty array (it would read as "hold
+    // the last frame"), so a chart mid-asset-switch can be loading while still
+    // holding the previous asset's bars — inferring from emptiness would show
+    // that stale series as if it were the new one's.
+    //
+    // True for stages 1 and 2 both: the line stands in for the chart until the
+    // candles actually take over in stage 3.
+    bool loading = false;
+    // Whether the wave travels. Cleared for reduced motion, which both freezes
+    // the line at phase 0 and keeps is_animating_now from pinning a host loop.
+    bool loading_animate = true;
+    // Phase of the wave, in seconds, advanced by begin_frame like the tip pulse
+    // above and wrapped for the same reason.
+    float loading_elapsed_s = 0.f;
+    // Fades the line in on arrival, so a chart that resolves instantly from
+    // cache doesn't flash a placeholder.
+    float loading_fade_in = 0.f;
+
+    // The line's morph vertices, left to right, captured when the data lands.
+    // Empty means stage 1 — nothing to morph toward yet — which is what
+    // loading_line::draw switches on.
+    std::vector<vroom::LinePoint> loading_line;
+    // Stage 2's progress, 0 = the frozen sine, 1 = through the candle centres.
+    // Parked at 1 when no morph is running.
+    float loading_line_t = 1.f;
+    // Set for stage 3, where the line rides `interval_morph_t` out on the same
+    // clock as the candles growing out of it. A flag rather than its own float
+    // because the two have to finish together to avoid a line left hanging over
+    // a settled chart.
+    bool loading_line_revealing = false;
+
     // Interval morph: the outgoing candle geometry captured when a timeframe
     // switch begins, indexed from the right of the visible slice (slot 0 =
     // newest). `interval_morph_fade` is the host's choice at capture time:
@@ -508,6 +544,38 @@ struct VroomChart {
     // draw_chart.
     void begin_frame();
 
+    // Enters or leaves the loading line. `animate` false pins it still for
+    // reduced motion. Entering restarts the phase and the fade-in; leaving
+    // outright (rather than through the two calls below) drops the line with no
+    // hand-off, which is what an error or a cancelled fetch wants.
+    void set_loading(bool on, bool animate);
+
+    // Stage 2. Call *after* pushing the real candles: it needs them to know
+    // where the line is heading. Freezes the sine at its current phase and
+    // pairs each vertex with the vertical centre of the candle that will occupy
+    // that column, then hands `loading_line_t` to the host to drive 0 → 1.
+    //
+    // Freezing rather than letting the wave run underneath is deliberate — a
+    // moving source makes the morph read as two animations fighting instead of
+    // one shape resolving.
+    void begin_loading_morph();
+
+    // The visible slice and price bounds the hand-off aims at, as draw_chart
+    // would resolve them. `n == 0` when there is nothing to hand off to.
+    struct LoadingTarget {
+        const ::VroomCandle* visible = nullptr;
+        std::size_t n = 0;
+        vroom::PriceBounds bounds{};
+    };
+    LoadingTarget loading_target() const;
+
+    // Stage 3. Captures every candle collapsed onto its own vertical centre at
+    // zero alpha and hands it to the interval-morph machinery, so the existing
+    // slot lerp grows each bar outward from the line while candles::draw blends
+    // its colour up out of nothing. Also releases `loading`, letting the axes,
+    // price badge and panes come back.
+    void begin_loading_reveal();
+
     // True when the line tip's pulse ring is on screen and looping. Gated on
     // line mode and on having data, so a chart that isn't showing the ring can
     // still go idle.
@@ -517,7 +585,8 @@ struct VroomChart {
     // SkPictureRecorder.
     void rebuild_chart_picture();
 
-    // True if any axis label is mid-fade, or the tip pulse is running. Used by
-    // the JS-side animation loop to know when to keep ticking.
+    // True if any axis label is mid-fade, the tip pulse is running, or the
+    // loading skeleton is waving. Used by the JS-side animation loop to know
+    // when to keep ticking.
     bool is_animating_now() const;
 };

package/cpp/_core_src/chart_facade.cpp

@@ -497,6 +497,28 @@ extern "C" void vroom_chart_begin_stream_morph(VroomChart* chart) {
     chart->interval_morph_t = 0.f;
 }
 
+extern "C" void vroom_chart_set_loading(VroomChart* chart, int32_t on,
+                                        int32_t animate) {
+    if (!chart) return;
+    chart->set_loading(on != 0, animate != 0);
+}
+
+extern "C" void vroom_chart_begin_loading_morph(VroomChart* chart) {
+    if (!chart) return;
+    chart->begin_loading_morph();
+}
+
+extern "C" void vroom_chart_set_loading_morph(VroomChart* chart, float t) {
+    if (!chart) return;
+    chart->loading_line_t = std::clamp(t, 0.f, 1.f);
+    chart->mark_dirty();
+}
+
+extern "C" void vroom_chart_begin_loading_reveal(VroomChart* chart) {
+    if (!chart) return;
+    chart->begin_loading_reveal();
+}
+
 extern "C" void vroom_chart_set_interval_morph(VroomChart* chart, float t) {
     if (!chart) return;
     chart->interval_morph_t = std::clamp(t, 0.f, 1.f);
@@ -507,6 +529,11 @@ extern "C" void vroom_chart_set_interval_morph(VroomChart* chart, float t) {
         chart->morph_lines.shrink_to_fit();
         chart->interval_morph_fade = false;
         chart->morph_is_stream = false;
+        // The loading line rides this same clock out (see draw_chart 5.9), so
+        // it has to be released here too or it would hang over a settled chart.
+        chart->loading_line_revealing = false;
+        chart->loading_line.clear();
+        chart->loading_line.shrink_to_fit();
     }
     chart->mark_dirty();
 }

package/cpp/_core_src/color_lerp.h

@@ -0,0 +1,28 @@
+// Blending two packed ARGB colors.
+//
+// Shared because anything anchored to the newest candle has to cross-fade when
+// that candle changes direction mid-morph: the body itself (candles.cpp) and
+// the current-price indicator (price_indicator.cpp) both flip between the bull
+// and bear accents, and a snap in either while the other eases is visible.
+//
+// Skia-free so the pure translation units can use it.
+
+#pragma once
+
+#include <cstdint>
+
+namespace vroom {
+
+// Channel-wise, including alpha. `t` is expected in [0,1].
+inline uint32_t lerp_argb(uint32_t a, uint32_t b, float t) {
+    uint32_t out = 0;
+    for (int shift = 0; shift < 32; shift += 8) {
+        const float ca = static_cast<float>((a >> shift) & 0xFFu);
+        const float cb = static_cast<float>((b >> shift) & 0xFFu);
+        const auto v = static_cast<uint32_t>(ca + (cb - ca) * t + 0.5f);
+        out |= v << shift;
+    }
+    return out;
+}
+
+}  // namespace vroom

package/cpp/_core_src/loading_line.cpp

@@ -0,0 +1,183 @@
+#include "loading_line.h"
+
+#pragma clang diagnostic push
+#pragma clang diagnostic ignored "-Wdocumentation"
+#include "include/core/SkCanvas.h"
+#include "include/core/SkColor.h"
+#include "include/core/SkPaint.h"
+#include "include/core/SkPath.h"
+#include "include/core/SkPathBuilder.h"
+#include "include/core/SkPoint.h"
+#pragma clang diagnostic pop
+
+#include <algorithm>
+#include <cstddef>
+#include <vector>
+
+#include "chart.h"
+#include "curve.h"
+#include "loading_wave.h"
+#include "theme.h"
+#include "viewport.h"
+
+namespace vroom::loading_line {
+
+namespace {
+
+constexpr float kStrokeWidthPx = 2.f;
+
+// Multiplies into whatever alpha the resolved color already carries.
+SkColor faded(SkColor c, float a) {
+    const float scaled = static_cast<float>(SkColorGetA(c)) *
+                         std::clamp(a, 0.f, 1.f);
+    return SkColorSetA(c, static_cast<U8CPU>(scaled + 0.5f));
+}
+
+// The loading line's color. A transparent `skeleton` inherits the gridline
+// color, the same sentinel convention the candle border and wick colors use.
+// The gridlines are the chart's existing vocabulary for "structure, not data",
+// which is exactly what the line is: drawing it in that tone keeps it from
+// reading as a series, without needing to be scaled down to stay quiet.
+SkColor stroke_color(const VroomChart& chart) {
+    const SkColor c = chart.theme.colors[VROOM_COLOR_SKELETON];
+    return SkColorGetA(c) == 0 ? chart.theme.colors[VROOM_COLOR_GRID] : c;
+}
+
+// Emits `pts` as a monotone cubic — the same curve the line chart draws (see
+// curve.h), so the loading line and the series it hands off to are shaped by
+// the same math and the transition has no renderer seam to hide.
+//
+// Monotone rather than a plain spline matters even here: by the end of the
+// morph these vertices *are* real price data, and an unconstrained curve would
+// overshoot a sharp reversal and bow outside the candle it is supposed to pass
+// through.
+SkPath spline(const std::vector<SkPoint>& pts) {
+    SkPathBuilder path;
+    if (pts.empty()) return path.detach();
+    path.moveTo(pts[0]);
+    // Below three points there is no interior vertex to fit a tangent to.
+    if (pts.size() < 3) {
+        for (std::size_t i = 1; i < pts.size(); ++i) path.lineTo(pts[i]);
+        return path.detach();
+    }
+
+    const auto secant_at = [&](std::size_t i) {
+        return curve::secant(pts[i].fX, pts[i].fY,
+                             pts[i + 1].fX, pts[i + 1].fY);
+    };
+    const auto tangent_at = [&](std::size_t i) {
+        if (i == 0) return secant_at(0);
+        if (i + 1 == pts.size()) return secant_at(pts.size() - 2);
+        return curve::monotone_tangent(secant_at(i - 1), secant_at(i));
+    };
+
+    for (std::size_t i = 0; i + 1 < pts.size(); ++i) {
+        // Flat or backwards spacing has no meaningful tangent, and curving
+        // through it would fold the line back on itself.
+        if (!(pts[i + 1].fX > pts[i].fX)) {
+            path.lineTo(pts[i + 1]);
+            continue;
+        }
+        const curve::Controls c = curve::segment_controls(
+            pts[i].fX, pts[i].fY, pts[i + 1].fX, pts[i + 1].fY,
+            tangent_at(i), tangent_at(i + 1), 1.f);
+        path.cubicTo(c.c1x, c.c1y, c.c2x, c.c2y, pts[i + 1].fX, pts[i + 1].fY);
+    }
+    return path.detach();
+}
+
+void stroke_path(SkCanvas* canvas,
+                 const VroomChart& chart,
+                 const SkPath& path,
+                 float alpha) {
+    SkPaint p;
+    p.setStyle(SkPaint::kStroke_Style);
+    p.setStrokeWidth(kStrokeWidthPx);
+    p.setStrokeCap(SkPaint::kRound_Cap);
+    p.setStrokeJoin(SkPaint::kRound_Join);
+    p.setAntiAlias(true);
+    p.setColor(faded(stroke_color(chart), alpha));
+    canvas->drawPath(path, p);
+}
+
+// Pinned to phase 0 under reduced motion, which leaves a still curve at
+// mid-breath rather than nothing — the placeholder is still worth showing.
+float phase(const VroomChart& chart) {
+    return chart.loading_animate ? chart.loading_elapsed_s : 0.f;
+}
+
+// Stage 1: the curve alone, sampled across the whole plot.
+SkPath idle_path(const VroomChart& chart, float area_w, float pane_h) {
+    const int samples = loading_wave::sample_count(area_w);
+    const float elapsed = phase(chart);
+    std::vector<SkPoint> pts;
+    pts.reserve(static_cast<std::size_t>(samples) + 1);
+    for (int i = 0; i <= samples; ++i) {
+        const float xf = static_cast<float>(i) / static_cast<float>(samples);
+        pts.push_back(SkPoint{xf * area_w,
+                              loading_wave::y_frac(elapsed, xf) * pane_h});
+    }
+    return spline(pts);
+}
+
+// Stages 2 and 3: the captured vertices, eased from the frozen curve toward the
+// candle centres. `t` of 1 is the shape the candles grow out of.
+SkPath morph_path(const VroomChart& chart,
+                  const Layout& lay,
+                  float area_w,
+                  float pane_h,
+                  float t) {
+    std::vector<SkPoint> pts;
+    pts.reserve(chart.loading_line.size());
+    for (const LinePoint& pt : chart.loading_line) {
+        const float from_y = pt.from_y * pane_h;
+        const float to_y = y_at_fraction(lay, pt.to_y);
+        pts.push_back(SkPoint{pt.x * area_w, from_y + (to_y - from_y) * t});
+    }
+    return spline(pts);
+}
+
+}  // namespace
+
+void draw(SkCanvas* canvas, const VroomChart& chart, const Layout& lay) {
+    if (!canvas) return;
+    const float area_w = candle_area_width(lay);
+    const float pane_h = price_pane_bottom(lay);
+    if (area_w <= 0.f || pane_h <= 0.f) return;
+
+    const float b = loading_wave::breath(phase(chart));
+
+    // A capture present means the data has landed and the line is on its way to
+    // the candle centres; absent means nothing has arrived yet.
+    if (chart.loading_line.empty()) {
+        stroke_path(canvas, chart, idle_path(chart, area_w, pane_h), b);
+        return;
+    }
+    // Settle out of the breath as the line resolves, so it holds still at full
+    // strength by the time it reaches the candle centres — subtle at the
+    // default gridline tone, but it stops a bright custom color from pulsing
+    // while the data lands. Stage 3 then fades from full, where draw_fading
+    // picks up.
+    const float alpha = b + (1.f - b) * chart.loading_line_t;
+    stroke_path(canvas, chart,
+                morph_path(chart, lay, area_w, pane_h, chart.loading_line_t),
+                alpha);
+}
+
+void draw_fading(SkCanvas* canvas,
+                 const VroomChart& chart,
+                 const Layout& lay,
+                 float alpha) {
+    if (!canvas || alpha <= 0.f) return;
+    if (chart.loading_line.empty()) return;
+    const float area_w = candle_area_width(lay);
+    const float pane_h = price_pane_bottom(lay);
+    if (area_w <= 0.f || pane_h <= 0.f) return;
+
+    // Held at the morph's end state: the line has already reached the centres,
+    // and the candles are growing out of exactly these pixels.
+    stroke_path(canvas, chart, morph_path(chart, lay, area_w, pane_h, 1.f),
+                alpha);
+}
+
+}  // namespace vroom::loading_line

package/cpp/_core_src/loading_line.h

@@ -0,0 +1,38 @@
+// The loading line: a single stroke across the plot standing in for a series
+// that hasn't arrived yet, and the bridge the real candles grow out of.
+//
+// Three stages, all drawn by the one function here:
+//
+//   1. idle    — a travelling sine across the full width (see loading_wave.h)
+//   2. morph   — that sine, frozen, easing into a polyline through the vertical
+//                centre of every candle about to be drawn
+//   3. reveal  — the polyline holding still at those centres while it fades
+//                out and the candles grow outward from it
+//
+// Stages 1 and 2 run instead of the chart, so the axis text, price badge,
+// crosshair and indicator panes stay suppressed until the data is really
+// there. Stage 3 runs over the top of the normal scene.
+
+#pragma once
+
+class SkCanvas;
+struct VroomChart;
+
+namespace vroom {
+struct Layout;
+}
+
+namespace vroom::loading_line {
+
+// Stages 1 and 2, in place of the chart. Which one it draws depends on whether
+// the chart holds a capture (see VroomChart::begin_loading_morph).
+void draw(SkCanvas* canvas, const VroomChart& chart, const Layout& lay);
+
+// Stage 3, over the settled scene. `alpha` is the line's remaining opacity, so
+// the caller can ride it on the same clock as the candles' growth.
+void draw_fading(SkCanvas* canvas,
+                 const VroomChart& chart,
+                 const Layout& lay,
+                 float alpha);
+
+}  // namespace vroom::loading_line

package/cpp/_core_src/loading_wave.h

@@ -0,0 +1,140 @@
+// The idle animation the loading line rides while a series is being fetched.
+// A position across the plot and an elapsed time in; a vertical offset and a
+// brightness out.
+//
+// Three sines, not one. A single sine is too regular to read as anything but a
+// test pattern — the eye finds the repeat immediately and the line stops
+// looking like it's waiting for something. Summing three frequencies that
+// aren't multiples of each other, each drifting at its own rate, gives a curve
+// that keeps rearranging itself.
+//
+// The other half of the effect is restraint: a small amplitude and a faint,
+// slowly breathing opacity. The line is a hint that the chart is alive, not a
+// feature competing with the data about to replace it.
+//
+// Approach adapted from Liveline (github.com/benjitaylor/liveline, MIT), whose
+// loading state solves the same problem well.
+//
+// Skia-free and header-only so the unit tests can cover it; see
+// tests/test_loading_wave.cpp.
+
+#pragma once
+
+#include <cmath>
+
+namespace vroom::loading_wave {
+
+constexpr float kTwoPi = 6.283185307179586f;
+
+// One component of the curve.
+struct Harmonic {
+    float freq;    // radians across the full plot width
+    float weight;  // share of the amplitude
+    float drift;   // multiple of the base phase speed
+};
+
+// Frequencies deliberately not integer multiples of one another: harmonics
+// would lock into one repeating shape, which is the thing being avoided. The
+// drifts are all multiples of a quarter only so the whole curve has an exact
+// period to wrap the phase clock on — see kPeriodSeconds.
+//
+// Four components, weighted toward the middle of the range, because the curve
+// has to sit convincingly next to candlesticks. A gentler two-or-three-crest
+// undulation suits a smooth live line chart, but against minute-resolution
+// price action it reads as decorative, and it makes the hand-off a real change
+// of shape rather than the same curve coming into focus.
+constexpr Harmonic kHarmonics[] = {
+    {14.0f, 0.40f, 1.00f},  // carrier — a little over two crests per screen
+    {25.0f, 0.28f, 1.25f},  // ripple, running ahead
+    {45.0f, 0.16f, 1.50f},  // fine texture, ahead again
+    {6.0f, 0.16f, 0.75f},   // a slow swell, running behind
+};
+constexpr int kHarmonicCount = 4;
+
+// Base phase speed. Slow on purpose: this plays under a chart that has nothing
+// to say yet, and anything quicker reads as activity.
+constexpr float kDriftRadPerSecond = 1.0f;
+
+// One full cycle of the *whole* curve. The drifts differ by quarters, so every
+// component returns to its starting phase only after four base cycles — which
+// is also why the shape takes ~25s to come back around. Callers wrap elapsed
+// time by this so a chart left loading doesn't lose float precision on the
+// phase, and wrapping here is seamless because it is a true period.
+constexpr float kPeriodSeconds = 4.f * kTwoPi / kDriftRadPerSecond;
+
+// Peak displacement from the centreline, as a fraction of the pane height. The
+// components rarely peak together, so the curve typically occupies well under
+// this — it is a bound, not the height it looks.
+constexpr float kAmplitudeFrac = 0.10f;
+
+// Breathing opacity. A pulse around full strength, not a dimmer: how quiet the
+// line reads is the *color's* job — it inherits the gridline tone by default —
+// and scaling an already-recessive grey down by a third again would leave the
+// curve indistinguishable from the background.
+constexpr float kBreathMin = 0.75f;
+constexpr float kBreathMax = 1.00f;
+// Ten breaths per curve cycle, so the breath wraps with the phase (~2.5s each)
+// and never syncs with the drift into one combined pulse.
+constexpr float kBreathCyclesPerPeriod = 10.f;
+
+// Offset at `x_frac` (0 = left edge of the plot, 1 = right) and `elapsed_s`, in
+// -1 .. 1. The weights sum to 1, so that range is tight. Phase runs as
+// (k*x - w*t), which walks the crests rightward — the direction the series
+// grows. Time outside one period is fine; sin wraps on its own.
+inline float at(float elapsed_s, float x_frac) {
+    const float base = kDriftRadPerSecond * elapsed_s;
+    float sum = 0.f;
+    for (int i = 0; i < kHarmonicCount; ++i) {
+        const Harmonic& h = kHarmonics[i];
+        sum += h.weight * std::sin(h.freq * x_frac - h.drift * base);
+    }
+    return sum;
+}
+
+// The curve's y as a fraction of the pane height (0 = pane top, 1 = bottom),
+// centred on the pane. This is the form the line capture stores, so a resize
+// mid-morph rescales instead of stranding the curve at old pixels.
+inline float y_frac(float elapsed_s, float x_frac) {
+    return 0.5f + kAmplitudeFrac * at(elapsed_s, x_frac);
+}
+
+// The line's opacity at `elapsed_s`, in kBreathMin .. kBreathMax.
+inline float breath(float elapsed_s) {
+    const float mid = (kBreathMin + kBreathMax) * 0.5f;
+    const float half = (kBreathMax - kBreathMin) * 0.5f;
+    return mid + half * std::sin(kTwoPi * kBreathCyclesPerPeriod * elapsed_s /
+                                 kPeriodSeconds);
+}
+
+// The tightest component in the table above.
+constexpr float max_freq() {
+    float m = 0.f;
+    for (int i = 0; i < kHarmonicCount; ++i) {
+        if (kHarmonics[i].freq > m) m = kHarmonics[i].freq;
+    }
+    return m;
+}
+
+// Vertices per cycle of that component needed to keep it from aliasing into a
+// shape the curve doesn't have. Ten is comfortably past the point where the
+// spline through the samples is indistinguishable from the real curve.
+constexpr float kSamplesPerCycle = 10.f;
+
+// How many vertices to sample the curve at across a plot `width_px` wide.
+//
+// The floor comes from the harmonic table rather than a literal, so retuning
+// the curve can't silently undersample it — a narrow chart still gets enough
+// vertices to resolve the finest component, it just spaces them more tightly.
+//
+// Both the idle curve and the morph capture size themselves through here, so
+// the two are always sampled the same way and the hand-off has no shape
+// discontinuity to hide.
+inline int sample_count(float width_px) {
+    const int floor_n =
+        static_cast<int>(max_freq() / kTwoPi * kSamplesPerCycle) + 1;
+    const int n = static_cast<int>(width_px / 8.f);
+    const int ceil_n = 4 * floor_n;
+    return n < floor_n ? floor_n : (n > ceil_n ? ceil_n : n);
+}
+
+}  // namespace vroom::loading_wave

package/cpp/_core_src/ma_overlay.cpp

@@ -19,6 +19,7 @@
 #include "curve.h"
 #include "gradient.h"
 #include "line_morph.h"
+#include "tip_geometry.h"
 #include "tip_pulse.h"
 #include "viewport.h"
 
@@ -129,10 +130,6 @@ inline std::size_t series_slots(std::size_t n, const LineMorph* from,
     return std::max(n, vroom::morph_line_count(from, morph_t));
 }
 
-// Width of the background-colored ring that separates the tip dot from the line
-// and from the pulse expanding out behind it.
-constexpr float kTipBorderPx = 2.f;
-
 // One vertex of the close polyline, in screen space. Slot `k` counts back from
 // the right edge (0 = the newest close), the pairing a timeframe switch
 // preserves.
@@ -419,6 +416,7 @@ void draw_close_tip(SkCanvas* canvas,
                     int64_t visible_start_ms,
                     int64_t candle_duration_ms,
                     float candle_right,
+                    float clip_right,
                     float candle_area_h,
                     uint32_t line_color,
                     uint32_t bg_color,
@@ -447,14 +445,21 @@ void draw_close_tip(SkCanvas* canvas,
     if (tip.fY < 0.f || tip.fY > candle_area_h) return;
     if (tip.fX < 0.f || tip.fX > candle_right) return;
 
-    // Scaling off the stroke keeps the marker proportionate at any line width;
-    // the floor stops a hairline chart from getting an invisible dot.
-    const float w = line_width > 0.f ? line_width : 1.5f;
-    const float dot_r = std::max(2.f, w * 1.5f);
-    const float border_r = dot_r + kTipBorderPx;
+    const auto geo = vroom::tip_geometry::of(line_width);
+    const float dot_r = geo.dot_r;
+    const float border_r = geo.border_r;
 
     canvas->save();
-    canvas->clipRect(SkRect::MakeLTRB(0.f, 0.f, candle_right, candle_area_h));
+    // Wider than the on-pane test above: the dot is anchored at the newest
+    // candle's center, which on a view pinned to the latest bar is closer to
+    // candle_right than the dot's own radius, so it has to reach into the gutter
+    // to draw in full. `clip_right` is the gutter's far side — the y-axis
+    // strip's edge — which the layout keeps wide enough for the dot (see
+    // tip_geometry::gutter_px). The pulse ring is much wider still and clips
+    // there; that is intended.
+    canvas->clipRect(
+        SkRect::MakeLTRB(0.f, 0.f, std::max(candle_right, clip_right),
+                         candle_area_h));
 
     // Ring first: the border paints over its inner edge, so it reads as
     // expanding out from underneath the dot rather than around it.

package/cpp/_core_src/ma_overlay.h

@@ -131,6 +131,12 @@ void draw_close_gradient(SkCanvas* canvas,
 //
 // `pulse_phase` is in cycles and wraps, so the caller can hand over elapsed time
 // divided by tip_pulse::kPeriodSeconds. Ignored unless `pulse`.
+//
+// `candle_right` bounds where the marked candle may be for the marker to draw at
+// all; `clip_right` bounds the paint, and is wider — the dot overhangs the plot
+// when the newest candle is at the right edge, so it paints into the gutter the
+// layout reserves for it. Callers must therefore draw the tip *after* the axis
+// backgrounds, which mask that gutter.
 void draw_close_tip(SkCanvas* canvas,
                     const Layout& lay,
                     const PriceBounds& bounds,
@@ -140,6 +146,7 @@ void draw_close_tip(SkCanvas* canvas,
                     int64_t visible_start_ms,
                     int64_t candle_duration_ms,
                     float candle_right,
+                    float clip_right,
                     float candle_area_h,
                     uint32_t line_color,
                     uint32_t bg_color,

package/cpp/_core_src/price_indicator.cpp

@@ -17,8 +17,10 @@
 #include <cstring>
 
 #include "chart.h"
+#include "color_lerp.h"
 #include "fonts.h"
 #include "price_format.h"
+#include "price_indicator_anim.h"
 #include "theme.h"
 #include "ticks.h"
 #include "viewport.h"
@@ -37,17 +39,29 @@ void draw(SkCanvas* canvas,
           const Layout& lay,
           const PriceBounds& bounds,
           float candle_right,
-          float candle_area_h) {
+          float candle_area_h,
+          const vroom::CandleSnapshot* morph_from,
+          float morph_t) {
     if (!canvas || chart.candles.empty()) return;
 
     // The "current price" is the latest period's close, regardless of whether
-    // that candle is horizontally in view.
+    // that candle is horizontally in view. Mid-morph it is wherever that close
+    // has eased to, so the badge stays on the candle's close edge.
     const ::VroomCandle& last = chart.candles.back();
     const bool bull = last.close >= last.open;
-    const SkColor color =
-        chart.theme.colors[bull ? VROOM_COLOR_ACCENT_BULL : VROOM_COLOR_ACCENT_BEAR];
-
-    const float y = vroom::price_to_y(lay, bounds, last.close);
+    const auto level = vroom::price_indicator_anim::level_at(
+        lay, bounds, last.close, bull, morph_from, chart.morph_from_bounds,
+        morph_t);
+
+    // Blended rather than switched, so a candle that changes direction under a
+    // tick carries the indicator's color with it instead of snapping — the same
+    // cross-fade the body itself does.
+    const SkColor color = static_cast<SkColor>(vroom::lerp_argb(
+        chart.theme.colors[bull ? VROOM_COLOR_ACCENT_BEAR : VROOM_COLOR_ACCENT_BULL],
+        chart.theme.colors[bull ? VROOM_COLOR_ACCENT_BULL : VROOM_COLOR_ACCENT_BEAR],
+        level.bull_t));
+
+    const float y = level.y;
     if (y < 0.f || y > candle_area_h) return;  // price scrolled off-range
 
     // Dotted line from the left edge to the y-axis separator.
@@ -73,7 +87,7 @@ void draw(SkCanvas* canvas,
     const vroom::PriceFormat fmt = vroom::with_tick_guard(
         chart.price_fmt,
         vroom::pick_price_interval(bounds.max - bounds.min, candle_area_h));
-    vroom::format_price(buf, sizeof(buf), last.close, fmt);
+    vroom::format_price(buf, sizeof(buf), level.price, fmt);
     const size_t len = std::strlen(buf);
 
     // Measure the tight glyph bounds (origin at the baseline) so we can center