Update app.py

app.py

@@ -45,28 +45,27 @@ def create_pyodide_interface():
                     indexURL: "https://cdn.jsdelivr.net/pyodide/v0.24.1/full/"
                 });
                 
-                updateStatus('📦 Loading Python packages (numpy, matplotlib, pandas, plotly)...', 'blue');
+                updateStatus('📦 Loading Python packages (numpy, matplotlib, pandas, bokeh)...', 'blue');
                 
-                await pyodide.loadPackage(["numpy", "matplotlib", "pandas", "plotly"]);
+                await pyodide.loadPackage(["numpy", "matplotlib", "pandas", "bokeh"]);
                 updateStatus('📦 All packages loaded, setting up backends...', 'blue');
                 
-                // Set up matplotlib backend for web - IMPROVED VERSION
+                // Update the Python setup:
                 pyodide.runPython(`
                     import matplotlib
                     matplotlib.use('AGG')
                     import matplotlib.pyplot as plt
                     import numpy as np
                     import pandas as pd
-                    import plotly.graph_objects as go
-                    import plotly.express as px
-                    import plotly
+                    from bokeh.plotting import figure, show, output_file
+                    from bokeh.models import HoverTool
+                    from bokeh.io import export_png
                     import io
                     import base64
-                    import json
                     
                     # Global variables for plot data
                     _current_plot_data = None
-                    _current_plotly_data = None
+                    _current_bokeh_html = None
                     
                     def capture_matplotlib():
                         global _current_plot_data
@@ -85,13 +84,15 @@ def create_pyodide_interface():
                             print(f"Matplotlib capture error: {e}")
                             return None
                     
-                    def capture_plotly(fig):
-                        global _current_plotly_data
+                    def capture_bokeh(bokeh_fig):
+                        global _current_bokeh_html
                         try:
-                            _current_plotly_data = fig.to_html(include_plotlyjs='cdn', div_id='plotly-div')
-                            return _current_plotly_data
+                            from bokeh.embed import file_html
+                            from bokeh.resources import CDN
+                            _current_bokeh_html = file_html(bokeh_fig, CDN, "Bokeh Plot")
+                            return _current_bokeh_html
                         except Exception as e:
-                            print(f"Plotly capture error: {e}")
+                            print(f"Bokeh capture error: {e}")
                             return None
                     
                     # Override functions
@@ -100,24 +101,22 @@ def create_pyodide_interface():
                         return capture_matplotlib()
                     plt.show = custom_show
                     
-                    # Override plotly show
-                    original_plotly_show = go.Figure.show
-                    def custom_plotly_show(self, *args, **kwargs):
-                        return capture_plotly(self)
-                    go.Figure.show = custom_plotly_show
+                    # Custom bokeh show function
+                    def show_bokeh(fig):
+                        return capture_bokeh(fig)
                     
                     def get_matplotlib_data():
                         return _current_plot_data
                     
-                    def get_plotly_data():
-                        return _current_plotly_data
+                    def get_bokeh_data():
+                        return _current_bokeh_html
                     
                     def clear_plot_data():
-                        global _current_plot_data, _current_plotly_data
+                        global _current_plot_data, _current_bokeh_html
                         _current_plot_data = None
-                        _current_plotly_data = None
+                        _current_bokeh_html = None
                     
-                    print("Pyodide ready with matplotlib AND plotly support!")
+                    print("Pyodide ready with matplotlib AND bokeh support!")
                 `);
                 
                 pyodideReady = true;
@@ -170,13 +169,13 @@ def create_pyodide_interface():
                 
                 // Get both types of plot data
                 let matplotlibData = pyodide.runPython('get_matplotlib_data()');
-                let plotlyData = pyodide.runPython('get_plotly_data()');
+                let bokehData = pyodide.runPython('get_bokeh_data()');
                 
                 console.log('Stdout length:', stdout ? stdout.length : 0);
                 console.log('Matplotlib data length:', matplotlibData ? matplotlibData.length : 0);
-                console.log('Plotly data length:', plotlyData ? plotlyData.length : 0);
+                console.log('Bokeh data length:', bokehData ? bokehData.length : 0);
                 console.log('Matplotlib data preview:', matplotlibData ? matplotlibData.substring(0, 50) + '...' : 'None');
-                console.log('Plotly data preview:', plotlyData ? plotlyData.substring(0, 50) + '...' : 'None');
+                console.log('Bokeh data preview:', bokehData ? bokehData.substring(0, 50) + '...' : 'None');
                 
                 // Display results
                 let outputDiv = document.getElementById('pyodide-output');
@@ -202,12 +201,12 @@ def create_pyodide_interface():
                     `;
                 }
                 
-                if (plotlyData) {
+                if (bokehData) {
                     plotHtml += `
                         <div style="margin: 10px 0;">
-                            <h5>📊 Interactive Plotly Plot:</h5>
+                            <h5>📊 Interactive Bokeh Plot:</h5>
                             <div style="border: 1px solid #ddd; border-radius: 3px;">
-                                ${plotlyData}
+                                ${bokehData}
                             </div>
                         </div>
                     `;