diff --git a/client/src/components/Benchmarking.js b/client/src/components/Benchmarking.js
index de9d28b..644a088 100644
--- a/client/src/components/Benchmarking.js
+++ b/client/src/components/Benchmarking.js
@@ -4,10 +4,11 @@ import { Map } from "react-map-gl";
import { IconLayer } from "@deck.gl/layers";
import axios from "axios";
import mapbox_token from "./mapbox_token.js";
-import BenchmarkingData from './BenchmarkingData.js';
+import BenchmarkingData from "./BenchmarkingData.js";
const MAPBOX_ACCESS_TOKEN = mapbox_token;
-const MAP_STYLE = "https://basemaps.cartocdn.com/gl/positron-gl-style/style.json";
+const MAP_STYLE =
+ "https://basemaps.cartocdn.com/gl/positron-gl-style/style.json";
const INITIAL_VIEW_STATE = {
longitude: -111,
@@ -20,7 +21,9 @@ const INITIAL_VIEW_STATE = {
const getBenchmarkingCollection = async () => {
try {
- const response = await axios.get("http://localhost:8080/benchmarking/getAll");
+ const response = await axios.get(
+ "http://localhost:8080/benchmarking/getAll"
+ );
if (response.data) {
console.log("Data received:", response.data);
return response.data;
@@ -65,7 +68,8 @@ export default function Benchmarking() {
id: "icon-layer",
data: benchmarkingData,
pickable: true,
- iconAtlas: "https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/icon-atlas.png",
+ iconAtlas:
+ "https://raw.githubusercontent.com/visgl/deck.gl-data/master/website/icon-atlas.png",
iconMapping: ICON_MAPPING,
getIcon: (d) => "marker",
sizeScale: 6,
@@ -75,7 +79,7 @@ export default function Benchmarking() {
});
return (
-
+
{isPanelOpen && selectedSite && (
-
-
-
+
);
-}
\ No newline at end of file
+}
diff --git a/client/src/components/BenchmarkingData.js b/client/src/components/BenchmarkingData.js
index 8d16ea8..537f888 100644
--- a/client/src/components/BenchmarkingData.js
+++ b/client/src/components/BenchmarkingData.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
import {
Box,
Typography,
@@ -61,17 +61,33 @@ export default function BenchmarkingData({ selectedSite, model, chooseModel }) {
{selectedSite.siteID}
- {selectedSite.siteInfo.doe_climate_zone}
+
+ {selectedSite.siteInfo.doe_climate_zone}
+
{selectedSite.siteInfo.city}
{selectedSite.siteInfo.state}
{selectedSite.siteInfo.zip}
- {selectedSite.siteInfo.number_of_floor}
- {selectedSite.siteInfo.total_building_area_ft2}
- {selectedSite.siteInfo.net_selling_area_ft2}
- {selectedSite.siteInfo.total_stock_area_ft2}
- {selectedSite.siteInfo.number_of_HVAC}
- {selectedSite.siteInfo.program}
- {selectedSite.siteInfo.utility}
+
+ {selectedSite.siteInfo.number_of_floor}
+
+
+ {selectedSite.siteInfo.total_building_area_ft2}
+
+
+ {selectedSite.siteInfo.net_selling_area_ft2}
+
+
+ {selectedSite.siteInfo.total_stock_area_ft2}
+
+
+ {selectedSite.siteInfo.number_of_HVAC}
+
+
+ {selectedSite.siteInfo.program}
+
+
+ {selectedSite.siteInfo.utility}
+
@@ -90,11 +106,19 @@ export default function BenchmarkingData({ selectedSite, model, chooseModel }) {
value={model}
onChange={chooseModel}
>
-
+
-
-
-
+
+
+
@@ -111,24 +135,42 @@ export default function BenchmarkingData({ selectedSite, model, chooseModel }) {
Peak OAT (°F)
Event Average OAT (°F)
Peak Demand Intensity (W/ft²)
- Avg. Demand Decrease Intensity (W/ft²)
+
+ Avg. Demand Decrease Intensity (W/ft²)
+
{createFieldMetricBaselineRegressionRows().map((row) => (
{row.event_id}
- {moment.utc(row.event_date).format("MM/DD/YY")}
- {moment.utc(row.shed_start_time_date).tz("America/Los_Angeles").hour(moment(row.shed_start_time_date).hours() - 1).format("MM/DD/YYYY HH:mm:ss")}
+ {moment.utc(row.event_date).format("MM/DD/YY")}
- {moment.utc(row.shed_end_time_date).tz("America/Los_Angeles").hour(moment(row.shed_end_time_date).hours() - 1).format("MM/DD/YYYY HH:mm:ss")}
+ {moment
+ .utc(row.shed_start_time_date)
+ .tz("America/Los_Angeles")
+ .hour(moment(row.shed_start_time_date).hours() - 1)
+ .format("MM/DD/YYYY HH:mm:ss")}
+
+
+ {moment
+ .utc(row.shed_end_time_date)
+ .tz("America/Los_Angeles")
+ .hour(moment(row.shed_end_time_date).hours() - 1)
+ .format("MM/DD/YYYY HH:mm:ss")}
{parseInt(row.peak_oat)}
- {parseInt(row.event_avg_oat)}
- {Math.round(row.peak_demand_intensity_wft2 * 100) / 100}
- {Math.round(row.shed_avg_wft2 * 100) / 100}
+
+ {parseInt(row.event_avg_oat)}
+
+
+ {Math.round(row.peak_demand_intensity_wft2 * 100) / 100}
+
+
+ {Math.round(row.shed_avg_wft2 * 100) / 100}
+
))}
@@ -136,4 +178,4 @@ export default function BenchmarkingData({ selectedSite, model, chooseModel }) {
);
-}
\ No newline at end of file
+}