Spaces:

Alvin3y1
/

test

Sleeping

App Files Files Community

Alvin3y1 commited on 13 days ago

Commit

69a5bc2

verified ·

1 Parent(s): 0bde50b

Update app.py

Browse files

Files changed (1) hide show

app.py +64 -55

app.py CHANGED Viewed

@@ -29,12 +29,12 @@ HTML_PAGE = f"""
 <!DOCTYPE html>
 <html>
 <head>
-    <title>BTC-USD Mean Pressure</title>
     <script src="https://cdn.plot.ly/plotly-2.24.1.min.js"></script>
     <style>
         body {{ margin: 0; padding: 0; background-color: #0e0e0e; color: #ccc; font-family: sans-serif; overflow: hidden; }}
-        /* Layout Grid - 2 Rows x 2 Columns */
         #container {{ display: flex; flex-direction: column; height: 100vh; width: 100vw; }}
         /* Rows */
@@ -60,11 +60,9 @@ HTML_PAGE = f"""
         <!-- ROW 1 -->
         <div class="row">
             <div class="col">
-                <!-- Top Left: Price -->
                 <div id="price-chart" class="chart"></div>
             </div>
             <div class="col">
-                <!-- Top Right: Pressure % -->
                 <div id="imb-percent-chart" class="chart"></div>
             </div>
         </div>
@@ -72,11 +70,22 @@ HTML_PAGE = f"""
         <!-- ROW 2 -->
         <div class="row">
             <div class="col">
-                <!-- Bottom Left: Volume -->
                 <div id="vol-chart" class="chart"></div>
             </div>
             <div class="col">
-                <!-- Bottom Right: Average Pressure (Mean Integral) -->
                 <div id="mean-chart" class="chart"></div>
             </div>
         </div>
@@ -86,11 +95,14 @@ HTML_PAGE = f"""
         const priceDiv = document.getElementById('price-chart');
         const imbPercentDiv = document.getElementById('imb-percent-chart');
         const volDiv = document.getElementById('vol-chart');
         const meanDiv = document.getElementById('mean-chart');
         const statusDiv = document.getElementById('status');
