fixed bug with code, now the graphs are interactive

app.py

@@ -8,6 +8,7 @@ import numpy as np
 from datetime import datetime
 import pytz
 import pandas as pd
+import plotly.graph_objs as go
 
 
 HOST = os.environ.get("host")
@@ -621,7 +622,7 @@ def change_experiment(ch_exp, host, port, username, password, pioreactor, exp):
     }
     client_custom.publish(f"pioreactor/control", json.dumps(payload))
     
-def on_message(client, userdata, message):
+def on_reading(client, userdata, message):
     payload = message.payload.decode("utf-8")
     data = json.loads(payload)
     global temp_graph
@@ -651,11 +652,10 @@ def get_data_default(time_scale, exp):
         "amount2": time_scale,
         "amount3": time_scale,
         "amount4": time_scale,
+        "reactor": PIOREACTOR
     }
     
-    client.publish(f"pioreactor/control", json.dumps(payload))
-    
-    client.on_message = on_message
+    client.on_message = on_reading
     client.subscribe(f"pioreactor/{PIOREACTOR}/readings")
     
     timeout = 10
@@ -671,6 +671,8 @@ def get_data_default(time_scale, exp):
     norm_od_graph = None
     growth_rate_graph = None
     
+    client.publish(f"pioreactor/control", json.dumps(payload))
+    
     while temp_graph is None and (time.time() - start) < timeout:
         time.sleep(0.1)
         
@@ -685,14 +687,17 @@ def get_data_default(time_scale, exp):
             temp["x"] = local_time.strftime("%Y-%m-%d %H:%M:%S")
         df = pd.DataFrame(temp_graph)
         df = df.set_index("x")
-        
-        plt.figure()
-        plt.plot(df.index, df["y"])
-        plt.xlabel("Time")
-        plt.ylabel("Temperature")
-        plt.title("Temperature vs Time")
-        plot1 = plt.gcf()
-        plt.close()
+
+        # plt.figure()
+        # plt.plot(df.index, df["y"])
+        # plt.xlabel("Time")
+        # plt.ylabel("Temperature")
+        # plt.title("Temperature vs Time")
+        # plot1 = plt.gcf()
+        # plt.close()
+        plot1 = go.Figure()
+        plot1.add_trace(go.Scatter(x=df.index, y=df["y"], mode="lines", name="Temperature"))
+        plot1.update_layout(title="Temperature vs Time", xaxis_title="Time", yaxis_title="Temperature")
     else:
         plot1 = None
         
@@ -706,13 +711,16 @@ def get_data_default(time_scale, exp):
         df = pd.DataFrame(od_graph)
         df = df.set_index("x")
 
-        plt.figure()
-        plt.plot(df.index, df["y"])
-        plt.xlabel("Time")
-        plt.ylabel("OD")
-        plt.title("OD vs Time")
-        plot2 = plt.gcf()
-        plt.close()
+        # plt.figure()
+        # plt.plot(df.index, df["y"])
+        # plt.xlabel("Time")
+        # plt.ylabel("OD")
+        # plt.title("OD vs Time")
+        # plot2 = plt.gcf()
+        # plt.close()
+        plot2 = go.Figure()
+        plot2.add_trace(go.Scatter(x=df.index, y=df["y"], mode="lines", name="OD"))
+        plot2.update_layout(title="OD vs Time", xaxis_title="Time", yaxis_title="OD")
     else:
         plot2 = None
         
@@ -727,13 +735,16 @@ def get_data_default(time_scale, exp):
         df = pd.DataFrame(norm_od_graph)
         df = df.set_index("x")
         
-        plt.figure()
-        plt.plot(df.index, df["y"])
-        plt.xlabel("Time")
-        plt.ylabel("Normalized OD")
-        plt.title("Normalized OD vs Time")
-        plot3 = plt.gcf()
-        plt.close()
+        # plt.figure()
+        # plt.plot(df.index, df["y"])
+        # plt.xlabel("Time")
+        # plt.ylabel("Normalized OD")
+        # plt.title("Normalized OD vs Time")
+        # plot3 = plt.gcf()
+        # plt.close()
+        plot3 = go.Figure()
+        plot3.add_trace(go.Scatter(x=df.index, y=df["y"], mode="lines", name="Normalized OD"))
+        plot3.update_layout(title="Normalized OD vs Time", xaxis_title="Time", yaxis_title="Normalized OD")
     else:
         plot3 = None
         
@@ -748,13 +759,16 @@ def get_data_default(time_scale, exp):
         df = pd.DataFrame(growth_rate_graph)
         df = df.set_index("x")
         
-        plt.figure()
-        plt.plot(df.index, df["y"])
-        plt.xlabel("Time")
-        plt.ylabel("Growth Rate")
-        plt.title("Growth Rate vs Time")
-        plot4 = plt.gcf()
-        plt.close()
+        # plt.figure()
+        # plt.plot(df.index, df["y"])
+        # plt.xlabel("Time")
+        # plt.ylabel("Growth Rate")
+        # plt.title("Growth Rate vs Time")
+        # plot4 = plt.gcf()
+        # plt.close()
+        plot4 = go.Figure()
+        plot4.add_trace(go.Scatter(x=df.index, y=df["y"], mode="lines", name="Growth Rate"))
+        plot4.update_layout(title="Growth Rate vs Time", xaxis_title="Time", yaxis_title="Growth Rate")
     else:
         plot4 = None
 
@@ -982,12 +996,10 @@ with gr.Blocks() as demo:
             time_scale = gr.Radio(label="Time Scale", choices=["1 hour", "24 hour", "All Data"])
             get_graphs = gr.Button("Get Graphs")
             
-        with gr.Row():
-            plot1 = gr.Plot()
-            plot2 = gr.Plot()
-        with gr.Row():
-            plot3 = gr.Plot()
-            plot4 = gr.Plot()
+        plot1 = gr.Plot()
+        plot2 = gr.Plot()
+        plot3 = gr.Plot()
+        plot4 = gr.Plot()
             
         get_graphs.click(
             fn=get_data_default,