ramseshk
9f2d506383
Switched from taker IOC orders (0.05% fee) to POST-ONLY limit orders (0.02% maker fee) — 60% fee reduction. Orders are placed at mid ± 1-2 bps to capture the spread as a liquidity provider. Added 2 new strategies (7 total): 6. Momentum Breakout — Bollinger Band (2σ) breakouts, trend-following 7. Mean Reversion — VWAP deviation, mean-reverting at extremes All strategies have real signal computation: - OFI: 5-tick price momentum - Iceberg: volume-weighted trend detection - Funding Arb: carry trade signal from funding proxy - Pairs: BTC/ETH ratio Z-score - A-S: continuous market making - Momentum: Bollinger band breakouts - Mean Reversion: VWAP ± 1.5σ deviation Dashboard: click-to-expand strategy cards with description, mini-stats (PnL, fees, win rate, trades), and live signal log. Added fee column to trade log.
237 lines
20 KiB
HTML
237 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
|
<title>FTDT Quant Lab — Live Strategy Dashboard</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<script src="https://unpkg.com/lightweight-charts@4.2.3/dist/lightweight-charts.standalone.production.js"></script>
|
|
<style>
|
|
:root{--bg:#0a0a0c;--surface:#111115;--border:#1e1e26;--hover:#252530;--text:#8b8b96;--bright:#e2e2e8;--green:#22c55e;--red:#ef4444;--blue:#3b82f6;--amber:#f59e0b;--purple:#a855f7;--radius:10px;--font:'Inter',system-ui,sans-serif;--mono:'JetBrains Mono',monospace}
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
body{background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;line-height:1.5;-webkit-font-smoothing:antialiased}
|
|
.wrap{max-width:1280px;margin:0 auto;padding:20px 16px}
|
|
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--border);gap:12px;flex-wrap:wrap}
|
|
.logo h1{font-size:20px;font-weight:700;color:var(--bright);letter-spacing:-0.5px}
|
|
.logo span{font-size:11px;color:var(--text);display:flex;align-items:center;gap:5px;margin-top:2px}
|
|
.dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.dot.live{background:var(--green);animation:pulse 2s infinite}.dot.dead{background:var(--red)}
|
|
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.35}}
|
|
.totals{text-align:right}.totals .pnl{font-family:var(--mono);font-size:32px;font-weight:700;letter-spacing:-1px;line-height:1}
|
|
.totals .pnl.up{color:var(--green)}.totals .pnl.dn{color:var(--red)}
|
|
.totals .sub{font-size:11px;color:var(--text);margin-top:4px;text-transform:uppercase;letter-spacing:0.5px}
|
|
.tabs{display:flex;gap:0;margin-bottom:20px;border-bottom:1px solid var(--border)}
|
|
.tab{padding:10px 20px;font-size:13px;font-weight:500;cursor:pointer;background:none;border:none;border-bottom:2px solid transparent;color:var(--text);font-family:var(--font);transition:all 0.15s}
|
|
.tab:hover{color:var(--bright)}.tab.on{color:var(--bright);border-bottom-color:var(--blue)}
|
|
.panel{display:none}.panel.show{display:block}
|
|
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px}
|
|
.stat-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
|
|
.stat-box .lbl{font-size:10px;color:var(--text);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px}
|
|
.stat-box .val{font-family:var(--mono);font-size:18px;font-weight:600;color:var(--bright)}
|
|
.stat-box .val.up{color:var(--green)}.stat-box .val.dn{color:var(--red)}
|
|
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:14px}
|
|
.card h3{font-size:13px;font-weight:600;color:var(--bright);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
|
|
.card h3 .desc{font-weight:400;color:var(--text);font-size:11px}
|
|
.chart-wrap{width:100%;height:220px;position:relative}
|
|
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-bottom:14px}
|
|
.strat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;transition:all 0.2s;cursor:pointer}
|
|
.strat:hover{border-color:var(--hover)}.strat.open{border-color:var(--blue);grid-column:1/-1}
|
|
.strat .hdr{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}
|
|
.strat .name{font-size:12px;font-weight:600;color:var(--bright);line-height:1.3}
|
|
.strat .alloc{font-size:10px;color:var(--text);margin-top:1px}
|
|
.strat .status{font-size:10px;padding:2px 8px;border-radius:4px;font-weight:500}
|
|
.strat .status.run{background:rgba(34,197,94,0.1);color:var(--green)}
|
|
.strat .status.idle{background:rgba(245,158,11,0.1);color:var(--amber)}
|
|
.strat .big{font-family:var(--mono);font-size:22px;font-weight:700;line-height:1.1;margin-bottom:2px}
|
|
.strat .big.up{color:var(--green)}.strat .big.dn{color:var(--red)}
|
|
.strat .pct{font-size:10px;color:var(--text);margin-bottom:10px;font-family:var(--mono)}
|
|
.strat .r{display:flex;flex-wrap:wrap;gap:10px;font-size:10px;color:var(--text)}
|
|
.strat .r b{font-family:var(--mono);color:var(--bright)}
|
|
|
|
/* Detail expansion */
|
|
.strat-detail{display:none;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
|
|
.strat.open .strat-detail{display:block}
|
|
.strat-detail .desc-text{font-size:11px;color:var(--text);margin-bottom:12px;line-height:1.5}
|
|
.strat-detail .mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
|
|
.strat-detail .mini-chart{width:100%;height:120px;margin-bottom:8px;border-radius:6px;overflow:hidden}
|
|
.strat-detail .signal-log{font-size:9px;color:var(--text);max-height:80px;overflow-y:auto}
|
|
.strat-detail .signal-log .sig{padding:3px 0;border-bottom:1px solid rgba(255,255,255,0.02);display:flex;justify-content:space-between}
|
|
.strat-detail .signal-log .sig.buy{color:var(--green)}.strat-detail .signal-log .sig.sell{color:var(--red)}
|
|
|
|
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
|
|
table{width:100%;border-collapse:collapse;min-width:550px}
|
|
th{font-size:9px;font-weight:600;color:var(--text);text-transform:uppercase;letter-spacing:0.5px;text-align:left;padding:8px 12px;border-bottom:1px solid var(--border)}
|
|
td{font-family:var(--mono);font-size:11px;padding:6px 12px;border-bottom:1px solid rgba(255,255,255,0.02)}
|
|
.green{color:var(--green)}.red{color:var(--red)}
|
|
|
|
.bt-row{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:all 0.15s;margin-bottom:6px;gap:12px;flex-wrap:wrap}
|
|
.bt-row:hover{border-color:var(--hover);background:var(--hover)}.bt-row.sel{border-color:var(--blue)}
|
|
.bt-row .n{font-weight:600;font-size:13px;color:var(--bright)}.bt-row .m{font-size:10px;color:var(--text)}
|
|
.bt-row .k{display:flex;gap:20px;flex-shrink:0}.bt-row .k .kv{text-align:right}
|
|
.bt-row .k .kl{font-size:9px;color:var(--text);text-transform:uppercase}.bt-row .k .kd{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--bright)}
|
|
.bt-detail{display:none;margin-top:12px}.bt-detail.on{display:block}
|
|
footer{text-align:center;padding:20px;font-size:10px;color:#3f3f46}footer a{color:#52525b;text-decoration:none}footer a:hover{color:var(--text)}
|
|
|
|
@media(max-width:640px){
|
|
.wrap{padding:12px 8px}.top{flex-direction:column;align-items:flex-start}.totals{text-align:left;width:100%}
|
|
.totals .pnl{font-size:24px}.stats{grid-template-columns:repeat(3,1fr);gap:6px}.stat-box{padding:10px}.stat-box .val{font-size:14px}
|
|
.grid{grid-template-columns:1fr 1fr;gap:8px}.strat .big{font-size:16px}.chart-wrap{height:160px}
|
|
.bt-row{flex-direction:column;align-items:flex-start}.bt-row .k{width:100%;justify-content:space-between;gap:8px}
|
|
.strat-detail .mini-stats{grid-template-columns:repeat(2,1fr)}
|
|
}
|
|
@media(max-width:380px){.stats{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<div class="top">
|
|
<div class="logo"><h1>FTDT Quant Lab</h1><span><span class="dot live" id="sdot"></span> <span id="scnx">connecting…</span> · <span id="swlt">—</span></span></div>
|
|
<div class="totals"><div class="label" style="font-size:10px;color:var(--text);text-transform:uppercase;letter-spacing:0.5px">Portfolio PnL</div><div class="pnl" id="stpnl">$0.00</div><div class="sub" id="stpct">0.00%</div></div>
|
|
</div>
|
|
<div class="tabs"><button class="tab on" id="tab-live" onclick="sw('live')">Live Trading</button><button class="tab" id="tab-bt" onclick="sw('backtest')">Backtesting</button></div>
|
|
|
|
<!-- LIVE -->
|
|
<div class="panel show" id="pnl-live">
|
|
<div class="stats" id="live-stats"></div>
|
|
<div class="card"><h3>Equity Curve <span class="desc">real-time · all strategies</span></h3><div class="chart-wrap" id="eq-chart"></div></div>
|
|
<div class="grid" id="live-grid"></div>
|
|
<div class="card"><h3>Trade Log <span class="desc">most recent</span></h3><div class="tbl-scroll"><table><thead><tr><th>Time</th><th>Strategy</th><th>Side</th><th>Size</th><th>Price</th><th>Fee</th><th>PnL</th></tr></thead><tbody id="trade-tb"></tbody></table></div></div>
|
|
</div>
|
|
|
|
<!-- BACKTEST -->
|
|
<div class="panel" id="pnl-bt">
|
|
<div class="card" id="bt-detail" style="display:none"><h3 id="bt-title">—</h3><div class="stats" id="bt-stats"></div><div class="chart-wrap" id="bt-chart"></div></div>
|
|
<div class="card"><h3>Saved Backtests <span class="desc">click to view</span></h3><div id="bt-list"></div></div>
|
|
</div>
|
|
<footer><a href="https://git.ftdt.io/rams/ftdt-quant-lab" target="_blank">rams/ftdt-quant-lab</a> · 7 strategies · 100 USDC each · POST-ONLY maker · Hyperliquid Testnet</footer>
|
|
</div>
|
|
|
|
<script>
|
|
var tab='live',lastData=null;
|
|
|
|
var eqChart=LightweightCharts.createChart(document.getElementById('eq-chart'),{layout:{background:{color:'transparent'},textColor:'#8b8b96'},grid:{vertLines:{color:'rgba(255,255,255,0.03)'},horzLines:{color:'rgba(255,255,255,0.03)'}},rightPriceScale:{borderColor:'rgba(255,255,255,0.06)'},timeScale:{borderColor:'rgba(255,255,255,0.06)',timeVisible:true},crosshair:{mode:0},width:0,height:0});
|
|
var eqSer=eqChart.addAreaSeries({lineColor:'#3b82f6',topColor:'rgba(59,130,246,0.15)',bottomColor:'rgba(59,130,246,0.02)',lineWidth:2});
|
|
var btChart=LightweightCharts.createChart(document.getElementById('bt-chart'),{layout:{background:{color:'transparent'},textColor:'#8b8b96'},grid:{vertLines:{color:'rgba(255,255,255,0.03)'},horzLines:{color:'rgba(255,255,255,0.03)'}},rightPriceScale:{borderColor:'rgba(255,255,255,0.06)'},timeScale:{borderColor:'rgba(255,255,255,0.06)'},crosshair:{mode:0},width:0,height:0});
|
|
var btSer=btChart.addAreaSeries({lineColor:'#a855f7',topColor:'rgba(168,85,247,0.12)',bottomColor:'rgba(168,85,247,0.02)',lineWidth:2});
|
|
function fitCharts(){eqChart.applyOptions({width:document.getElementById('eq-chart').offsetWidth,height:document.getElementById('eq-chart').offsetHeight});btChart.applyOptions({width:document.getElementById('bt-chart').offsetWidth,height:document.getElementById('bt-chart').offsetHeight})}
|
|
window.addEventListener('resize',fitCharts);setTimeout(fitCharts,300);
|
|
|
|
function sw(t){
|
|
tab=t;document.getElementById('tab-live').className=t==='live'?'tab on':'tab';document.getElementById('tab-bt').className=t==='backtest'?'tab on':'tab';
|
|
document.getElementById('pnl-live').className=t==='live'?'panel show':'panel';document.getElementById('pnl-bt').className=t==='backtest'?'panel show':'panel';
|
|
if(t==='live'&&lastData)renLive(lastData);if(t==='backtest'){setTimeout(fitCharts,200);loadBt()}
|
|
}
|
|
|
|
var ws;function conn(){
|
|
if(ws)try{ws.close()}catch(e){}
|
|
ws=new WebSocket((location.protocol==='https:'?'wss:':'ws:')+'//'+location.host+'/cv/ws');
|
|
ws.onopen=function(){document.getElementById('scnx').innerHTML='<span style=\"color:#22c55e\">live</span>';document.getElementById('sdot').className='dot live'};
|
|
ws.onclose=function(){document.getElementById('scnx').innerHTML='<span style=\"color:#f59e0b\">reconnecting…</span>';document.getElementById('sdot').className='dot dead';setTimeout(conn,2000)};
|
|
ws.onmessage=function(e){try{lastData=JSON.parse(e.data)}catch(ex){return};if(tab==='live')renLive(lastData)}
|
|
}
|
|
|
|
// Store mini-charts for strategy details
|
|
var stratCharts={};
|
|
function getStratChart(name){
|
|
if(stratCharts[name])return stratCharts[name];
|
|
var el=document.getElementById('mini-chart-'+name.replace(/\s/g,''));
|
|
if(!el)return null;
|
|
var c=LightweightCharts.createChart(el,{layout:{background:{color:'transparent'},textColor:'#8b8b96'},grid:{vertLines:{color:'rgba(255,255,255,0.03)'},horzLines:{color:'rgba(255,255,255,0.03)'}},rightPriceScale:{borderColor:'rgba(255,255,255,0.06)'},timeScale:{borderColor:'rgba(255,255,255,0.06)',visible:false},crosshair:{mode:0},width:0,height:120});
|
|
var s=c.addAreaSeries({lineColor:'#a855f7',topColor:'rgba(168,85,247,0.1)',bottomColor:'rgba(168,85,247,0.0)',lineWidth:1.5});
|
|
stratCharts[name]={chart:c,series:s};
|
|
return stratCharts[name];
|
|
}
|
|
|
|
function renLive(d){
|
|
if(!d)return;
|
|
var pnl=d.total_pnl||0,eqty=d.base_equity||898;
|
|
document.getElementById('stpnl').textContent=(pnl>=0?'+':'')+'$'+Math.abs(pnl).toFixed(2);
|
|
document.getElementById('stpnl').className='pnl '+(pnl>=0?'up':'dn');
|
|
document.getElementById('stpct').textContent='Equity: $'+((eqty+pnl)).toFixed(2)+' · '+(d.total_pnl_pct||0).toFixed(3)+'%';
|
|
document.getElementById('swlt').textContent=(d.wallet||'').slice(0,10)+'…';
|
|
|
|
var ss=d.strategies||{},keys=Object.keys(ss);
|
|
var tr=0,fu=0,fees=0;
|
|
for(var i=0;i<keys.length;i++){var s=ss[keys[i]];tr+=s.trades_today||0;fees+=s.fee_paid||0;if(s.status==='running')fu++};
|
|
|
|
document.getElementById('live-stats').innerHTML=
|
|
'<div class="stat-box"><div class="lbl">Total Equity</div><div class="val">$'+(eqty+pnl).toFixed(0)+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Reserve</div><div class="val">$'+(d.reserve||398)+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Total Trades</div><div class="val">'+tr+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Total Fees</div><div class="val dn">$'+fees.toFixed(4)+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Active</div><div class="val">'+fu+' / '+keys.length+'</div></div>';
|
|
|
|
// Strategy cards with click-to-expand
|
|
var g='';
|
|
for(var j=0;j<keys.length;j++){
|
|
var name=keys[j],s=ss[name];
|
|
var sp=s.pnl||0,cls=sp>=0?'up':'dn',pStr=(sp>=0?'+':'')+'$'+Math.abs(sp).toFixed(2);
|
|
var sid=name.replace(/\s/g,'');
|
|
var signals=s.signals||[],sigHtml='';
|
|
if(signals.length>0){for(var si=Math.max(0,signals.length-5);si<signals.length;si++){var sg=signals[si];var sc=sg.signal&&sg.signal.indexOf('BUY')>=0?'buy':'sell';sigHtml+='<div class="sig '+sc+'"><span>'+new Date(sg.time*1000).toLocaleTimeString('en-US',{hour12:false})+'</span><span>'+sg.signal+' ('+sg.strength.toFixed(2)+')</span></div>'}}
|
|
|
|
g+='<div class="strat" id="strat-'+sid+'" onclick="toggleStrat(\''+sid+'\')">'+
|
|
'<div class="hdr"><div><div class="name">'+name+'</div><div class="alloc">Allocation: '+(s.allocation||100)+' USDC · '+(s.type||'strategy')+'</div></div><span class="status '+(s.status==='running'?'run':'idle')+'">'+(s.status==='running'?'RUNNING':'IDLE')+'</span></div>'+
|
|
'<div class="big '+cls+'">'+pStr+'</div>'+
|
|
'<div class="pct">'+(s.pnl_pct>=0?'+':'')+(s.pnl_pct||0).toFixed(3)+'% · Fees: $'+(s.fee_paid||0).toFixed(4)+'</div>'+
|
|
'<div class="r"><span>Trades: <b>'+(s.trades_today||0)+'</b></span><span>Win: <b>'+Math.round((s.win_rate||0)*100)+'%</b></span><span>Position: <b>'+(s.position||0).toFixed(4)+' BTC</b></span></div>'+
|
|
'<div class="strat-detail">'+
|
|
'<div class="desc-text">'+(s.description||'No description')+'</div>'+
|
|
'<div class="mini-stats">'+
|
|
'<div class="stat-box"><div class="lbl">PnL</div><div class="val '+(sp>=0?'up':'dn')+'">'+pStr+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Fees Paid</div><div class="val dn">$'+(s.fee_paid||0).toFixed(4)+'</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Win Rate</div><div class="val">'+Math.round((s.win_rate||0)*100)+'%</div></div>'+
|
|
'<div class="stat-box"><div class="lbl">Trades Today</div><div class="val">'+(s.trades_today||0)+'</div></div>'+
|
|
'</div>'+
|
|
(signals.length>0?'<div class="signal-log" style="max-height:100px;overflow-y:auto"><div style="font-size:10px;color:var(--bright);margin-bottom:6px">Recent Signals</div>'+sigHtml+'</div>':'<div style="font-size:10px;color:var(--text)">No signals yet — waiting for data</div>')+
|
|
'</div>'+
|
|
'</div>';
|
|
}
|
|
document.getElementById('live-grid').innerHTML=g;
|
|
|
|
// Restore open state
|
|
for(var k=0;k<keys.length;k++){
|
|
var sid=keys[k].replace(/\s/g,'');
|
|
if(document.getElementById('strat-'+sid)&&document.getElementById('strat-'+sid).classList.contains('open')){
|
|
// Stay open
|
|
}
|
|
}
|
|
|
|
// Equity chart
|
|
var hist=d.equity_history||[];
|
|
if(hist.length>0){var pts=[];for(var m=0;m<hist.length;m++)pts.push({time:hist[m].t,value:hist[m].v});eqSer.setData(pts);eqChart.timeScale().fitContent()}
|
|
|
|
// Trades
|
|
var trades=(d.trades||[]).slice(-20).reverse(),rows='';
|
|
for(var n=0;n<trades.length;n++){var t=trades[n];rows+='<tr><td>'+t.time+'</td><td>'+t.strategy+'</td><td class="'+(t.side==='BUY'?'green':'red')+'">'+(t.side||'')+'</td><td>'+t.size+'</td><td>'+(t.price||'—')+'</td><td class="red">$'+(t.fee||0).toFixed(4)+'</td><td class="'+(t.pnl>=0?'green':'red')+'">'+(t.pnl>=0?'+':'')+'$'+Math.abs(t.pnl).toFixed(4)+'</td></tr>'}
|
|
document.getElementById('trade-tb').innerHTML=rows;
|
|
}
|
|
|
|
function toggleStrat(sid){
|
|
var el=document.getElementById('strat-'+sid);
|
|
if(!el)return;
|
|
el.classList.toggle('open');
|
|
setTimeout(fitCharts,200);
|
|
}
|
|
|
|
// Backtests (unchanged)
|
|
function loadBt(){
|
|
fetch('/cv/api/backtests').then(function(r){return r.json()}).then(function(data){
|
|
var h='';
|
|
for(var i=0;i<data.length;i++){var b=data[i];h+='<div class="bt-row" onclick="viewBt(\''+b.name+'\')" id="btr-'+b.name+'"><div><div class="n">'+b.strategy+'</div><div class="m">30-day sim · '+b.name+'</div></div><div class="k"><div class="kv"><div class="kl">PnL</div><div class="kd '+(b.pnl_pct>=0?'green':'red')+'">'+(b.pnl_pct>=0?'+':'')+b.pnl_pct.toFixed(2)+'%</div></div><div class="kv"><div class="kl">Sharpe</div><div class="kd">'+b.sharpe.toFixed(2)+'</div></div><div class="kv"><div class="kl">Max DD</div><div class="kd red">'+b.max_dd.toFixed(2)+'%</div></div><div class="kv"><div class="kl">Win</div><div class="kd">'+(b.win_rate*100).toFixed(0)+'%</div></div></div></div>'}
|
|
document.getElementById('bt-list').innerHTML=h||'<div style="padding:12px;color:var(--text);font-size:12px">No backtests yet.</div>';
|
|
})
|
|
}
|
|
function viewBt(name){
|
|
fetch('/cv/api/backtest/'+name).then(function(r){return r.json()}).then(function(b){
|
|
document.getElementById('bt-detail').style.display='block';document.getElementById('bt-title').innerHTML=b.strategy+' <span class="desc">'+b.description+'</span>';
|
|
document.querySelectorAll('.bt-row').forEach(function(e){e.classList.remove('sel')});document.getElementById('btr-'+name).classList.add('sel');
|
|
document.getElementById('bt-stats').innerHTML='<div class="stat-box"><div class="lbl">Return</div><div class="val '+(b.pnl>=0?'up':'dn')+'">'+(b.pnl>=0?'+':'')+b.pnl.toFixed(2)+'%</div></div><div class="stat-box"><div class="lbl">Annualized</div><div class="val '+(b.ann_return_pct>=0?'up':'dn')+'">'+(b.ann_return_pct>=0?'+':'')+b.ann_return_pct.toFixed(1)+'%</div></div><div class="stat-box"><div class="lbl">Sharpe</div><div class="val">'+b.sharpe.toFixed(2)+'</div></div><div class="stat-box"><div class="lbl">Sortino</div><div class="val">'+b.sortino.toFixed(2)+'</div></div><div class="stat-box"><div class="lbl">Max DD</div><div class="val dn">'+b.max_dd_pct.toFixed(2)+'%</div></div><div class="stat-box"><div class="lbl">Win Rate</div><div class="val">'+(b.win_rate*100).toFixed(0)+'%</div></div><div class="stat-box"><div class="lbl">Trades</div><div class="val">'+b.total_trades+'</div></div><div class="stat-box"><div class="lbl">Allocation</div><div class="val">$'+b.allocation+'</div></div><div class="stat-box"><div class="lbl">End Equity</div><div class="val">$'+b.end_equity.toFixed(2)+'</div></div><div class="stat-box"><div class="lbl">Period</div><div class="val">30 days</div></div>';
|
|
var pts=[],curve=b.equity_curve||[];for(var i=0;i<curve.length;i++)pts.push({time:(new Date(curve[i].t).getTime()/1000),value:curve[i].v});btSer.setData(pts);btChart.timeScale().fitContent();setTimeout(fitCharts,200);
|
|
})
|
|
}
|
|
|
|
fitCharts();conn();loadBt();
|
|
</script>
|
|
</body>
|
|
</html>
|