From 3461861dad50a101fcff280e9e40b82e543da3ef Mon Sep 17 00:00:00 2001 From: CarlosNasayo Date: Tue, 29 Oct 2024 00:35:57 -0500 Subject: [PATCH 1/2] added seasonal dry again --- src/src/components/legend/Legend.js | 10 +++- .../components/simpleLegend/Simplelegend.js | 6 ++- src/src/pages/monitoring/Monitoring.js | 48 ++++++++++++------- src/src/pages/profile/Profile.js | 7 ++- src/src/pages/userprofile/Userprofile.js | 5 +- 5 files changed, 54 insertions(+), 22 deletions(-) diff --git a/src/src/components/legend/Legend.js b/src/src/components/legend/Legend.js index 4cab735..0afb26d 100644 --- a/src/src/components/legend/Legend.js +++ b/src/src/components/legend/Legend.js @@ -48,7 +48,15 @@ function Legend({ setFilter, filter }) {

{t("monitoring.near")}

- +
setFilter({ ...filter, gray: !filter.gray })} + > + +

{t("monitoring.seasonally")}

+
); } diff --git a/src/src/components/simpleLegend/Simplelegend.js b/src/src/components/simpleLegend/Simplelegend.js index 37d4ea7..fa081b0 100644 --- a/src/src/components/simpleLegend/Simplelegend.js +++ b/src/src/components/simpleLegend/Simplelegend.js @@ -28,8 +28,12 @@ function Simplelegend() {

{t("monitoring.near")}

+
+ +

{t("monitoring.seasonally")}

+
); } -export default Simplelegend; +export default Simplelegend; \ No newline at end of file diff --git a/src/src/pages/monitoring/Monitoring.js b/src/src/pages/monitoring/Monitoring.js index 974e92d..42fdeab 100644 --- a/src/src/pages/monitoring/Monitoring.js +++ b/src/src/pages/monitoring/Monitoring.js @@ -123,9 +123,14 @@ function Visualization() { const depth = val.values.find( (val) => val.type === "depth" ).value; + const climatology_depth = val.values.find( + (val) => val.type === "climatology_depth" + ).value; let color; - if (depth <0.2) { + if (depth ==0 && climatology_depth == 0) { + color = "gray"; + } else if (depth >= 0 && depth < 0.2) { color = "red"; } else if (depth > 0.2 && depth < 0.3) { color = "brown"; @@ -163,7 +168,7 @@ function Visualization() {
- {/* El label que mencionas */} +
Apologies,
@@ -179,7 +184,10 @@ function Visualization() { const depthValue = monitoredData ? monitoredData.values.find((value) => value.type === "depth") : null; - + const climatology_depthValue = monitoredData + ? monitoredData.values.find((value) => value.type === "climatology_depth") + : null; + const hasContentsWp = monitoredData.am || monitoredData.or || monitoredData.en; @@ -187,11 +195,13 @@ function Visualization() { ? null : !filter.green && depthValue.value >= 0.7 ? null - : !filter.yellow && depthValue.value >= 0.3 && depthValue.value < 0.7 + : !filter.yellow && depthValue.value > 0.3 && depthValue.value < 0.7 + ? null + : !filter.brown && depthValue.value > 0.2 && depthValue.value < 0.3 ? null - : !filter.brown && depthValue.value >= 0.2 && depthValue.value < 0.3 + : !filter.red && depthValue.value < 0.2 && depthValue.value >= 0 ? null - : !filter.red && depthValue.value < 0.2 + : !filter.gray && depthValue.value === 0 && climatology_depthValue.value === 0 ? null : ( <> @@ -236,11 +246,13 @@ function Visualization() { = 0 && depthValue.value < 0.2 ? redIcon - : depthValue.value >= 0.2 && depthValue.value < 0.3 + : depthValue.value > 0.2 && depthValue.value < 0.3 ? brownIcon - : depthValue.value >= 0.3 && depthValue.value < 0.7 + : depthValue.value > 0.3 && depthValue.value < 0.7 ? yellowIcon : greenIcon } @@ -317,20 +329,24 @@ function Visualization() {
= 0 && depthValue.value < 0.2 ? "td-red" - : depthValue.value >= 0.2 && depthValue.value < 0.3 + : depthValue.value > 0.2 && depthValue.value < 0.3 ? "td-brown" - : depthValue.value >= 0.3 && depthValue.value < 0.7 + : depthValue.value > 0.3 && depthValue.value < 0.7 ? "td-yellow" : "td-green" }`} > - {depthValue.value < 0.2 + {depthValue.value == 0 && climatology_depthValue.value == 0 + ? t("monitoring.seasonally") + : depthValue.value >= 0 && depthValue.value < 0.2 ? t("monitoring.near") - : depthValue.value >= 0.2 && depthValue.value < 0.3 + : depthValue.value > 0.2 && depthValue.value < 0.3 ? t("monitoring.alert") - : depthValue.value >= 0.3 && depthValue.value < 0.7 + : depthValue.value > 0.3 && depthValue.value < 0.7 ? t("monitoring.watch") : t("monitoring.good")}
@@ -463,6 +479,7 @@ function Visualization() { } }); }; + console.log(wpstolabel) return ( <> @@ -540,7 +557,6 @@ function Visualization() { url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" /> {waterpoints && } - {route && ( ; } }; + console.log(wp) return ( <> {idWater ? ( @@ -321,9 +322,11 @@ function Waterprofile() { = 0 && wp.depth <0.2 ? redIcon - : wp.depth > 0.2 && wp.depth <0.3 + : wp.depth > 0.2 && wp.depth < 0.3 ? brownIcon : wp.depth > 0.3 && wp.depth < 0.7 ? yellowIcon diff --git a/src/src/pages/userprofile/Userprofile.js b/src/src/pages/userprofile/Userprofile.js index 6a84b7f..7ee086d 100644 --- a/src/src/pages/userprofile/Userprofile.js +++ b/src/src/pages/userprofile/Userprofile.js @@ -148,7 +148,6 @@ function Userprofile() { [event.target.name]: event.target.checked, }); }; - return ( <>
= 0 && waterpoint.last_monitored_deph < 0.2 ? "td-red" : waterpoint.last_monitored_deph > 0.2 && waterpoint.last_monitored_deph < 0.3 ? "td-brown" From d91cb412135941c4a2232b3b1988cb2bd75f52ea Mon Sep 17 00:00:00 2001 From: CarlosNasayo Date: Wed, 30 Oct 2024 00:00:15 -0500 Subject: [PATCH 2/2] new marker added --- src/src/assets/img/blackMarker.png | Bin 0 -> 3646 bytes src/src/assets/img/whiteMarker.png | Bin 0 -> 3854 bytes src/src/components/legend/Legend.css | 4 ++++ src/src/components/legend/Legend.js | 2 ++ src/src/pages/monitoring/Monitoring.js | 10 ++++++---- 5 files changed, 12 insertions(+), 4 deletions(-) create mode 100644 src/src/assets/img/blackMarker.png create mode 100644 src/src/assets/img/whiteMarker.png diff --git a/src/src/assets/img/blackMarker.png b/src/src/assets/img/blackMarker.png new file mode 100644 index 0000000000000000000000000000000000000000..2bf842c9d95ca79cd39c01da807e48fef687c346 GIT binary patch literal 3646 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 div { cursor: pointer; } +.iconBlack { + width: 32px; + height: 32px; +} \ No newline at end of file diff --git a/src/src/components/legend/Legend.js b/src/src/components/legend/Legend.js index 0afb26d..57b1369 100644 --- a/src/src/components/legend/Legend.js +++ b/src/src/components/legend/Legend.js @@ -5,6 +5,7 @@ import yellowImg from "../../assets/img/yellowMarker.png"; import brownImg from "../../assets/img/brownMarker.png"; import redImg from "../../assets/img/redMarker.png"; import grayImg from "../../assets/img/grayMarker.png"; +import blackIcon from "../../assets/img/blackMarker.png"; import { useTranslation } from "react-i18next"; function Legend({ setFilter, filter }) { @@ -57,6 +58,7 @@ function Legend({ setFilter, filter }) {

{t("monitoring.seasonally")}

+
); } diff --git a/src/src/pages/monitoring/Monitoring.js b/src/src/pages/monitoring/Monitoring.js index 42fdeab..6c76e58 100644 --- a/src/src/pages/monitoring/Monitoring.js +++ b/src/src/pages/monitoring/Monitoring.js @@ -59,6 +59,10 @@ function Visualization() { iconUrl: require(`../../assets/img/redMarker.png`), iconSize: [32, 32], }); + const blackIcon = new L.Icon({ + iconUrl: require(`../../assets/img/blackMarker.png`), + iconSize: [50, 50], + }); const grayIcon = new L.Icon({ iconUrl: require(`../../assets/img/grayMarker.png`), iconSize: [32, 32], @@ -160,12 +164,10 @@ function Visualization() { }, [filter, waterpoints]); const popupData = (wp) => { if (wp.name === "Kitala") { - if (!filter.gray) { - return null; - } + return ( - +