continue develop callbacks for plotly dash app

.gitignore

@@ -158,4 +158,5 @@ tech_tests.ipynb
 /pyquac/very_good.csv
 /pyquac/research.ipynb
 /examples/style.css
-
+/pyquac/random_example.py
+/pyquac/example_data.csv

examples/random_test.ipynb

@@ -22,7 +22,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 2,
+   "execution_count": 12,
    "metadata": {},
    "outputs": [],
    "source": [
@@ -47,7 +47,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 5,
+   "execution_count": 4,
    "metadata": {},
    "outputs": [
     {
@@ -65,7 +65,7 @@
        "        "
       ],
       "text/plain": [
-       "<IPython.lib.display.IFrame at 0x7f9811771ee0>"
+       "<IPython.lib.display.IFrame at 0x7f01dce80610>"
       ]
      },
      "metadata": {},
@@ -88,7 +88,7 @@
   },
   {
    "cell_type": "code",
-   "execution_count": 6,
+   "execution_count": 5,
    "metadata": {},
    "outputs": [],
    "source": [
@@ -577,7 +577,7 @@
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
-   "version": "3.9.13"
+   "version": "3.9.13 | packaged by conda-forge | (main, May 27 2022, 16:58:50) \n[GCC 10.3.0]"
   },
   "vscode": {
    "interpreter": {

pyproject.toml

@@ -18,6 +18,7 @@ PeakUtils = ">=1.3.3"
 matplotlib = "^3.5.2"
 dash-bootstrap-components = "^1.2.1"
 dash-bootstrap-templates = "^1.0.7"
+dash-daq = "^0.5.0"
 
 [tool.poetry.dev-dependencies]
 pytest = "^7.1.2"

pyquac/components/heatmap.py

@@ -3,86 +3,165 @@
 """
 
 from dash.dependencies import Input, Output
-import plotly.graph_objects as go
 from dash import dcc, callback
-
+import plotly.graph_objects as go
+from pyquac.settings import settings
 
 AXIS_SIZE = 13
 
 GRAPH_STYLE = {
     "position": "fixed",
-    "top": "100px",
+    "top": "110px",
     "left": "16rem",
     "bottom": 0,
     "width": "45rem",
     "height": "37rem",
     # "z-index": 1,
     "overflow-x": "hidden",
-    "transition": "all 0.5s",
+    "transition": settings.transition_time,
     # "transition-delay": "width 500ms",
     # "transition-property": "margin-right",
     # "padding": "0.5rem 1rem",
 }
 
 GRAPH_HIDEN = {
     "position": "fixed",
-    "top": "100px",
+    "top": "110px",
     "left": 0,
     "bottom": 0,
+    "right": 0,
     "width": "45rem",
     # "width": "70rem",
     "height": "37rem",
     # "z-index": 1,
-    "overflow-x": "hidden",
-    "transition": "all 0.5s",
+    # "overflow-x": "hidden",
+    "transition": settings.transition_time,
     # "transition-delay": "500ms",
     # "transition-property": "margin-right",
     # "padding": "0.5rem 1rem",
 }
 
 
+def define_figure(
+    z,
+    x,
+    y,
+    x_axis_title: str,
+    y_axis_title: str,
+    cmap: str,
+):
+    """sets figure layout
+
+    Args:
+        data (Spectroscopy): spectroscopy-like object
+
+    Returns:
+        go.gigure: plotly figure
+    """
+    fig = go.Figure(data=go.Heatmap(z=z, x=x, y=y, colorscale=cmap))
+
+    fig.update_layout(
+        xaxis_title=x_axis_title,
+        yaxis_title=y_axis_title,
+        autosize=False,
+        separators=".",
+    )
+
+    fig.update_yaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
+    fig.update_xaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
+    fig.update_layout(yaxis=dict(showexponent="none", exponentformat="e"))
+    fig.update_traces(zhoverformat=".2f")
+    fig.update_layout(width=650, height=550)
+    return fig
+
+
+def define_figure_extend(
+    z,
+    x,
+    y,
+    x_axis_title: str,
+    y_axis_title: str,
+    cmap: str,
+):
+    """sets figure layout
+
+    Args:
+        data (Spectroscopy): spectroscopy-like object
+
+    Returns:
+        go.gigure: plotly figure
+    """
+    fig = go.Figure(data=go.Heatmap(z=z, x=x, y=y, colorscale=cmap))
+
+    fig.add_trace(go.Scatter(x=None, y=None, mode="lines", xaxis="x2"))
+
+    fig.update_layout(
+        xaxis_title=x_axis_title,
+        yaxis_title=y_axis_title,
+        autosize=False,
+        separators=".",
+    )
+
+    fig.update_layout(
+        autosize=False,
+        xaxis=dict(zeroline=False, domain=[0, 0.60], showgrid=False),
+        # yaxis=dict(zeroline=False, domain=[0, 0.85], showgrid=False),
+        xaxis2=dict(zeroline=False, domain=[0.60, 1], showgrid=False),
+        # yaxis2=dict(zeroline=False, domain=[0.85, 1], showgrid=False),
+        bargap=0,
+        hovermode="closest",
+    )
+
+    fig.update_yaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
+    fig.update_xaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
+    fig.update_layout(yaxis=dict(showexponent="none", exponentformat="e"))
+    # fig.update_traces(zhoverformat=".2f")
+    fig.update_layout(width=850, height=550)
+    return fig
+
+
 def figure_layout(
     data,
-    x_axis_title: str = "Voltages, V",
-    y_axis_title: str = "Frequencies, GHz",
-    cmap: str = "rdylbu",
+    x_axis_title: str,
+    y_axis_title: str,
+    cmap: str,
 ):
     """constructor for heatmap layout
 
     Args:
         data (pandas DataFrame): DataFrame with the columns in the following order: [x, y, z]
     """
-
-    def define_figure(data):
-        fig = go.Figure(
-            data=go.Heatmap(
-                z=data.iloc[:, 2], x=data.iloc[:, 0], y=data.iloc[:, 1], colorscale=cmap
-            )
-        )
-        fig.update_layout(
-            xaxis_title=x_axis_title,
-            yaxis_title=y_axis_title,
-            autosize=False,
-            separators=".",
-        )
-
-        fig.update_yaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
-        fig.update_xaxes(title_font={"size": AXIS_SIZE}, tickfont_size=AXIS_SIZE)
-        fig.update_layout(yaxis=dict(showexponent="none", exponentformat="e"))
-        fig.update_traces(zhoverformat=".2f")
-        fig.update_layout(width=650, height=550)
-        return fig
-
-    figure = dcc.Graph(id="heatmap", figure=define_figure(data), style=GRAPH_STYLE)
+    z = data.njit_result
+    x = data.x_1d
+    y = data.y_1d
+    figure = dcc.Graph(
+        id="heatmap",
+        figure=define_figure(
+            z=z,
+            x=x,
+            y=y,
+            x_axis_title=x_axis_title,
+            y_axis_title=y_axis_title,
+            cmap=cmap,
+        ),
+        style=GRAPH_STYLE,
+    )
     return figure
 
 
 @callback(
     Output("heatmap", "style"),
+    Output("heatmap", "figure"),
     Input("btn_sidebar", "n_clicks"),
     Input("side_click", "data"),
+    Input("z_store", "data"),
+    Input("x_store", "data"),
+    Input("y_store", "data"),
+    Input("x_label", "data"),
+    Input("y_label", "data"),
+    Input("cmap", "data"),
 )
-def toggle_graph(n, nclick):
+def toggle_graph(n, nclick, z, x, y, x_label, y_label, cmap):
     """function to hide and reveal sidebar
 
     Args:
@@ -92,12 +171,49 @@ def toggle_graph(n, nclick):
     Returns:
         dict: style objects
     """
+    fig = define_figure(
+        z,
+        x,
+        y,
+        x_label,
+        y_label,
+        cmap,
+    )
     if n:
         if nclick == "SHOW":
             graph_style = GRAPH_STYLE
+            fig = define_figure(
+                z,
+                x,
+                y,
+                x_label,
+                y_label,
+                cmap,
+            )
         else:
             graph_style = GRAPH_HIDEN
+            fig = define_figure_extend(
+                z,
+                x,
+                y,
+                x_label,
+                y_label,
+                cmap,
+            )
     else:
         graph_style = GRAPH_STYLE
 
-    return graph_style
+    return graph_style, fig
+
+
+# @callback(
+#     Output("heatmap", "figure"),
+#     Input("interval-graph-update", "n_intervals"),
+#     Input("z_store", "data"),
+#     State("heatmap", "figure"),
+# )
+# def update_graph(i, z, fig):
+
+#     if i == 0:
+#         raise PreventUpdate
+#     return go.Figure(fig).update_traces(z=z)