sjs/spirit-tracker
1
0
Fork 0
mirror of https://github.com/samsonjs/spirit-tracker.git synced 2026-03-25 09:25:51 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

UX Improvements

Browse source
This commit is contained in:
Brennan Wilkes (Text Groove) 2026-02-09 23:57:53 -08:00
parent 01c16007df
commit e91315557e
1 changed files with 30 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
viz/app/item_page.js
View file

@ -117,9 +117,6 @@ const StaticMarkerLinesPlugin = {
const markers = Array.isArray(opts?.markers) ? opts.markers : []; const markers = Array.isArray(opts?.markers) ? opts.markers : [];
if (!markers.length) return; if (!markers.length) return;
const markerYs = markers.map(m => Number(m.y)).filter(Number.isFinite);
const HIDE_TICK_PX = 9; // tweak 6–12 depending on font size
// Find y-scale (v2/v3 tolerant) // Find y-scale (v2/v3 tolerant)
const scalesObj = chart?.scales || {}; const scalesObj = chart?.scales || {};
const scales = Object.values(scalesObj); const scales = Object.values(scalesObj);
@ -997,23 +994,36 @@ export async function renderItem($app, skuInput) {
y: { y: {
...ySug, ...ySug,
ticks: { y: {
stepSize: step, ...ySug,
maxTicksLimit: MAX_TICKS, ticks: {
padding: 10, stepSize: step,
callback: function (v) { maxTicksLimit: MAX_TICKS,
const val = Number(v); padding: 10,
if (!Number.isFinite(val)) return ""; callback: function (v) {
const val = Number(v);
// `this` is the y-scale in Chart.js (v2/v3/v4) if (!Number.isFinite(val)) return "";
const py = this.getPixelForValue(val);
// if no markers or scale API missing, just render normally
for (const my of markerYs) { if (!markerYs.length || typeof this.getPixelForValue !== "function") {
const pmy = this.getPixelForValue(my); return `$${val.toFixed(0)}`;
if (Math.abs(py - pmy) <= HIDE_TICK_PX) return ""; // hide $ tick label }
}
const py = this.getPixelForValue(val);
return `$${val.toFixed(0)}`; if (!Number.isFinite(py)) return `$${val.toFixed(0)}`;
for (const my of markerYs) {
const pmy = this.getPixelForValue(my);
if (!Number.isFinite(pmy)) continue;
// only consider markers actually in view
if (pmy < this.top || pmy > this.bottom) continue;
if (Math.abs(py - pmy) <= HIDE_TICK_PX) return ""; // hide $ tick label
}
return `$${val.toFixed(0)}`;
},
}, },
}, },
}, },