QT/sure
1
0
Fork 0
mirror of https://github.com/we-promise/sure.git synced 2026-06-06 11:19:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ds): chart flat-state — hairline trendline, not a bisecting rule (#2137) (#2150)

Browse Source 
Accounts with a flat series (a single valuation or an unchanged balance, where
dataMin === dataMax) plotted the centered horizontal trendline at the full 2px
stroke — a near-black full-bleed rule bisecting the hero card in light, leaving
~half the card a void (dark read it as an acceptable hairline). Detect the flat
case (_isFlatSeries) and draw the line as a faint hairline (stroke-width 1,
stroke-opacity 0.4) so it reads as "no change", consistent across light + dark.

Verified on the Car Loan account (30D, no change): the heavy rule is gone.
This commit is contained in:
Guillem Arias Fauste
2026-06-04 22:19:38 +02:00
committed by GitHub
parent be707bfba3
commit 6961c7ef41
1 changed files with 12 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/javascript/controllers/time_series_chart_controller.js
View File

@@ -140,7 +140,18 @@ export default class extends Controller {
.attr("d", this._d3Line)
.attr("stroke-linejoin", "round")
.attr("stroke-linecap", "round")
.attr("stroke-width", this.strokeWidthValue);
// A flat series (no variation across the period — a single valuation or an
// unchanged balance) otherwise renders as a full-bleed near-black rule
// bisecting the hero card. Draw it as a faint hairline so it reads as
// "no change", consistent across light and dark (#2137).
.attr("stroke-width", this._isFlatSeries ? 1 : this.strokeWidthValue)
.attr("stroke-opacity", this._isFlatSeries ? 0.4 : 1);
}
get _isFlatSeries() {
const min = d3.min(this._normalDataPoints, this._getDatumValue);
const max = d3.max(this._normalDataPoints, this._getDatumValue);
return min === max;
}
_installTrendlineSplit() {