diff --git a/typescript/frontend-marios2/src/Resources/formatPower.tsx b/typescript/frontend-marios2/src/Resources/formatPower.tsx index 4a7a04d67..ae957bce0 100644 --- a/typescript/frontend-marios2/src/Resources/formatPower.tsx +++ b/typescript/frontend-marios2/src/Resources/formatPower.tsx @@ -39,7 +39,10 @@ export function findPower(value) { value = Math.abs(value); // Calculate the power of 10 that's greater or equal to the absolute value - const exponent = Math.floor(Math.log10(value)); + const exponent = + value < 1 + ? -(Math.floor(Math.abs(Math.log10(value))) + 1) + : Math.floor(Math.log10(value)); // Compute the nearest power of 10 const nearestPowerOf10 = Math.pow(10, exponent); diff --git a/typescript/frontend-marios2/src/components/Footer/index.tsx b/typescript/frontend-marios2/src/components/Footer/index.tsx index 25f436bb0..239c9a31e 100644 --- a/typescript/frontend-marios2/src/components/Footer/index.tsx +++ b/typescript/frontend-marios2/src/components/Footer/index.tsx @@ -18,7 +18,7 @@ function Footer() { > - © 2023 - InnovEnergy AG + © 2024 - InnovEnergy AG 0, then we have 2 stacked bars, one with positive and one with negative values, so each one of them should have border radius. \ + //Otherwise, we have a single bar or two stacked bars either with positive or negative values. + borderRadius: chartInfo.min <= 0 && chartInfo.max > 0 ? [10] : 10, dataLabels: { position: 'top' } @@ -253,13 +258,29 @@ export const getChartOptions = ( : chartInfo.max <= 0 ? Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * findPower(chartInfo.min).value + : Math.abs(chartInfo.min) < 1 + ? -Math.max( + Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * + findPower(chartInfo.min).value, + Math.ceil(chartInfo.max / findPower(chartInfo.max).value) * + findPower(chartInfo.max).value + ).toFixed(2) : undefined, max: chartInfo.min >= 0 - ? Math.ceil(chartInfo.max / findPower(chartInfo.max).value) * - findPower(chartInfo.max).value + ? +( + Math.ceil(chartInfo.max / findPower(chartInfo.max).value) * + findPower(chartInfo.max).value + ).toFixed(2) : chartInfo.max <= 0 ? 0 + : Math.abs(chartInfo.min) < 1 + ? +Math.max( + Math.ceil(chartInfo.min / findPower(chartInfo.min).value) * + findPower(chartInfo.min).value, + Math.ceil(chartInfo.max / findPower(chartInfo.max).value) * + findPower(chartInfo.max).value + ).toFixed(2) : undefined, title: { text: chartInfo.unit, @@ -282,11 +303,9 @@ export const getChartOptions = ( tooltip: { y: { formatter: function (val) { - return ( - formatPowerForGraph(val, chartInfo.magnitude).value.toFixed(2) + - ' ' + - chartInfo.unit - ); + return val < 1 + ? val.toFixed(3) + ' ' + chartInfo.unit + : val.toFixed(2) + ' ' + chartInfo.unit; } } } diff --git a/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx b/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx index 6dccbfe55..8e2de0acd 100644 --- a/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx +++ b/typescript/frontend-marios2/src/content/dashboards/Overview/overview.tsx @@ -786,7 +786,12 @@ function Overview(props: OverviewProps) { } } }} - series={[dailyDataArray[chartState].chartData.soc]} + series={[ + { + ...dailyDataArray[chartState].chartData.soc, + color: '#69d2e7' + } + ]} type="area" height={400} /> @@ -890,7 +895,12 @@ function Overview(props: OverviewProps) { } } }} - series={[dailyDataArray[chartState].chartData.dcPower]} + series={[ + { + ...dailyDataArray[chartState].chartData.dcPower, + color: '#69d2e7' + } + ]} type="area" height={400} /> @@ -1004,7 +1014,11 @@ function Overview(props: OverviewProps) { } }} series={[ - dailyDataArray[chartState].chartData.pvProduction + { + ...dailyDataArray[chartState].chartData + .pvProduction, + color: '#ff9900' + } ]} type="area" height={400} @@ -1102,7 +1116,10 @@ function Overview(props: OverviewProps) { } }} series={[ - dailyDataArray[chartState].chartData.gridPower + { + ...dailyDataArray[chartState].chartData.gridPower, + color: '#ff3333' + } ]} type="area" height={400} @@ -1160,124 +1177,124 @@ function Overview(props: OverviewProps) { )} - {dailyData && currentUser.hasWriteAccess && ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - )} + {/*{dailyData && currentUser.hasWriteAccess && (*/} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/* */} + {/*)}*/} )} diff --git a/typescript/frontend-marios2/src/interfaces/Chart.tsx b/typescript/frontend-marios2/src/interfaces/Chart.tsx index 536b27a42..c316c039b 100644 --- a/typescript/frontend-marios2/src/interfaces/Chart.tsx +++ b/typescript/frontend-marios2/src/interfaces/Chart.tsx @@ -93,6 +93,8 @@ export const transformInputToDailyData = async ( }; }); + let adjustedTimestampArray = []; + let startTimestampToNum = Number(startTimestamp); if (startTimestampToNum % 2 != 0) { startTimestampToNum += 1; @@ -100,22 +102,32 @@ export const transformInputToDailyData = async ( let startUnixTime = UnixTime.fromTicks(startTimestampToNum); let diff = endTimestamp.ticks - startUnixTime.ticks; + const timestampPromises = []; + while (startUnixTime < endTimestamp) { - let result = await Promise.resolve(fetchData(startUnixTime, s3Credentials)); + timestampPromises.push(fetchData(startUnixTime, s3Credentials)); + + startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + diff / 100); + if (startUnixTime.ticks % 2 !== 0) { + startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1); + } + const adjustedTimestamp = new Date(startUnixTime.ticks * 1000); + adjustedTimestamp.setHours(adjustedTimestamp.getHours() + 1); + adjustedTimestampArray.push(adjustedTimestamp); + } + + const results = await Promise.all(timestampPromises); + + for (let i = 0; i < results.length; i++) { + const result = results[i]; if ( result === FetchResult.notAvailable || result === FetchResult.tryLater ) { // Handle not available or try later case } else { - //console.log('Received data:', result); // eslint-disable-next-line @typescript-eslint/no-loop-func pathsToSearch.forEach((path) => { - const timestamp = startUnixTime.ticks * 1000; - - const adjustedTimestamp = new Date(timestamp); - adjustedTimestamp.setHours(adjustedTimestamp.getHours() + 1); - if (result[path]) { const value = result[path]; @@ -127,21 +139,13 @@ export const transformInputToDailyData = async ( overviewData[path].max = value.value; } - data[path].push([adjustedTimestamp, value.value]); + data[path].push([adjustedTimestampArray[i], value.value]); } else { //data[path].push([adjustedTimestamp, null]); } }); } - - startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + diff / 100); - if (startUnixTime.ticks % 2 != 0) { - startUnixTime = UnixTime.fromTicks(startUnixTime.ticks + 1); - } - - console.log('Try next timestamp: ', startUnixTime); } - pathsToSearch.forEach((path) => { let value = Math.max( Math.abs(overviewData[path].max), @@ -234,9 +238,6 @@ export const transformInputToDailyData = async ( ) }; - console.log('min = ', chartOverview.overview.min); - console.log('max = ', chartOverview.overview.max); - return { chartData: chartData, chartOverview: chartOverview @@ -302,31 +303,25 @@ export const transformInputToAggregatedData = async ( }; }); - let fake_data = [ - 'temp0', - 'temp1', - 'temp2', - 'temp3', - 'temp4', - 'temp5', - 'temp6' - ]; + const timestampPromises = []; while (currentDay.isBefore(currentDate)) { - //for (let i = 0; i < 7; i++) { - // console.log('Current day:', currentDay.format('YYYY-MM-DD')); - - let result = await Promise.resolve( + timestampPromises.push( fetchDailyData(currentDay.format('YYYY-MM-DD'), s3Credentials) - //fetchDailyData(fake_data[i], s3Credentials) ); + currentDay = currentDay.add(1, 'day'); + } + + const results = await Promise.all(timestampPromises); + + for (let i = 0; i < results.length; i++) { + const result = results[i]; if ( result === FetchResult.notAvailable || result === FetchResult.tryLater ) { // Handle not available or try later case } else { - console.log('Received data:', result); dateList.push(currentDay.format('DD-MM')); pathsToSearch.forEach((path) => { if (result[path]) { @@ -337,12 +332,13 @@ export const transformInputToAggregatedData = async ( if (result[path].value > overviewData[path].max) { overviewData[path].max = result[path].value; } + if (path === '/SumGridExportPower' && result[path].value < 0.1) { + result[path].value = 0.3; + } data[path].push(result[path].value as number); } }); } - // Add one day to move to the next day - currentDay = currentDay.add(1, 'day'); } pathsToSearch.forEach((path) => { @@ -419,14 +415,12 @@ export const transformInputToAggregatedData = async ( overviewData['/SumGridExportPower'].magnitude ), unit: '(kWh)', - min: Math.min( - overviewData['/SumGridImportPower'].min, - overviewData['/SumGridExportPower'].min - ), - max: Math.max( - overviewData['/SumGridImportPower'].max, + min: + overviewData['/SumGridImportPower'].min + + overviewData['/SumGridExportPower'].min, + max: + overviewData['/SumGridImportPower'].max + overviewData['/SumGridExportPower'].max - ) }; chartOverview.overview = {