mirror of
https://github.com/Hestia-Homes/assessment-model.git
synced 2026-06-08 11:37:25 +00:00
Adding new solar page
This commit is contained in:
parent
5927a7d2be
commit
36c6e33a38
2 changed files with 79 additions and 2 deletions
|
|
@ -89,3 +89,17 @@ export interface SolarInterface {
|
|||
updatedAt: Date;
|
||||
googleApiResponse: GoogleApiResponse;
|
||||
}
|
||||
|
||||
export interface RoofSegment {
|
||||
segmentIndex: number;
|
||||
areaMeters2: number;
|
||||
groundAreaMeters2: number;
|
||||
sunshineQuantiles: number[];
|
||||
center: {
|
||||
latitude: number;
|
||||
longitude: number;
|
||||
};
|
||||
pitchDegrees: number;
|
||||
azimuthDegrees: number;
|
||||
planeHeightAtCenterMeters: number;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,9 +3,13 @@ import {
|
|||
LightBulbIcon,
|
||||
SunIcon,
|
||||
InformationCircleIcon,
|
||||
CloudIcon,
|
||||
SparklesIcon,
|
||||
} from "@heroicons/react/24/outline";
|
||||
import { getPropertyMeta } from "../utils";
|
||||
import { getSolarData } from "./utils";
|
||||
import FeatureTable from "@/app/components/building-passport/FeatureTable";
|
||||
import { roofSegmentsColumns } from "./roof-segments-table";
|
||||
|
||||
export default async function SolarAnalysisPage({
|
||||
params,
|
||||
|
|
@ -33,11 +37,41 @@ export default async function SolarAnalysisPage({
|
|||
panelHeightMeters,
|
||||
panelCapacityWatts,
|
||||
panelLifetimeYears,
|
||||
maxSunshineHoursPerYear,
|
||||
carbonOffsetFactorKgPerMwh,
|
||||
roofSegmentStats,
|
||||
} = solarData.googleApiResponse.solarPotential;
|
||||
|
||||
const getDirectionFromAzimuth = (azimuth: number): string => {
|
||||
if ((azimuth >= 330 && azimuth <= 360) || (azimuth >= 0 && azimuth < 30))
|
||||
return "N";
|
||||
if (azimuth >= 30 && azimuth < 60) return "NE";
|
||||
if (azimuth >= 60 && azimuth < 120) return "E";
|
||||
if (azimuth >= 120 && azimuth < 150) return "SE";
|
||||
if (azimuth >= 150 && azimuth < 210) return "S";
|
||||
if (azimuth >= 210 && azimuth < 240) return "SW";
|
||||
if (azimuth >= 240 && azimuth < 300) return "W";
|
||||
if (azimuth >= 300 && azimuth < 330) return "NW";
|
||||
return "";
|
||||
};
|
||||
|
||||
const transformedRoofSegmentStats = roofSegmentStats.map(
|
||||
({ segmentIndex, stats, center, azimuthDegrees, ...rest }) => ({
|
||||
...rest,
|
||||
areaMeters2: stats.areaMeters2.toFixed(1),
|
||||
groundAreaMeters2: stats.groundAreaMeters2.toFixed(1),
|
||||
azimuthDegrees: azimuthDegrees.toFixed(1),
|
||||
center: {
|
||||
latitude: center.latitude.toFixed(6),
|
||||
longitude: center.longitude.toFixed(6),
|
||||
},
|
||||
sunshineQuantiles: stats.sunshineQuantiles.join(", "), // Join sunshineQuantiles into a string
|
||||
direction: getDirectionFromAzimuth(azimuthDegrees),
|
||||
})
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="leading-loose tracking-wider">
|
||||
<div className="flex py-8 text-lg">Solar Analysis</div>
|
||||
<div className="py-8 max-w-7xl mx-auto">
|
||||
<div className="bg-white shadow-md rounded-lg p-6 mb-8 w-full">
|
||||
<h2 className="text-l font-semibold text-gray-800 mb-4">
|
||||
|
|
@ -70,7 +104,36 @@ export default async function SolarAnalysisPage({
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Add more sections here as needed */}
|
||||
|
||||
<div className="bg-white shadow-md rounded-lg p-6 mb-8 w-full">
|
||||
<h2 className="text-l font-semibold text-gray-800 mb-4">
|
||||
Weather and Environmental Data
|
||||
</h2>
|
||||
<div className="flex flex-col space-y-4">
|
||||
<div className="flex items-center p-4 bg-indigo-50 rounded-lg shadow w-full">
|
||||
<CloudIcon className="w-6 h-6 text-indigo-500 mr-2" />
|
||||
<p className="text-lg text-gray-700">
|
||||
Max Sunshine Hours per Year: {maxSunshineHoursPerYear} hours
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex items-center p-4 bg-teal-50 rounded-lg shadow w-full">
|
||||
<SparklesIcon className="w-6 h-6 text-teal-500 mr-2" />
|
||||
<p className="text-lg text-gray-700">
|
||||
Carbon Offset Factor: {carbonOffsetFactorKgPerMwh} kg/MWh
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-white shadow-md rounded-lg p-6 mb-8 w-full">
|
||||
<h2 className="text-l font-semibold text-gray-800 mb-4">
|
||||
Roof Segments Data
|
||||
</h2>
|
||||
<FeatureTable
|
||||
data={transformedRoofSegmentStats}
|
||||
columns={roofSegmentsColumns}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue