only display output charts for categories where all variables have th…

…e same units
watertap-org · Apr 11, 2024 · 11ec950 · 11ec950
1 parent f64db8d
commit 11ec950
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 6 deletions.
diff --git a/electron/ui/src/components/OutputComparisonChart/OutputComparisonChart.js b/electron/ui/src/components/OutputComparisonChart/OutputComparisonChart.js
@@ -8,7 +8,7 @@ import Plot from 'react-plotly.js';
 import { round } from '../../assets/helperFunctions';
 
 export default function OutputComparisonChart(props) {
-    const { flowsheetData, historyData } = props;
+    const { flowsheetData, historyData, categoriesWithCharts } = props;
     const [ plotData, setPlotData ] = useState({data: [], layout: []})
     const [ showPlot, setShowPlot ] = useState(false)
     const [ displayCategory, setDisplayCategory ] = useState(null)
@@ -19,7 +19,8 @@ export default function OutputComparisonChart(props) {
 
     useEffect(() => {
         try {
-            setDisplayCategory(Object.keys(historyData[0].data)[0])
+            if (categoriesWithCharts.length > 0) setDisplayCategory(categoriesWithCharts[0])
+            // setDisplayCategory(Object.keys(historyData[0].data)[0])
         } catch (e) {
             console.error(e)
         }
@@ -28,6 +29,7 @@ export default function OutputComparisonChart(props) {
 
     useEffect(() => {
         if (displayCategory) {
+            // console.log(historyData)
             let barChartKeys = []
             for (let each of historyData[0].data[displayCategory].variables) {
                 barChartKeys.push(each.obj_key)
@@ -115,13 +117,21 @@ export default function OutputComparisonChart(props) {
                                 },
                         }}
                 >
-                {Object.keys(historyData[0].data).map((k) => (
+                {/* {Object.keys(historyData[0].data).map((k) => (
                     <MenuItem
                         key={`${k}`}
                         value={k}
                         >
                         {k}
                     </MenuItem>
+                ))} */}
+                {categoriesWithCharts.map((v, idx) => (
+                    <MenuItem
+                        key={`${v}_${idx}`}
+                        value={v}
+                        >
+                        {v}
+                    </MenuItem>
                 ))}
                 </Select>
                 </FormControl>

diff --git a/electron/ui/src/views/FlowsheetConfig/ConfigOutput/OutputComparison.js b/electron/ui/src/views/FlowsheetConfig/ConfigOutput/OutputComparison.js
@@ -11,6 +11,7 @@ export default function OutputComparison(props) {
     const [ pastConfigs, setPastConfigs ] = useState([])
     const [ historyData, setHistoryData ] = useState([])
     const [ historyDataOrganized, setHistoryDataOrganized ] = useState([])
+    const [ categoriesWithCharts, setCategoriesWithCharts ] = useState([])
     const [ tabValue, setTabValue ] = useState(0)
 
     useEffect(() => {
@@ -21,8 +22,6 @@ export default function OutputComparison(props) {
           console.error("unable to organize variables")
         }
       }
-
-
     }, [historyData])
 
     useEffect(()=>{
@@ -90,7 +89,33 @@ export default function OutputComparison(props) {
             }
         }
         tempHistory.push({name: tempName, data: var_sections, raw: {data: raw_variables, inputs: raw_inputs, outputs: raw_outputs}})
-        setHistoryDataOrganized([...tempHistory])
+        // setHistoryDataOrganized([...tempHistory])
+
+        let tempHistoryDataOrganized = [...tempHistory]
+        let tempCategoriesWithCharts = []
+        for (let optimization of tempHistoryDataOrganized) {
+            // let optimization = tempHistoryDataOrganized[optimizationKey]
+            let optimizationData = optimization.data
+            for (let categoryKey of Object.keys(optimizationData)) {
+                let categoryData = optimizationData[categoryKey]
+                let categoryVariables = categoryData.output_variables
+                if (categoryVariables.length > 0) {
+                    let displayUnits = categoryVariables[0].display_units
+                    categoryData.hasChart = true
+                    for(let output_variable of categoryVariables) {
+                        // check if display units match
+                        if (output_variable.display_units !== displayUnits) {
+                            categoryData.hasChart = false
+                        }
+                    }
+                    if(categoryData.hasChart && !tempCategoriesWithCharts.includes(categoryKey)) tempCategoriesWithCharts.push(categoryKey)
+                } else {
+                    categoryData.hasChart = false
+                }
+            }
+        }
+        setHistoryDataOrganized(tempHistoryDataOrganized)
+        setCategoriesWithCharts(tempCategoriesWithCharts)
       }
 
     }
@@ -116,6 +141,7 @@ export default function OutputComparison(props) {
                 <OutputComparisonChart 
                   flowsheetData={outputData}
                   historyData={historyDataOrganized}
+                  categoriesWithCharts={categoriesWithCharts}
                 />
             }
         </Box>