Some insights on using intraday charts #3

Activity

1. MarioMuYao

   added

   enhancementNew feature or requestNew feature or request

   on Sep 11, 2026
2. CtrlAltDevelop

   self-assigned this

   on Sep 12, 2026
3. CtrlAltDevelop

   added

   bugSomething isn't workingSomething isn't working

   on Sep 12, 2026
4. CtrlAltDevelop commented on Sep 12, 2026

   

   CtrlAltDevelop

   on Sep 12, 2026

   Last edited by CtrlAltDevelop

   Owner

   More actions

   Thanks for the detailed write-up — I went through each point against the code.
   All five are addressed.

   1. Few data points + gridColumns → points squashed together

   Confirmed, and it followed from the layout model. Candle x positions came from a
   fixed pointWidth (getX(i) = i * pointWidth + pointWidth/2) and the total data
   length is itemCount * pointWidth, while the grid is drawn across the full plot
   width. So a dozen intraday points occupied a narrow strip on the left while the
   grid spanned everything.

   There is now a fit-to-width mode:

   chartStyle: ChartStyle(fitContent: true),

   A series too short to fill the plot is spread across the whole of it, and the
   candle and volume bars widen with it so they keep their proportions. The spacing
   is worked out from the chart's own width, so nothing in your code has to know
   how wide it ended up. It only ever widens: a series long enough to fill the
   plot, or one zoomed in past it, is laid out on pointWidth as before, so the
   flag can stay on while history pages in.

   2. lockPriceScale: true + a tick price outside the locked range

   A real bug, and fixed. drawHorizontalLines drew at getMainY(line.price) with
   no clamp and no clip around the main pane, so an out-of-range price was painted
   over the volume and indicator panes, or off the canvas entirely.

   A line at a price the axis cannot reach is now left out of the plot, and its
   label is pinned to the edge the price went past and marked with an arrow, so the
   level is still findable rather than silently gone. The same clamp covers the
   current-price line, the signal lines and the trading tags — those were clamped
   to the window's high and low, which under a locked axis are not the axis's
   extremes, so they escaped too. That is most likely the "tick price" you saw.

   3. Should the price axis follow the data when lockPriceScale is true?

   The lock exists precisely so the axis does not move while you scroll or while
   live ticks arrive — that is what makes reading a level off it stable — so that
   stays the default. Keeping the market on screen is now available alongside it:

   lockPriceScale: true,
   lockedScaleFollowsPrice: true,

   The locked range grows just enough to keep the newest candle on the chart, and
   never shrinks back or refits to the window, so the axis still sits still while
   you scroll. Only the newest candle counts, and only while it is in view: growing
   the axis to swallow the history a scroll moves over would undo the lock a little
   at a time. KChartController.resetPriceScale() still refits and re-locks, and
   is what a chart switching instruments should call.

   4. Custom formatting of the price and time axis values

   The time axis takes dateFormatter. The price axis had only fixedLength, so a
   currency symbol, a thousands separator or a tick size had nowhere to go. Its
   counterpart now exists:

   priceFormatter: (price) => NumberFormat.currency(symbol: r'$').format(price),

   It writes every price the chart itself says: the axis labels, the crosshair's
   price label, the current-price tag, the high, low and signal tags, and the OHLC
   legend. An axis that reads out a move rather than a price writes that move
   itself and does not ask. Drawings keep their own title.

   5. A second vertical axis, e.g. "change %"

   Reading the axis as a percentage has its own scale, which the crosshair's price
   label and the current-price tag follow too:

   priceAxisScale: PriceAxisScale.percentage,

   And for price and change % at the same time, there is now a second axis:

   secondaryPriceAxisScale: PriceAxisScale.percentage,
   chartStyle: ChartStyle(priceAxisWidth: 56, secondaryPriceAxisWidth: 56),

   It sits in a gutter on the side verticalTextAlignment left free, and marks its
   own round values — +2%, +4%, +6% — rather than labelling whatever percentages
   the round prices work out at. The grid stays ruled by the price axis, and the
   crosshair and the price tags keep following priceAxisScale. The two gutters
   are clamped against each other, so between them they can never take more than
   half the chart's width.

   ---

   The example app has a toggle for each of these, and the intraday demo uses
   fitContent rather than working the spacing out by hand.

   Really useful feedback — thank you. Have a good one.
5. CtrlAltDevelop

   added a commit that references this issue on Sep 12, 2026

   chore: release 2.4.1

   ...

   12eb8d1
6. CtrlAltDevelop

   linked a pull request that will close this issueRelease 2.4.1: five answers to the intraday chart feedback #4on Sep 12, 2026
7. CtrlAltDevelop

   closed this as completedin 18b2a4fon Sep 12, 2026