Update chart_builder.py

chart_builder.py

@@ -1,80 +1,73 @@
 # chart_builder.py
-import plotly.graph_objects as go
+import plotly.graph_objs as go
 from plotly.subplots import make_subplots
 import pandas as pd
 
-def build_chart(df, indicators):
+def build_chart(data, indicators):
     """
-    df: OHLCV DataFrame with ['Open','High','Low','Close','Volume']
-    indicators: dict from indicater.py
-    Returns: HTML string of Plotly chart with JS toggles
+    data: pd.DataFrame with OHLCV
+    indicators: dict of series (MACD, RSI, SMA20, etc.)
     """
-    # --- Create subplots ---
     fig = make_subplots(
-        rows=2 + sum(1 for k in indicators if k not in ['SMA_5','SMA_10','SMA_20','SMA_50','EMA_5','EMA_10','EMA_20','EMA_50','Volume']),
-        cols=1,
+        rows=3, cols=1,
+        row_heights=[0.5, 0.2, 0.3],
         shared_xaxes=True,
-        vertical_spacing=0.03,
-        row_heights=[0.5, 0.2] + [0.2]*sum(1 for k in indicators if k not in ['SMA_5','SMA_10','SMA_20','SMA_50','EMA_5','EMA_10','EMA_20','EMA_50','Volume'])
+        vertical_spacing=0.02,
+        specs=[[{"type":"candlestick"}],
+               [{"type":"bar"}],
+               [{"type":"scatter"}]]  # indicator plot
     )
 
-    # --- Main Candle Chart ---
+    # --- Main candlestick ---
     fig.add_trace(go.Candlestick(
-        x=df.index, open=df['Open'], high=df['High'], low=df['Low'], close=df['Close'],
-        name='Price'
+        x=data.index,
+        open=data['Open'], high=data['High'],
+        low=data['Low'], close=data['Close'],
+        name='Candlestick'
     ), row=1, col=1)
 
-    # --- Add MA/EMA overlays on main chart ---
-    for key in ['SMA_5','SMA_10','SMA_20','SMA_50','EMA_5','EMA_10','EMA_20','EMA_50']:
-        if key in indicators:
+    # --- Add MA overlays on main chart ---
+    for ma_name in ['SMA20','SMA50','EMA20','EMA50']:
+        if ma_name in indicators:
             fig.add_trace(go.Scatter(
-                x=df.index, y=indicators[key],
-                mode='lines', name=key, visible=False  # initially hidden
+                x=data.index, y=indicators[ma_name],
+                mode='lines', name=ma_name,
+                visible='legendonly'  # initially hidden, toggle via legend or script
             ), row=1, col=1)
 
     # --- Volume subplot ---
     fig.add_trace(go.Bar(
-        x=df.index, y=df['Volume'], name='Volume'
+        x=data.index, y=data['Volume'],
+        name='Volume', marker_color='blue'
     ), row=2, col=1)
 
-    # --- Other indicators in separate subplots ---
-    row_counter = 3
-    for key, series in indicators.items():
-        if key in ['SMA_5','SMA_10','SMA_20','SMA_50','EMA_5','EMA_10','EMA_20','EMA_50','Volume']:
-            continue
-        fig.add_trace(go.Scatter(
-            x=df.index, y=series,
-            mode='lines', name=key, visible=False
-        ), row=row_counter, col=1)
-        row_counter += 1
-
-    fig.update_layout(
-        height=600 + 200*(row_counter-3),
-        showlegend=True,
-        margin=dict(l=40, r=40, t=40, b=40),
-        xaxis_rangeslider_visible=False
-    )
-
-    # --- Inject JS buttons to toggle visibility ---
-    buttons = []
-    for i, trace in enumerate(fig.data):
-        buttons.append(dict(
-            label=trace.name,
-            method='restyle',
-            args=['visible', [j==i for j in range(len(fig.data))]],
-        ))
+    # --- Single indicator subplot (default empty, user selects via checkbox) ---
+    for ind_name in ['MACD', 'RSI', 'Stochastic']:
+        if ind_name in indicators:
+            fig.add_trace(go.Scatter(
+                x=data.index, y=indicators[ind_name],
+                mode='lines', name=ind_name,
+                visible=False  # initially hidden, toggle via script
+            ), row=3, col=1)
 
-    fig.update_layout(
-        updatemenus=[dict(
-            type="dropdown",
-            direction="down",
-            buttons=buttons,
-            showactive=True,
-            x=1.02,
-            xanchor="left",
-            y=1.15,
-            yanchor="top"
-        )]
-    )
+    fig.update_layout(height=900, showlegend=True, margin=dict(l=20,r=20,t=40,b=20))
 
-    return fig.to_html(full_html=False)
+    # --- Inject script for checkbox toggle ---
+    script = """
+    <script>
+    function applyIndicators() {
+        var checkboxes = document.querySelectorAll('input.indicator-toggle');
+        var update = {visible: []};
+        var traces = document.querySelectorAll('g.cartesianlayer .main-svg > g');
+        checkboxes.forEach(function(cb, i){
+            var idx = parseInt(cb.dataset.trace);
+            update.visible[idx] = cb.checked;
+        });
+        Plotly.restyle('chart', update);
+    }
+    </script>
+    """
+    
+    # Return full HTML
+    chart_html = fig.to_html(full_html=False, include_plotlyjs=True, div_id="chart")
+    return chart_html + script