diff --git a/public/js/appChart.js b/public/js/appChart.js index b4d1e7bc401630ba49b551cabfc22a718c5da02e..4ab1d8accff72d414bf271295482630c6b87f8cf 100644 --- a/public/js/appChart.js +++ b/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: diff --git a/public/js/src_modules/dropDownListChartColumn.mjs b/public/js/src_modules/dropDownListChartColumn.mjs index 7c2aeee80ad43a592c9d9a2bbf56c39f05547251..78bf21d68719ae008868a02075ab78c31c823914 100644 --- a/public/js/src_modules/dropDownListChartColumn.mjs +++ b/public/js/src_modules/dropDownListChartColumn.mjs @@ -1,5 +1,9 @@ "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 + ); + } +}; diff --git a/public/js/src_modules/dropDownListChartHeatmap.mjs b/public/js/src_modules/dropDownListChartHeatmap.mjs index cad77602c6c55491a624c9430a4f3a22326338aa..d5ee1b6cb068ebc6f9e1ec43e890d5259c8c6977 100644 --- a/public/js/src_modules/dropDownListChartHeatmap.mjs +++ b/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 diff --git a/public/js/src_modules/dropDownListChartScatterPlot.mjs b/public/js/src_modules/dropDownListChartScatterPlot.mjs index 9307a48dfd99cc8c016923b8c194b25c33e703a4..1f42d2fb8df7d56dc9d01aac856667b47e5a7623 100644 --- a/public/js/src_modules/dropDownListChartScatterPlot.mjs +++ b/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 ) {