shirking chart, adding title, hoisting imports

app.py

@@ -3,6 +3,11 @@ import json, requests
 from flask import Flask, request, session, render_template, redirect, url_for, Response, send_file
 from flask_session import Session
 
+import pandas as pd
+import numpy as np
+from matplotlib.figure import Figure
+import matplotlib.dates as mdates
+import base64
 from tqdm import tqdm
 
 from io import BytesIO
@@ -163,43 +168,29 @@ def camera_status_plot(esn=None):
 
     cam = een.get_camera_by_id(esn)
 
-    import pandas as pd
-    import numpy as np
-    from matplotlib.figure import Figure
-    import matplotlib.dates as mdates
-    import base64
-
     atm_df = pd.DataFrame(cam.events['status'][::-1], columns=['id', 'startTimestamp', 'actorId', 'data'])
     atm_df['ts'] = pd.to_datetime(atm_df.startTimestamp)
     atm_df['status_desc'] = atm_df['data'].apply(lambda x:  x[0]['newStatus']['connectionStatus'])
     atm_df['status'] = atm_df['status_desc'].replace(to_replace=['online', 'offline', 'error', 'deviceOffline', 'deviceOnline', 'off', 'bridgeOffline'], value=[1,0,0,0,0,0,0])
     imp = atm_df.set_index(['ts'])
 
-    # Generate the figure **without using pyplot**.
-    fig = Figure(figsize=(16, 12), dpi=80)
-    ax = fig.subplots()
-
     imp['startTimestamp'] = pd.to_datetime(imp['startTimestamp'])
     imp = imp.drop(['id', 'actorId', 'data', 'status_desc'], axis=1)
     data = imp.resample('S').bfill()
     data['status'] = data['status'].astype('int64')
 
-    print(len(data))
-    print(data.info())
-    print(data)
-
     data = data.drop(['startTimestamp'], axis=1)
 
-    print(data)
+    # Generate the figure **without using pyplot**.
+    fig = Figure(figsize=(6, 5), dpi=160)
+    ax = fig.subplots()
 
-    ax.step(data.index, data['status'], lw=5, color='blue')
+    ax.step(data.index, data['status'], lw=2, color='blue')
+    ax.set_title(cam.name)
     # ax.fill_between(data['startTimestamp'], data['status'])
     ax.axhline(1, color='green', lw=2, alpha=0.3)
     ax.axhline(0, color='red', lw=2, alpha=0.3)
-    # ax.set_title('Manual DateFormatter', loc='left', y=0.85, x=0.02, ontsize='medium')
-    # Text in the x-axis will be displayed in 'YYYY-mm' format.
-    # ax.xaxis.set_major_formatter(mdates.DateFormatter('%Y-%b'))
-    # Rotates and right-aligns the x labels so they don't crowd each other.
+
     for label in ax.get_xticklabels(which='major'):
         label.set(rotation=30, horizontalalignment='right')
 
@@ -209,7 +200,7 @@ def camera_status_plot(esn=None):
     fig.savefig(buf, format="png")
     # Embed the result in the html output.
     data = base64.b64encode(buf.getbuffer()).decode("ascii")
-    return f"<div class='col-md-12'><img src='data:image/png;base64,{data}' width=100%/></div>"
+    return f"<div class='col-md-12'><img src='data:image/png;base64,{data}' width=70%/></div>"