manohar/position-tracker
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: afterDraw with 1SD/2SD lines, breakeven%, spot line; all 3 table fixes

Browse source
This commit is contained in:
Manohar 2026-05-15 10:38:16 +05:30
parent b3b1946ee6
commit 805f25eb75
1 changed files with 37 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
public/index.html
View file

@ -424,41 +424,45 @@ var payoffChartInst = null;
Chart.register({ Chart.register({
id: 'payoffLines', id: 'payoffLines',
afterDraw: function(chart) { afterDraw: function(chart) {
if (!chart.canvas._beLines) return; if(!chart.canvas._beLines)return;
var ctx = chart.ctx; var ctx=chart.ctx,xs=chart.canvas._chartXs||[];
var xs = chart.canvas._chartXs || []; if(!xs.length)return;
if (!xs.length) return; var xS=chart.scales.x,yS=chart.scales.y,lo=xs[0],hi=xs[xs.length-1],rng=hi-lo;
var xScale = chart.scales.x, yScale = chart.scales.y; if(!rng)return;
var lo = xs[0], hi = xs[xs.length-1], rng = hi - lo; function xP(v){return xS.left+(v-lo)/rng*(xS.right-xS.left);}
if (!rng) return; var sp=chart.canvas._spotLine||0;
function xPx(v) { return xScale.left + (v-lo)/rng*(xScale.right-xScale.left); }
ctx.save(); ctx.save();
// Breakeven lines — amber dashed // 1SD and 2SD dotted lines
(chart.canvas._beLines || []).forEach(function(be) { var sd=chart.canvas._sdInfo;
var x = xPx(be); if(sd&&sp){
if (x < xScale.left || x > xScale.right) return; [{dist:sd.sd1,lbl:'1SD',col:'rgba(155,89,182,0.7)',dash:[3,4]},
ctx.beginPath(); ctx.setLineDash([5,4]); {dist:sd.sd2,lbl:'2SD',col:'rgba(52,152,219,0.6)',dash:[2,5]}
ctx.strokeStyle = 'rgba(245,166,35,0.85)'; ctx.lineWidth = 1.5; ].forEach(function(s){
ctx.moveTo(x, yScale.top); ctx.lineTo(x, yScale.bottom); ctx.stroke(); [sp-s.dist,sp+s.dist].forEach(function(v){
ctx.setLineDash([]); var x=xP(v);if(x<xS.left||x>xS.right)return;
ctx.fillStyle = '#F5A623'; ctx.font = '9px monospace'; ctx.beginPath();ctx.setLineDash(s.dash);ctx.strokeStyle=s.col;ctx.lineWidth=1.2;
ctx.textAlign = 'center'; ctx.moveTo(x,yS.top);ctx.lineTo(x,yS.bottom);ctx.stroke();
ctx.fillText(Number(be).toLocaleString('en-IN'), x, yScale.top + 10); ctx.setLineDash([]);ctx.fillStyle=s.col;ctx.font='8px monospace';ctx.textAlign='center';
}); ctx.fillText(s.lbl,x,yS.top+8);
// Spot line — coral dashed });
var sp = chart.canvas._spotLine; });
if (sp) {
var x = xPx(sp);
if (x >= xScale.left && x <= xScale.right) {
ctx.beginPath(); ctx.setLineDash([6,3]);
ctx.strokeStyle = 'rgba(255,107,74,0.9)'; ctx.lineWidth = 2;
ctx.moveTo(x, yScale.top); ctx.lineTo(x, yScale.bottom); ctx.stroke();
ctx.setLineDash([]);
ctx.fillStyle = '#FF6B4A'; ctx.font = 'bold 9px monospace';
ctx.textAlign = 'center';
ctx.fillText('Spot ' + Number(sp).toLocaleString('en-IN'), x, yScale.bottom - 4);
}
} }
// Breakeven lines + % from spot
(chart.canvas._beLines||[]).forEach(function(be){
var x=xP(be);if(x<xS.left||x>xS.right)return;
ctx.beginPath();ctx.setLineDash([5,4]);ctx.strokeStyle='rgba(245,166,35,0.9)';ctx.lineWidth=1.5;
ctx.moveTo(x,yS.top);ctx.lineTo(x,yS.bottom);ctx.stroke();
ctx.setLineDash([]);ctx.fillStyle='#F5A623';ctx.font='bold 9px monospace';ctx.textAlign='center';
var pct=sp>0?((be-sp)/sp*100).toFixed(1):'';
ctx.fillText(be.toLocaleString('en-IN')+(pct?' ('+(pct>0?'+':'')+pct+'%)':''),x,yS.top+10);
});
// Spot line
if(sp){var x=xP(sp);if(x>=xS.left&&x<=xS.right){
ctx.beginPath();ctx.setLineDash([6,3]);ctx.strokeStyle='rgba(255,107,74,0.95)';ctx.lineWidth=2.5;
ctx.moveTo(x,yS.top);ctx.lineTo(x,yS.bottom);ctx.stroke();
ctx.setLineDash([]);ctx.fillStyle='#FF6B4A';ctx.font='bold 10px monospace';ctx.textAlign='center';
ctx.fillText('Spot '+Number(sp).toLocaleString('en-IN'),x,yS.bottom-4);
}}
ctx.restore(); ctx.restore();
} }
}); });