-        let initPrice = false, initImbP = false, initVol = false, initMean = false;
         const commonConfig = {{ responsive: true, displayModeBar: false }};
         const commonLayout = {{
@@ -113,48 +125,40 @@ HTML_PAGE = f"""
                     return;
                 }}
-                statusDiv.innerHTML = `Mid: <span class="${{data.mid >= data.prev_mid ? 'green' : 'red'}}">$${{data.mid.toLocaleString(undefined, {{minimumFractionDigits: 2}})}}</span> | Avg Bias: ${{data.mean.last_val ? data.mean.last_val.toFixed(3) : 0}}`;
                 // 1. PRICE HISTORY
-                if (!initPrice) {{
-                    Plotly.newPlot(priceDiv, [{{ x: data.history.map(d=>new Date(d.t*1000)), y: data.history.map(d=>d.p), type: 'scatter', mode:'lines', line: {{color: '#29b6f6', width: 2}} }}],
-                    {{ ...commonLayout, title: '<b>Midprice</b>', xaxis: {{type:'date', gridcolor:'#222'}} }}, commonConfig);
-                    initPrice = true;
-                }} else {{
-                    Plotly.react(priceDiv, [{{ x: data.history.map(d=>new Date(d.t*1000)), y: data.history.map(d=>d.p), type: 'scatter', mode:'lines', line: {{color: '#29b6f6', width: 2}} }}],
-                    {{ ...commonLayout, title: '<b>Midprice</b>', xaxis: {{type:'date', gridcolor:'#222'}} }}, commonConfig);
-                }}
                 // 2. IMBALANCE %
                 const layoutImbP = {{ ...commonLayout, title: '<b>Pressure % (-100 to 100)</b>', yaxis: {{range: [-105, 105], gridcolor:'#222'}} }};
-                if (!initImbP) {{ Plotly.newPlot(imbPercentDiv, [{{ x: data.imbalance_pct.x, y: data.imbalance_pct.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#ffeb3b'}} }}], layoutImbP, commonConfig); initImbP = true; }}
-                else {{ Plotly.react(imbPercentDiv, [{{ x: data.imbalance_pct.x, y: data.imbalance_pct.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#ffeb3b'}} }}], layoutImbP, commonConfig); }}
                 // 3. VOLUME BY DISTANCE
-                const layoutVol = {{ ...commonLayout, title: '<b>Volume by Distance</b>' }};
                 const tracesVol = [
                     {{ x: data.imbalance_vol.dist_bids, y: data.imbalance_vol.vol_bids, type: 'scatter', name: 'Bid', line: {{color: '#00e676'}} }},
                     {{ x: data.imbalance_vol.dist_asks, y: data.imbalance_vol.vol_asks, type: 'scatter', name: 'Ask', line: {{color: '#ff1744'}} }}
                 ];
-                if (!initVol) {{ Plotly.newPlot(volDiv, tracesVol, layoutVol, commonConfig); initVol = true; }}
-                else {{ Plotly.react(volDiv, tracesVol, layoutVol, commonConfig); }}
-                // 4. MEAN PRESSURE (-1 to +1)
-                const layoutMean = {{ ...commonLayout,
-                    title: '<b>Average Pressure (Integral / Steps)</b>',
-                    xaxis: {{title: 'Distance ($)', gridcolor:'#222'}},
-                    yaxis: {{title: 'Bias', range: [-1.1, 1.1], gridcolor:'#222', zeroline: true, zerolinecolor: '#fff'}}
-                }};
-                const traceMean = {{
-                    x: data.mean.x,
-                    y: data.mean.y,
-                    type: 'scatter',
-                    mode: 'lines',
-                    fill: 'tozeroy',
-                    line: {{color: '#00bcd4', width: 2}} // Cyan
-                }};
                 if (!initMean) {{ Plotly.newPlot(meanDiv, [traceMean], layoutMean, commonConfig); initMean = true; }}
                 else {{ Plotly.react(meanDiv, [traceMean], layoutMean, commonConfig); }}
@@ -241,8 +245,10 @@ async def handle_data(request):
     # --- Calculations ---
     imb_x, imb_y = [], []
     mean_x, mean_y = [], []
-    running_integral = 0
     if d_b_x and d_a_x:
         max_dist = min(d_b_x[-1], d_a_x[-1])
@@ -257,31 +263,34 @@ async def handle_data(request):
             idx_a = bisect.bisect_right(d_a_x, s)
             vol_a = d_a_y[idx_a-1] if idx_a > 0 else 0
-            # 2. Imbalance % (-100 to 100)
             total_vol = vol_b + vol_a
-            pct = ((vol_b - vol_a) / total_vol) * 100 if total_vol > 0 else 0
-            imb_x.append(s)
-            imb_y.append(pct)
-            # 3. Mean Pressure
-            # Integral / Number of Steps
-            running_integral += pct
             step_count = i + 1
-            mean_pressure = running_integral / step_count
-            # Normalize to -1..1 (divide by 100%)
-            norm_mean = mean_pressure / 100.0
-            mean_x.append(s)
-            mean_y.append(norm_mean)
     return web.json_response({
         "mid": mid,
         "prev_mid": market_state['history'][-2]['p'] if len(market_state['history']) > 1 else mid,
         "imbalance_vol": { "dist_bids": d_b_x, "vol_bids": d_b_y, "dist_asks": d_a_x, "vol_asks": d_a_y },
         "imbalance_pct": { "x": imb_x, "y": imb_y },
-        "mean": { "x": mean_x, "y": mean_y, "last_val": mean_y[-1] if mean_y else 0 },
         "history": market_state['history']
     })
@@ -305,7 +314,7 @@ async def main():
     site = web.TCPSite(runner, '0.0.0.0', PORT)
     await site.start()
-    print(f"🚀 BTC-USD Mean Pressure Dashboard: http://localhost:{PORT}")
     await asyncio.Event().wait()
 if __name__ == "__main__":

 <!DOCTYPE html>
 <html>
 <head>
+    <title>BTC-USD 6-Way Analysis</title>
     <script src="https://cdn.plot.ly/plotly-2.24.1.min.js"></script>
     <style>
         body {{ margin: 0; padding: 0; background-color: #0e0e0e; color: #ccc; font-family: sans-serif; overflow: hidden; }}
+        /* Layout Grid - 3 Rows x 2 Columns */
         #container {{ display: flex; flex-direction: column; height: 100vh; width: 100vw; }}
         /* Rows */
         <!-- ROW 1 -->
         <div class="row">
             <div class="col">
                 <div id="price-chart" class="chart"></div>
             </div>
             <div class="col">
                 <div id="imb-percent-chart" class="chart"></div>
             </div>
         </div>
         <!-- ROW 2 -->
         <div class="row">
             <div class="col">
                 <div id="vol-chart" class="chart"></div>
             </div>
             <div class="col">
+                <!-- Net Difference (Bids - Asks) -->
+                <div id="diff-chart" class="chart"></div>
+            </div>
+        </div>
+        <!-- ROW 3 -->
+        <div class="row">
+            <div class="col">
+                <!-- Avg Diff (Diff / Steps) -->
+                <div id="avg-diff-chart" class="chart"></div>
+            </div>
+            <div class="col">
+                <!-- Mean Pressure (Previous) -->
                 <div id="mean-chart" class="chart"></div>
             </div>
         </div>
         const priceDiv = document.getElementById('price-chart');
         const imbPercentDiv = document.getElementById('imb-percent-chart');
         const volDiv = document.getElementById('vol-chart');
+        const diffDiv = document.getElementById('diff-chart');
+        const avgDiffDiv = document.getElementById('avg-diff-chart');
         const meanDiv = document.getElementById('mean-chart');
         const statusDiv = document.getElementById('status');
+        let initPrice = false, initImbP = false, initVol = false;
+        let initDiff = false, initAvgDiff = false, initMean = false;
         const commonConfig = {{ responsive: true, displayModeBar: false }};
         const commonLayout = {{
                     return;
                 }}
+                statusDiv.innerHTML = `Mid: <span class="${{data.mid >= data.prev_mid ? 'green' : 'red'}}">$${{data.mid.toLocaleString(undefined, {{minimumFractionDigits: 2}})}}</span> | Net Vol: ${{data.diff.last_val ? data.diff.last_val.toFixed(2) : 0}}`;
                 // 1. PRICE HISTORY
+                const tracePrice = {{ x: data.history.map(d=>new Date(d.t*1000)), y: data.history.map(d=>d.p), type: 'scatter', mode:'lines', line: {{color: '#29b6f6', width: 2}} }};
+                if (!initPrice) {{ Plotly.newPlot(priceDiv, [tracePrice], {{ ...commonLayout, title: '<b>Midprice</b>', xaxis: {{type:'date', gridcolor:'#222'}} }}, commonConfig); initPrice = true; }}
+                else {{ Plotly.react(priceDiv, [tracePrice], {{ ...commonLayout, title: '<b>Midprice</b>', xaxis: {{type:'date', gridcolor:'#222'}} }}, commonConfig); }}
                 // 2. IMBALANCE %
+                const traceImbP = {{ x: data.imbalance_pct.x, y: data.imbalance_pct.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#ffeb3b'}} }};
                 const layoutImbP = {{ ...commonLayout, title: '<b>Pressure % (-100 to 100)</b>', yaxis: {{range: [-105, 105], gridcolor:'#222'}} }};
+                if (!initImbP) {{ Plotly.newPlot(imbPercentDiv, [traceImbP], layoutImbP, commonConfig); initImbP = true; }}
+                else {{ Plotly.react(imbPercentDiv, [traceImbP], layoutImbP, commonConfig); }}
                 // 3. VOLUME BY DISTANCE
                 const tracesVol = [
                     {{ x: data.imbalance_vol.dist_bids, y: data.imbalance_vol.vol_bids, type: 'scatter', name: 'Bid', line: {{color: '#00e676'}} }},
                     {{ x: data.imbalance_vol.dist_asks, y: data.imbalance_vol.vol_asks, type: 'scatter', name: 'Ask', line: {{color: '#ff1744'}} }}
                 ];
+                if (!initVol) {{ Plotly.newPlot(volDiv, tracesVol, {{ ...commonLayout, title: '<b>Cumulative Volume</b>' }}, commonConfig); initVol = true; }}
+                else {{ Plotly.react(volDiv, tracesVol, {{ ...commonLayout, title: '<b>Cumulative Volume</b>' }}, commonConfig); }}
+                // 4. NET DIFFERENCE (Bids - Asks)
+                const traceDiff = {{ x: data.diff.x, y: data.diff.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#e040fb'}} }};
+                if (!initDiff) {{ Plotly.newPlot(diffDiv, [traceDiff], {{ ...commonLayout, title: '<b>Net Liquidity (Bids - Asks)</b>' }}, commonConfig); initDiff = true; }}
+                else {{ Plotly.react(diffDiv, [traceDiff], {{ ...commonLayout, title: '<b>Net Liquidity (Bids - Asks)</b>' }}, commonConfig); }}
+                // 5. AVG NET DIFFERENCE (Diff / Steps)
+                const traceAvgDiff = {{ x: data.avg_diff.x, y: data.avg_diff.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#ff9800'}} }};
+                if (!initAvgDiff) {{ Plotly.newPlot(avgDiffDiv, [traceAvgDiff], {{ ...commonLayout, title: '<b>Density (Net Vol / Step)</b>' }}, commonConfig); initAvgDiff = true; }}
+                else {{ Plotly.react(avgDiffDiv, [traceAvgDiff], {{ ...commonLayout, title: '<b>Density (Net Vol / Step)</b>' }}, commonConfig); }}
+                // 6. MEAN PRESSURE (-1 to +1)
+                const traceMean = {{ x: data.mean.x, y: data.mean.y, type: 'scatter', mode: 'lines', fill: 'tozeroy', line: {{color: '#00bcd4'}} }};
+                const layoutMean = {{ ...commonLayout, title: '<b>Avg Pressure % (-1 to 1)</b>', yaxis: {{range: [-1.1, 1.1], gridcolor:'#222'}} }};
                 if (!initMean) {{ Plotly.newPlot(meanDiv, [traceMean], layoutMean, commonConfig); initMean = true; }}
                 else {{ Plotly.react(meanDiv, [traceMean], layoutMean, commonConfig); }}
     # --- Calculations ---
     imb_x, imb_y = [], []
+    diff_x, diff_y = [], []
+    avg_diff_x, avg_diff_y = [], []
     mean_x, mean_y = [], []
+    running_integral_pct = 0
     if d_b_x and d_a_x:
         max_dist = min(d_b_x[-1], d_a_x[-1])
             idx_a = bisect.bisect_right(d_a_x, s)
             vol_a = d_a_y[idx_a-1] if idx_a > 0 else 0
             total_vol = vol_b + vol_a
+            # 2. Imbalance %
+            pct = ((vol_b - vol_a) / total_vol) * 100 if total_vol > 0 else 0
+            imb_x.append(s); imb_y.append(pct)
+            # 3. Net Difference (Bids - Asks)
+            diff = vol_b - vol_a
+            diff_x.append(s); diff_y.append(diff)
+            # 4. Avg Diff (Diff / Steps) -> Density
             step_count = i + 1
+            avg_diff = diff / step_count
+            avg_diff_x.append(s); avg_diff_y.append(avg_diff)
+            # 5. Mean Pressure (Integral Pct / Steps)
+            running_integral_pct += pct
+            mean_pressure = (running_integral_pct / step_count) / 100.0 # Normalize -1 to 1
+            mean_x.append(s); mean_y.append(mean_pressure)
     return web.json_response({
         "mid": mid,
         "prev_mid": market_state['history'][-2]['p'] if len(market_state['history']) > 1 else mid,
         "imbalance_vol": { "dist_bids": d_b_x, "vol_bids": d_b_y, "dist_asks": d_a_x, "vol_asks": d_a_y },
         "imbalance_pct": { "x": imb_x, "y": imb_y },
+        "diff": { "x": diff_x, "y": diff_y, "last_val": diff_y[-1] if diff_y else 0 },
+        "avg_diff": { "x": avg_diff_x, "y": avg_diff_y },
+        "mean": { "x": mean_x, "y": mean_y },
         "history": market_state['history']
     })
     site = web.TCPSite(runner, '0.0.0.0', PORT)
     await site.start()
+    print(f"🚀 BTC-USD 6-Layer Dashboard: http://localhost:{PORT}")
     await asyncio.Event().wait()
 if __name__ == "__main__":