updated style components for the chart

Aquaveo · Nov 11, 2024 · 5e3ba67 · 5e3ba67
1 parent 65c7753
commit 5e3ba67
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 20 deletions.
diff --git a/reactapp/features/hydroFabric/components/chart.js b/reactapp/features/hydroFabric/components/chart.js
@@ -18,7 +18,7 @@ import { GlyphCircle } from "@visx/glyph";
 import { timeParse, timeFormat } from "d3-time-format";
 import { RectClipPath } from "@visx/clip-path"; // Import ClipPath
 
-function LineChart({ width, height, data }) {
+function LineChart({ width, height, data, layout }) {
   // Tooltip parameters
   const {
     tooltipData,
@@ -300,16 +300,15 @@ function LineChart({ width, height, data }) {
                   stroke="#d1d5db"
                   tickStroke="#d1d5db"
                   tickLabelProps={() => ({ fill: "#e0e0e0", fontSize: 12, fontWeight: "bold", textAnchor: "end" })}
+                  label= {layout.yaxis}
+                  labelProps={{
+                    fill: '#e0e0e0',
+                    fontSize: 14,
+                    strokeWidth: 0,
+                    paintOrder: 'stroke',
+                    fontFamily: 'sans-serif',
+                  }}
                 />
-                  <text
-                    x="-125"
-                    y="20"
-                    transform="rotate(-90)"
-                    fontSize={14}
-                    fill="#e0e0e0"
-                  >
-                    Y-axis Label
-                  </text>
                   <AxisBottom
                     scale={newXScale}
                     top={innerHeight}

diff --git a/reactapp/lib/mapUtils.js b/reactapp/lib/mapUtils.js
@@ -329,6 +329,7 @@ const displayFeatureInfo = (event,layer,hydroFabricActions) => {
               setIsLoading(false)
               return
             }
+            hydroFabricActions.reset_teehr();
             hydroFabricActions.set_catchment_id(data_catchment_id);
 
           })     // Log the actual JSON data

diff --git a/reactapp/views/ngiab/hydroFabricView.js b/reactapp/views/ngiab/hydroFabricView.js
@@ -34,8 +34,9 @@ const HydroFabricView = (props) => {
       <Suspense fallback={<LoadingAnimation />}>
        <HydroFabricPlotContainer>
           <ParentSize>
-      {({ width, height }) => 
-    <LineChart width={width} height={height} data={state.chart.series}/>}</ParentSize>
+            {({ width, height }) => 
+              <LineChart width={width} height={height} data={state.chart.series} layout={{yaxis: state.teehr.variable}}/>}
+          </ParentSize>
 
         </HydroFabricPlotContainer> 
       </Suspense>

diff --git a/tethysapp/ngiab/controllers.py b/tethysapp/ngiab/controllers.py
@@ -176,13 +176,9 @@ def getTeehrTimeSeries(request, app_workspace):
     teehr_ts_path = get_teehr_joined_ts_path(
         app_workspace, teehr_configuration, teehr_variable
     )
-    teehr_ts = get_teehr_ts(teehr_ts_path, teehr_id)
+    teehr_ts = get_teehr_ts(teehr_ts_path, teehr_id, teehr_configuration)
     teehr_metrics = get_teehr_metrics(app_workspace, teehr_id)
-    # breakpoint()
-    print(teehr_metrics)
     return JsonResponse({"metrics": teehr_metrics, "data": teehr_ts})
-    # teehr_ts = get_teehr_ts(teehr_ts_path, teehr_id)
-    # return JsonResponse({"data": teehr_ts})
 
 
 @controller(app_workspace=True)

diff --git a/tethysapp/ngiab/utils.py b/tethysapp/ngiab/utils.py
@@ -278,7 +278,7 @@ def get_teehr_joined_ts_path(app_workspace, configuration, variable):
         return None
 
 
-def get_teehr_ts(parquet_file_path, primary_location_id_value):
+def get_teehr_ts(parquet_file_path, primary_location_id_value, teehr_configuration):
     # Open DuckDB connection
     conn = duckdb.connect(database=":memory:")
 
@@ -310,8 +310,11 @@ def get_teehr_ts(parquet_file_path, primary_location_id_value):
     ]
 
     series = [
-        {"label": "primary_value", "data": primary_data},
-        {"label": "secondary_value", "data": secondary_data},
+        {"label": "USGS", "data": primary_data},
+        {
+            "label": f"{teehr_configuration.replace('_', ' ').title()}",
+            "data": secondary_data,
+        },
     ]
 
     return series