New function: draw column chart selection-based

This function wraps the logic for drawing column charts based on the
selected options for both raw and aggregated observations

public/js/appChart.js

@@ -21,8 +21,6 @@ import { formatSensorThingsApiResponseForLineOrColumnChart } from "./src_modules
 
 import { drawLineChartHighcharts } from "./src_modules/chartLine.mjs";
 
-import { drawColumnChartHighcharts } from "./src_modules/chartColumn.mjs";
-
 import {
   showLoadingSpinner,
   hideLoadingSpinner,
@@ -49,13 +47,13 @@ import {
   getAbbreviationsForSelectedOptionsFromAllDropDownLists,
 } from "./src_modules/dropDownListHelpers.mjs";
 
-import { drawColumnChartBasedOnSelectedAggregationOptions } from "./src_modules/dropDownListChartColumn.mjs";
+import { drawColumnChartBasedOnSelectedOptions } from "./src_modules/dropDownListChartColumn.mjs";
 
 import { drawHeatmapBasedOnSelectedOptions } from "./src_modules/dropDownListChartHeatmap.mjs";
 
 import { drawLineChartBasedOnSelectedAggregationOptions } from "./src_modules/dropDownListChartLine.mjs";
 
-import { drawScatterPlotFromChartSelection } from "./src_modules/dropDownListChartScatterPlot.mjs";
+import { drawScatterPlotBasedOnSelectedOptions } from "./src_modules/dropDownListChartScatterPlot.mjs";
 
 /**
  * Callback function that wraps the logic of populating the linked drop down lists.
@@ -229,7 +227,7 @@ const drawChartUsingSelectedOptions = async function () {
             selectedAggregationOptionsAreValid &&
             selectedBuildingDataPointsOptionsAreValid
           ) {
-            drawScatterPlotFromChartSelection(
+            drawScatterPlotBasedOnSelectedOptions(
               observationsComboNestedFinalArr,
               rawObsExtractedFormattedDatastreamProperties
             );
@@ -266,34 +264,15 @@ const drawChartUsingSelectedOptions = async function () {
           }
           break;
 
-        // We are interested in BOTH raw observations and aggregated observations
         case "Column":
-          // Raw observations
-          if (selectedAggregationType === "None (raw data)") {
-            // Create formatted array(s) for observations
-            const formattedRawObservationsColumnChartNestedArr =
-              observationsComboNestedFinalArr.map((observationsArr) =>
-                formatSensorThingsApiResponseForLineOrColumnChart(
-                  observationsArr
-                )
-              );
-
-            drawColumnChartHighcharts(
-              formattedRawObservationsColumnChartNestedArr,
-              rawObsExtractedFormattedDatastreamProperties
-            );
-          }
-          // Aggregated observations
-          else {
-            drawColumnChartBasedOnSelectedAggregationOptions(
-              selectedAggregationType,
-              selectedAggregationDuration,
-              observationsComboNestedFinalArr,
-              selectedSamplingRateAbbrev,
-              uniqueCalendarDatesNestedArr,
-              formattedMetadataNestedArr
-            );
-          }
+          drawColumnChartBasedOnSelectedOptions(
+            selectedAggregationType,
+            selectedAggregationDuration,
+            observationsComboNestedFinalArr,
+            selectedSamplingRateAbbrev,
+            uniqueCalendarDatesNestedArr,
+            formattedMetadataNestedArr
+          );
           break;
 
         default:

public/js/src_modules/dropDownListChartColumn.mjs

 "use strict";
 
+import { formatSensorThingsApiResponseForLineOrColumnChart } from "./chartHelpers.mjs";
+
+import { extractPropertiesFromFormattedDatastreamMetadata } from "./fetchedDataProcessing.mjs";
+
 import { drawColumnChartHighcharts } from "./chartColumn.mjs";
 
 import {
@@ -33,7 +37,7 @@ import {
  * @param {Array} formattedMetadataNestedArr An array of sub-arrays of formatted metadata properties
  * @returns {undefined} undefined
  */
-export const drawColumnChartBasedOnSelectedAggregationOptions = function (
+const drawColumnChartBasedOnSelectedAggregationOptions = function (
   selectedAggregationType,
   selectedAggregationDuration,
   observationsNestedArr,
@@ -157,3 +161,56 @@ export const drawColumnChartBasedOnSelectedAggregationOptions = function (
     );
   }
 };
+
+/**
+ * Draw a column chart based on the selected options from a drop-down list.
+ * This chart type supports both raw observations and aggregated observations
+ *
+ * @param {String} selectedAggregationType The selected aggregation type. The currently supported strings include `Sum`, `Maximum`, `Minimum` and `Average`
+ * @param {String} selectedAggregationDuration The selected aggregation duration. The currently supported strings include `Daily` and `Monthly`
+ * @param {Array} observationsNestedArr An array made up of sub-array(s) of observations
+ * @param {String} selectedSamplingRateAbbrev The abbreviated form of the selected sampling rate option
+ * @param {Array} uniqueCalendarDatesNestedArr An array made up of sub-array(s) of unique calendar date(s) string(s)
+ * @param {Array} formattedMetadataNestedArr An array of sub-arrays of formatted metadata properties
+ * @returns {undefined} undefined
+ */
+export const drawColumnChartBasedOnSelectedOptions = function (
+  selectedAggregationType,
+  selectedAggregationDuration,
+  observationsNestedArr,
+  selectedSamplingRateAbbrev,
+  uniqueCalendarDatesNestedArr,
+  formattedMetadataNestedArr
+) {
+  // Case 1: Raw observations
+  if (selectedAggregationType === "None (raw data)") {
+    // Create formatted array(s) for observations
+    const formattedRawObservationsColumnChartNestedArr =
+      observationsNestedArr.map((observationsArr) =>
+        formatSensorThingsApiResponseForLineOrColumnChart(observationsArr)
+      );
+
+    // Extract formatted metadata properties
+    const rawObsExtractedFormattedDatastreamProperties =
+      extractPropertiesFromFormattedDatastreamMetadata(
+        formattedMetadataNestedArr,
+        false
+      );
+
+    drawColumnChartHighcharts(
+      formattedRawObservationsColumnChartNestedArr,
+      rawObsExtractedFormattedDatastreamProperties
+    );
+  }
+  // Case 2: Aggregated observations
+  else {
+    drawColumnChartBasedOnSelectedAggregationOptions(
+      selectedAggregationType,
+      selectedAggregationDuration,
+      observationsNestedArr,
+      selectedSamplingRateAbbrev,
+      uniqueCalendarDatesNestedArr,
+      formattedMetadataNestedArr
+    );
+  }
+};

public/js/src_modules/dropDownListChartHeatmap.mjs

@@ -6,7 +6,8 @@ import {
 } from "./chartHeatmap.mjs";
 
 /**
- * Draw a heatmap based on the selected options from a drop-down list
+ * Draw a heatmap based on the selected options from a drop-down list.
+ * Currently, this chart type only supports raw observations
  *
  * @param {Array} observationsComboNestedArr An array that contains non-computed (raw) observations and computed (temperature difference, dT) observations
  * @param {Object} extractedFormattedDatastreamProperties An object that contains array(s) of formatted Datastream properties

public/js/src_modules/dropDownListChartScatterPlot.mjs

@@ -6,13 +6,14 @@ import {
 } from "./chartScatterPlot.mjs";
 
 /**
- * Draw a scatter plot based on the selected options from a drop-down list
+ * Draw a scatter plot based on the selected options from a drop-down list.
+ * Currently, this chart type only supports raw observations
  *
  * @param {Array} observationsComboNestedArr An array that contains non-computed (raw) observations and computed (temperature difference, dT) observations
  * @param {Object} extractedFormattedDatastreamProperties An object that contains array(s) of formatted Datastream properties
  * @returns {undefined} undefined
  */
-export const drawScatterPlotFromChartSelection = function (
+export const drawScatterPlotBasedOnSelectedOptions = function (
   observationsComboNestedArr,
   extractedFormattedDatastreamProperties
 ) {